GMF Partitioning based on EuGENia

GMF allows the creation of diagram models by partitioning some of its components (See GMF Partitioning). Eugenia allows to create a GMF editor through a simple script (See GMF Editor using Eugenia).

Eugenia provides several options to create customized editors. However, sometimes the patitioning strategy is necessary in order to improve the visualization of the editor.

Basic GMF editor using Eugenia

In order to create one basic editor, next metamodel called model.ecore is used. The objective is creating one diagram that allows creating storages, which can have relations to containers, which can contain elements. Storages and elements has svg icons.

Next Emfatic Source script is created by selecting model.ecore -> richt click -> Generate Emfatic Source and complemented with the customized features of the editor

@namespace(uri="partitioning", prefix="partitioning")
package partitioning;

@gmf.diagram(model.extension="partitioning", diagram.extension="partitioning_diagram")
class Model {
  val Storage[*] storages;

  val Container[*] containers;
}

@gmf.node(figure="svg", svg.uri="platform:/plugin/emf.examples.partitioning/icons/storage.svg", label.icon="false", label="name", label.pattern="{0}", size="60,60")
class Storage {
  attr String[1] name;

  @gmf.link(target.decoration="arrow", source.decoration="none", style="dash", color="0,0,0")
  ref Container[*] storageContainers;
}

@gmf.node(figure="rounded", label.icon="false", label="name", label.pattern="{0}", size="200,200")
class Container {
  attr String[1] name;

  @gmf.compartment(layout="free")
  val Element[*] elements;
}

@gmf.node(figure="svg", svg.uri="platform:/plugin/emf.examples.partitioning/icons/element.svg", label.icon="false", label="name", label.pattern="{0}", size="60,60")
class Element {
  attr String[1] name;
}

Projects presented in next figure have been generated. SVG icons are located in the folder icons of the project emf.examples.partitioning

Next figure presents the editor created

Partitioning using Eugenia

Now, the purpose is creating one diagram that allows creating storages, which can have relations to containers. Moreover, if doble clicking the container, a new diagram will be opened for drawing elements. This partitioning can be done using GMF (See: GMF Partitioning); however, in this case Eugenia is useful in order to customize SVG icons.

Model editor (main diagram)

For creating the main diagram which can contain storages and containers, the Emfatic Source has been modified. In this case, the @gmf anotation for the class Element, and for the relation elements in the class Container have been removed. The script is as follows.

@namespace(uri="partitioning", prefix="partitioning")
package partitioning;

@gmf.diagram(model.extension="partitioning", diagram.extension="partitioning_diagram")
class Model {
  val Storage[*] storages;

  val Container[*] containers;
}

@gmf.node(figure="svg", svg.uri="platform:/plugin/emf.examples.partitioning/icons/storage.svg", label.icon="false", label="name", label.pattern="{0}", size="60,60")
class Storage {
  attr String[1] name;

  @gmf.link(target.decoration="arrow", source.decoration="none", style="dash", color="0,0,0")
  ref Container[*] storageContainers;
}

@gmf.node(figure="rounded", label.icon="false", label="name", label.pattern="{0}", size="200,200")
class Container {
  attr String[1] name;

  val Element[*] elements;
}

class Element {
  attr String[1] name;
}

Next figure presents the editor generated with this new script

Container editor (sub diagram)

In order to create the container diagram, a new EMF empty project has been created. In this project, The next Emfatic Source script called container.emf has been created. This script includes only the concepts Container and Element.

@namespace(uri="partitioning", prefix="partitioning")
package partitioning;

@gmf.diagram(model.extension="partitioningcontainer", diagram.extension="partitioningcontainer_diagram")
class Container {
  attr String[1] name;

  val Element[*] elements;
}

@gmf.node(figure="svg", svg.uri="platform:/plugin/emf.examples.partitioning/icons/element.svg", label.icon="false", label="name", label.pattern="{0}", size="60,60")
class Element {
  attr String[1] name;
}

Next figure presents the editor generated with this script

Linking Diagrams

So far, both editors are independent. In order to join both editors, the files container.gmftool and container.gmfgraph have been copied to the model editor in the folder model.

Based on the files model.ecore, container.gmftool and container.gmfgraph the file container.gmfmap is created (See GMF Partitioning).

• Note 1: Be sure that the file container.gmfmap has been created properly. Compare with the file container.gmfmap created in the independet project.
• Note 2: The purpose of creating this file again, is because if this file is copied, it can point to the metamodel (in this case container.ecore) of the previous project, insted of the proper metamodel (in this case model.ecore).
• Note 3: If the file is copied, also it can be changed by replacing the name of the metamodel using one plain text editor. However, this solution can generate further errors.

Based on the file container.gmfmap the file continer.gmfgen is created (See GMF Partitioning).

The file container.gmfgen must be configured (See GMF Partitioning)

1. Select Gen Editor Generator
• Change Domain File Extension (e.g. partitioningcontainer)
• Change ModelID (e.g. PartitioningContainer)
• Change Package Name Prefix (e.g. partitioning.diagram.container)
2. Select Gen Editor Generator > Gen Plugin
• Change ID (e.g. emf.examples.partitioning.diagram.container)
• Change Name (e.g. Partitioning Container Plugin)
3. Select Gen Editor Generator > Gen Editor View
• Get the Editor View ID (It will be used in the next configuration). In this case
  partitioning.diagram.container.part.PartitioningDiagramEditorID

The file model.gmfgen must be configured (See GMF Partitioning)

1. Select Gen Editor Generator > Gen Diagram > Gen Top Level ContainerEditPart
2. Right click > New Child > Open Diagram Behaviour
3. Select Gen Editor Generator > Gen Diagram > Gen Top Level ContainerEditPart > Open Diagram Behaviour
• Set Diagram Kind with the Gen Editor Generator ModelID value of the container.gmfgen. In this case
  PartitioningContainer
• Set Editor ID with the Gen Editor View ID value of the container.gmfgen. In this case
  partitioning.diagram.container.part.PartitioningDiagramEditorID
• Change Edit Policy Class Name Editor. It has a default value. (e.g. OpenDiagramContainerEditPolicy)

Create Diagram Projects

Create both diagram projects

1. Select Generator Model of the main diagram. In this case model.gmfgen
2. Right click > Create diagram code
3. Select Generator Model of the sub diagram. In this case container.gmfgen
4. Right click > Create diagram code

If SVG icons are used, next dependences must be included: org.eclipse.gmf.runtime.lite and org.eclipse.gmf.runtime.lite.svg. Those dependences must be added in the file plugin.xml of the project diagram. These dependences require GMF SDK Experimental

Results

Now, it is posible to create models with storages and containers. By double clicking on containers, a new diagram is opened for creating elements inside the correspondent container.