Some Eclipse Foundation services are deprecated, or will be soon. Please ensure you've read this important communication.

Bug 422294

Summary: [Outliner] Style the outline using images and additional css classes
Product: [ECD] Orion Reporter: Curtis Windatt <curtis.windatt.public>
Component: ClientAssignee: Curtis Windatt <curtis.windatt.public>
Status: RESOLVED FIXED QA Contact:
Severity: normal    
Priority: P3 CC: antonm, Michael_Rennie
Version: 5.0   
Target Milestone: 5.0 M2   
Hardware: PC   
OS: Windows 7   
Whiteboard:
Bug Depends on: 423962    
Bug Blocks: 424361    
Attachments:
Description Flags
An outline with images and 'details' text none

Description Curtis Windatt CLA 2013-11-21 17:03:15 EST
As we work on improving the JSDoc outline, one thing we would like to add is icons to help users differentiate between types of entries (along with JSDoc vs parsed entries).

Since we can add css classes, I could set a background image, but it conflicts with the expand arrows which are inlined.  I tweaked the outliner.js code to set the css classes on the div beside the entry rather than the whole block.  This can work, but I think it makes more sense to just support an image in the API.

I could see us also wanting the ability to embed more complex content in the outline, such as a string with several links and styles.  We could also use this bug to discuss what changes could be made to the tree widget.
Comment 1 Curtis Windatt CLA 2013-12-12 17:49:21 EST
Created attachment 238306 [details]
An outline with images and 'details' text

Example of how you can style the outliner with my proposed changes.
Comment 2 Curtis Windatt CLA 2013-12-12 18:00:37 EST
https://git.eclipse.org/r/19739
Adds new spans to each outliner item, each with a css class, allowing for images and a details span.

Also includes the changes for Bug 423962 as they involve the same code.

We could probably make this more generic having a pre/content/post spans all inside of the link.  That way the images would be linked as well (or allow 3 different font colors).  A full text styler allowing unlimited style sections would be better, but this will cover everything we want to use in the JS tooling.
Comment 3 Curtis Windatt CLA 2013-12-17 14:24:13 EST
https://git.eclipse.org/r/#/c/19916/
Updated patchset to remove the conflict.

Now there are pre, main and post sections which can be individually styled. I tested with a variety of options (no links, images, font sprites, colors, etc.).