Skip to main content

Notice: this Wiki will be going read only early in 2024 and edits will no longer be possible. Please see: https://gitlab.eclipse.org/eclipsefdn/helpdesk/-/wikis/Wiki-shutdown-plan for the plan.

Jump to: navigation, search

Difference between revisions of "EMF Compare/Specifications/EMF Compare UI"

(EMF Compare UI Specifications [Draft])
(Part 1 - Structural Differences - )
Line 15: Line 15:
 
The EMF compare UI can be divided into two parts, the first one part is a window on top that gives structural textual description of the changes and guides the user through them, and the second part is a side by side windows approach with two version of the selected files/diagrams. As it’s very useful to provide the comparison tool with means to easily navigate through the changes, merging documents from left to right or vice-versa. The UI is also interactive as for the user, whenever clicking on an element in any of the windows – that includes also the top window with the textual description of the changes — the other two windows scroll and zoom to the corresponding position in the file/diagram.<br>
 
The EMF compare UI can be divided into two parts, the first one part is a window on top that gives structural textual description of the changes and guides the user through them, and the second part is a side by side windows approach with two version of the selected files/diagrams. As it’s very useful to provide the comparison tool with means to easily navigate through the changes, merging documents from left to right or vice-versa. The UI is also interactive as for the user, whenever clicking on an element in any of the windows – that includes also the top window with the textual description of the changes — the other two windows scroll and zoom to the corresponding position in the file/diagram.<br>
  
=== Part 1 - Structural Differences -&nbsp; ===
+
=== Part 1 - Structural Differences -&nbsp; ===
 
+
 
<center>
 
<center>
 
[[Image:WireFrameSketcherPart1.png]]  
 
[[Image:WireFrameSketcherPart1.png]]  
</center>
+
</center>  
 +
As indicated before the first part of EMF Compare UI is a window on top that represents the structural differences between a given files. Here is the decomposition of this view:
 +
 
 +
#Button ‘Export DiffModel’: Export the actual diff state with “.emfdiff” extension
 +
#Combo Box ‘Filters’:Contain 4 choices in order to filter the displayed results on the tree view [4].
 +
 
 +
i.Changed Elements ii. Added Elements iii. Moved Elements iv. Removed Elements
 +
<ol type="i">
 +
<li>Changed Elements</li>
 +
<li>Added Elements</li>
 +
<li>Moved Elements</li>
 +
<li>Removed Elements</li>
 +
</ol>
 +
 
 +
3. Combo Box ‘Groups’: A Combo box that will contain 3 choices to provide the possibility of grouping the diff&nbsp;: i. Default&nbsp;: No grouping function to apply ii. Per Kind of changes: By choosing this option the diff will be groupped by type of change [Others, Removed, Moved, Changed, Added] iii. Per Meta-Model-Elements: This option will list the Meta-Model elements that contain a modified attribute or properties → New ‘Filters’ and ‘Groups’ will be provided as extension point
 +
 
 +
4. Tree View&nbsp;: This component will be dedicated to display the structural difference between the input files and it will interact with the selected option in [2] and [3]. A selection of an element in this tree view will highlight the changed element with a corresponding color in the document which will be displayed in the next Part of the UI. The used colors are: · Blue&nbsp;: For Changes. · Green&nbsp;: For Additions. · Red&nbsp;: For conflicts (in case of three-way comparison). · Yellow: For removal.

Revision as of 07:52, 4 April 2012

EMF Compare UI Specifications [Draft]

Overview

In this document we will present the different functionalities and specifications that will be provided by the EMF Compare UI tool. The UI will contain two principal parts the first one will present the structural differences between the given files. And in the second part these differences will be highlighted into the documents given as an input and visualized into their default editor, or optionally into a textual representation. The UI will contain other functionalities such as merging documents, saving the actual comparison state, visualizing differences by categories and filtering them.

User Interface

EMF compare is a part of the Eclipse Modeling Tools and can be integrated as a plug-in into any classic Eclipse. It works for any kind of EMF-based artifact. It provides two/three-way comparison and merging functionality, and for using it, two/three document need to be selected from the Eclipse workspace. With the right-click command “Compare With each other” and according to selected file’s type, the differences and conflicts (in case of three-way comparison) are visualized in two/three-base manner. In the case of the three-way comparison, additionally to the tree-based presentation the differences and the conflicts are visualized between the edited model versions into three different windows representing Ancestor, V0, and V1 of the documents highlighted with colors (blue for changes , yellow for removal , green for the addition and red for conflicts) . The result of comparison can be saved as “emfdiff” but not as text file and provides the following executable operations. The changes can be “copied” from the left model artifact (V0) to the right one (V1) and vice-versa. Here is the suggested User Interface of the EMF compare tool.

Wre.png

User Interface decomposition

The EMF compare UI can be divided into two parts, the first one part is a window on top that gives structural textual description of the changes and guides the user through them, and the second part is a side by side windows approach with two version of the selected files/diagrams. As it’s very useful to provide the comparison tool with means to easily navigate through the changes, merging documents from left to right or vice-versa. The UI is also interactive as for the user, whenever clicking on an element in any of the windows – that includes also the top window with the textual description of the changes — the other two windows scroll and zoom to the corresponding position in the file/diagram.

Part 1 - Structural Differences - 

WireFrameSketcherPart1.png

As indicated before the first part of EMF Compare UI is a window on top that represents the structural differences between a given files. Here is the decomposition of this view:

  1. Button ‘Export DiffModel’: Export the actual diff state with “.emfdiff” extension
  2. Combo Box ‘Filters’:Contain 4 choices in order to filter the displayed results on the tree view [4].

i.Changed Elements ii. Added Elements iii. Moved Elements iv. Removed Elements

  1. Changed Elements
  2. Added Elements
  3. Moved Elements
  4. Removed Elements

3. Combo Box ‘Groups’: A Combo box that will contain 3 choices to provide the possibility of grouping the diff : i. Default : No grouping function to apply ii. Per Kind of changes: By choosing this option the diff will be groupped by type of change [Others, Removed, Moved, Changed, Added] iii. Per Meta-Model-Elements: This option will list the Meta-Model elements that contain a modified attribute or properties → New ‘Filters’ and ‘Groups’ will be provided as extension point

4. Tree View : This component will be dedicated to display the structural difference between the input files and it will interact with the selected option in [2] and [3]. A selection of an element in this tree view will highlight the changed element with a corresponding color in the document which will be displayed in the next Part of the UI. The used colors are: · Blue : For Changes. · Green : For Additions. · Red : For conflicts (in case of three-way comparison). · Yellow: For removal.

Back to the top