Difference between revisions of "RAP Theme Editor"

From Eclipsepedia

Jump to: navigation, search
(Features)
(Prospective Features)
 
(31 intermediate revisions by one user not shown)
Line 11: Line 11:
 
== Features ==
 
== Features ==
  
* GUI for editing all parts of a RAP theme file
+
<div style="clear: right; border: solid #aaa 1px; margin: 0 0 1em 1em; font-size: 90%; background: #f9f9f9; width: 250px; padding: 4px; text-align: left; float: right;">
* dialogs that handle input of certain property types, e.g. ColorDialog, FontDialog, FileDialog
+
'''Legend'''
* preview for each widget supported by RAP, in order to see directly an effect when changing a style value
+
* loading supported widgets and their possible properties dynamically through the *.theme.xml files associated with each RAP widget
+
* text editor included in the source tab, so that theme files can be edited by hand as well
+
* synchronization between GUI-tabs and source tab
+
* easy way of registering themes to a RAP application; rather than linking RAP theme and application manually
+
  
== Early Screenshots ==
+
[[Image:Glass.gif]] Needs some investigation/research
 +
 
 +
[[Image:Progress.gif]] Work in progress
 +
 
 +
[[Image:Ok_green.gif]] Bug fixed / Feature added
 +
</div>
 +
 
 +
[[Image:Ok_green.gif]] Multipage Editor with 3 tabs (widgets tab, rules tab, source tab) for editing all parts of a RAP theme file
 +
 
 +
[[Image:Ok_green.gif]] loading supported widgets and their possible properties dynamically through the *.theme.xml files associated with each RAP widget
 +
 
 +
[[Image:Ok_green.gif]] synchronization between GUI-tabs and source tab
 +
 
 +
[[Image:Ok_green.gif]] dialogs that handle input of certain property types, e.g. ColorDialog, FontDialog, FileDialog
 +
 
 +
[[Image:Ok_green.gif]] Redo/Undo functionality
 +
 
 +
[[Image:Ok_green.gif]] source editor, so that theme files can be edited by hand as well
 +
 
 +
[[Image:Ok_green.gif]] Problem Marker in source tab
 +
 
 +
[[Image:Ok_green.gif]] syntax coloring in source tab
 +
 
 +
[[Image:Ok_green.gif]] contribution to standard Outline view
 +
 
 +
[[Image:Ok_green.gif]] content assist in source editor
 +
 
 +
[[Image:Ok_green.gif]] text hover in source editor
 +
 
 +
== Widgets Tab ==
 +
 
 +
The widgets tab contains a "widget tree" with all supported RAP widgets. All possible properties can be set for the currently selected widget.
 +
 
 +
Using the widgets tab prevents the user from thinking about the structure of a theme file, including its inheritance. So the user can just set the properties for a desired widget.
 +
 
 +
== Rules Tab ==
 +
 
 +
A list of all rules contained in a theme file is shown in the rules tab. The selector list of each rule can be altered by adding selectors or removing applied ones. Moreover the content of a rule can be changed in a way of adding, removing or editing properties according to the desired rule.
 +
 
 +
== Source Tab ==
 +
 
 +
The source tab gives the chance of directly editing the content in the theme file. Therefore snytax coloring and content assists are provided for the following parts of a theme file: selectors, styles, states, variants and properties. Additionally, text hover information is shown if the mouse hovers such token.
 +
 
 +
Whenever the document's content has been changed, it is parsed again and accordingly problem markers are shown. These ones can either be of the type "error marker" if the parser has found a structural disorder, or of the type "warning marker" if the css structure is valid but there are parts, which are not supported by RAP, and so will be ignored.
 +
 
 +
== Prospective Features ==
 +
 
 +
[[Image:Glass.gif]] preview for all widgets in order to see directly an visual impact when changing a property
 +
 
 +
[[Image:Glass.gif]] ability to register custom widgets in order to style them as well
 +
 
 +
[[Image:Glass.gif]] element hierarchy in *.theme.xml files: This xml structure should correspond with the one in the widget tree in widget tab.
 +
 
 +
[[Image:Glass.gif]] Button, which will start the RAP application instantly with the currently opened theme file
 +
 
 +
[[Image:Glass.gif]] preference page for editor wide settings: e.g. syntax coloring, settings for content assist, widget preview, ...
 +
 
 +
[[Image:Glass.gif]] after some "refine" actions the theme file could be cluttered and unclear to read: so provide a feature that will clean up the theme file by removing unused rules or properties and merge rules with same selector list if possible
 +
 
 +
== Getting the Source ==
 +
 
 +
SVN: https://eclipse-incub.svn.sourceforge.net/svnroot/eclipse-incub/org.eclipse.rap.themeeditor
 +
 
 +
== Screenshots ==
  
 
<gallery caption="">
 
<gallery caption="">
Line 26: Line 84:
 
Image:rap-theme-editor-source-tab.png|Source Tab
 
Image:rap-theme-editor-source-tab.png|Source Tab
 
</gallery>
 
</gallery>
 +
 +
[[Category:SOC]]

Latest revision as of 13:34, 21 August 2008

Contents

[edit] Abstract

The goal of this project is to provide an Eclipse Plug-In that handles RAP theme files. At the moment RAP theme files have to be edited in a normal text editor. That is fault-prone and definitely not userfriendly. So beside syntax checking the Theme Editor will provide a graphical user interface to change several properties and values for RAP themes in an easier way.

This project is part of 2008 Google Summer of Code.

Participants:

  • Mentor: Ralf Sternberg
  • Student: Mathias Schaeffner

[edit] Features

Legend

Glass.gif Needs some investigation/research

Progress.gif Work in progress

Ok green.gif Bug fixed / Feature added

Ok green.gif Multipage Editor with 3 tabs (widgets tab, rules tab, source tab) for editing all parts of a RAP theme file

Ok green.gif loading supported widgets and their possible properties dynamically through the *.theme.xml files associated with each RAP widget

Ok green.gif synchronization between GUI-tabs and source tab

Ok green.gif dialogs that handle input of certain property types, e.g. ColorDialog, FontDialog, FileDialog

Ok green.gif Redo/Undo functionality

Ok green.gif source editor, so that theme files can be edited by hand as well

Ok green.gif Problem Marker in source tab

Ok green.gif syntax coloring in source tab

Ok green.gif contribution to standard Outline view

Ok green.gif content assist in source editor

Ok green.gif text hover in source editor

[edit] Widgets Tab

The widgets tab contains a "widget tree" with all supported RAP widgets. All possible properties can be set for the currently selected widget.

Using the widgets tab prevents the user from thinking about the structure of a theme file, including its inheritance. So the user can just set the properties for a desired widget.

[edit] Rules Tab

A list of all rules contained in a theme file is shown in the rules tab. The selector list of each rule can be altered by adding selectors or removing applied ones. Moreover the content of a rule can be changed in a way of adding, removing or editing properties according to the desired rule.

[edit] Source Tab

The source tab gives the chance of directly editing the content in the theme file. Therefore snytax coloring and content assists are provided for the following parts of a theme file: selectors, styles, states, variants and properties. Additionally, text hover information is shown if the mouse hovers such token.

Whenever the document's content has been changed, it is parsed again and accordingly problem markers are shown. These ones can either be of the type "error marker" if the parser has found a structural disorder, or of the type "warning marker" if the css structure is valid but there are parts, which are not supported by RAP, and so will be ignored.

[edit] Prospective Features

Glass.gif preview for all widgets in order to see directly an visual impact when changing a property

Glass.gif ability to register custom widgets in order to style them as well

Glass.gif element hierarchy in *.theme.xml files: This xml structure should correspond with the one in the widget tree in widget tab.

Glass.gif Button, which will start the RAP application instantly with the currently opened theme file

Glass.gif preference page for editor wide settings: e.g. syntax coloring, settings for content assist, widget preview, ...

Glass.gif after some "refine" actions the theme file could be cluttered and unclear to read: so provide a feature that will clean up the theme file by removing unused rules or properties and merge rules with same selector list if possible

[edit] Getting the Source

SVN: https://eclipse-incub.svn.sourceforge.net/svnroot/eclipse-incub/org.eclipse.rap.themeeditor

[edit] Screenshots