Folie 1

Prof. Dr. Marko BogerFabio Filippelli, Markus Gerhart, Michael Bauer, Steffen Kollosche

New conceptual ideas for Spray

Folie 2

Outline

• Styling– Gradients– Highlighting (Rendering/Adoption)

• Integrate features in the Core DSL– The Figure Section– The Tooling Section– The Behavior Section– The Rule Section– PetriNet Example - „Transition“– PetriNet Example - „Arc“

• External Palette definition

Hochschule Konstanz | Fakultät Informatik

Folie 3

• Graphiti provides – definition of Gradients– the highlighting of elements (on Style)

• Idea: – Default-Gradient can be defined as background-

color– All colors (inclusively Gradients) can be used for

highlighting

Styling

Hochschule Konstanz | Fakultät Informatik

Folie 4

• As part of the Style DSL

• Generates a JvmType (as Shapes and Styles)– inherits a marker interface (ISprayGradient)

Gradients

Hochschule Konstanz | Fakultät Informatik

gradient BlueToBlack { area(color = blue, offset = 0.0) area(color = red, offset = 0.4) area(color = RGB(130, 200, 25), offset = 0.6) area(color = black, offset = 1.0)}

Folie 5

Highlighting (Rendering/Adoption)

Hochschule Konstanz | Fakultät Informatik

style StyleWithGradient { background-color = BlueToBlack gradient-orientation = vertical highlighting ( selected = MyGradient, multiselected = red, allowed = RGB(0, 255, 200), unallowed = MyUnallowedGradient )}

backgroundcolor selected multi

selected unallowed allowed

all attributes

are optional

Folie 6

• Defining Elements

Integrate features in the Core DSL

Hochschule Konstanz | Fakultät Informatik

NodeEdge

PartitionTimeline

Class

node Place for PlaceEClass { ...}

class PlaceEClass alias Place { ...}

Folie 7

Integrate features in the Core DSL

• Split the Spray Core DSL in four areas– Figure– Tooling– Behavior– Rules

• Figure contains the design of a „node“ or a „edge“• Tooling contain tool definitions as rapid-buttons,

tooltips, icon, palette and property-view• Behavior for creating, editing, drill-down and

customized behavior• Rules define the connection validation for elements

Hochschule Konstanz | Fakultät Informatik

node <Name> for <EClass> { figure { } tooling { } behavior { } rules { }}

edge <Name> for <EClass> { figure { } tooling { } behavior { } rules { }}

Folie 8

The Figure Section

• Features– Define the design for a node or edge

• Designing Shapes inline• Referencing Shapes from Shape DSL• Referencing Shapes which implements

ISprayShape/ISprayConnection– Map Ecore attributes to text areas

(incl. editable restriction and formatting rules)• Directly if inline• The id for the reference on a text area

– Map Ecore lists for compartments• Directly if inline• The id for the reference on a compartment area

Hochschule Konstanz | Fakultät Informatik

Compartments not yet defined in

the Shape DSL

Folie 9

The Figure Section

Hochschule Konstanz | Fakultät Informatik

node Place for EcorePlace { figure PlaceShape { placeShapeId for name } ...}

shape PlaceShape { ellipse { size (width=30, height=30) } text { position (x=0, y=30) size (width=30, height=30) id = placeShapeId }}

node Place for EcorePlace { figure PlaceShape { placeShapeId for name (editable=false, format={„<<„ + name + „>>“} } ...}

node Place for EcorePlace { figure { ellipse { size (width=30, height=30) } text for name { position (x=0, y=30) size (width=30, height=30) } } ...}

Shape Inline

Shape in ShapeDSL

Folie 10

The Tooling Section

• Features– Define rapid-buttons for nodes– Tooltips on nodes and edges– Icon for the element– Palette naming (off-topic: maybe externalized)– Designing the Property-View (within eclipse)

Hochschule Konstanz | Fakultät Informatik

Folie 11

The Tooling Section

Hochschule Konstanz | Fakultät Informatik

node Place for EcorePlace { ... } tooling { palette “Nodes” icon “icons/PlaceIcon.gif” tooltip (“This describes a ” + name) rapid-buttons Arc, Arc to Transition, Arc to Place, Arc2 to Place property-view { tab „Main“ { name, // EString, regular expression (Start with uppercase?) description, // EString priority // EInt -> textfield (but just integers allowed) } tab „Class properties“ { visibility // EReference to Enum -> selection-box isStereotype // Eboolean -> Checkbox } } }}

add. keyword „generated“ and

use the generated SVG.

Folie 12

The Behavior Section

• Features– Allow creation of elements on diagram or

containments– Define the Edit-On-Create (aka. askFor)– Description of sub diagrams (drill-down)– Implementation of Custom Behavior

Hochschule Konstanz | Fakultät Informatik

node Place for EcorePlace { ... } behavior { createable-in diagramElements, Place.token, Token.elm edit-on-create className drill-down -> to be discussed custom // as in Spray Core (name and ref) }}

Folie 13

The Rule Section

• Features– Defining transition rules for the domain objects

• Validate edge rules• Validate node rules

• to be discussed (not final yet)

Hochschule Konstanz | Fakultät Informatik

node Place for EcorePlace { ... } rules { ArcEClass to TransitionEClass, TokenEClass, EmptyTransitionEClass }}

Folie 14

PetriNet Example - „Transition“

Hochschule Konstanz | Fakultät Informatik

node Transition for TransitionEClass { figure TransitionShape { transitionName for name (editable=false) compartmentId for propertyList } tooling { palette “Nodes”/”Transitions” icon “icons/TransitionIcon.gif” tooltip (“This Transition is named ” + name + “.”) rapid-buttons Arc, Arc to Place, ArrowArc to Place, Arc to Token property-view { tab „Main“ { name, description } } } behavior { createable-in diagramElements, LaneEclass.elements, NodesEClass.transition edit-on-create className // drill-down -> to be defined custom showInformation, ref org.eclipselabs.spray.MyCustomFeature } rules { ArcEclass to PlaceEClass, TokenEClass FilledArrowEClass to PlaceEClass }}

Folie 15

PetriNet Example - „Arc“

Hochschule Konstanz | Fakultät Informatik

edge Arc for ArcEClass { figure ArcConnectionShape { arcName for name (editable=false) } tooling { palette “Edges” icon “icons/ArcIcon.gif” property-view { tab „Main“ { name, description } } } behavior { createable-in diagramElements, Place.token, Token.elm source sourceRef target toRef edit-on-create className custom showInformation, ref org.eclipselabs.spray.MyCustomFeature }}

no compartments

no tooltips and no rapid-buttons

rapid-button may create edge and node in

parallel!

new keywords: source and target

No Rule Section!

Folie 16

External Palette definition

• Maybe define Palette externally– Sorting of Compartments– Sorting of Elements within Compartments – Creation of Subcompartments

Hochschule Konstanz | Fakultät Informatik

palette-for-diagram mod4j { category “Nodes” { Place, category “Transitions” { Transition, EmptyTransition }, Token } category Edges { Arc }}

End

Prof. Dr. Marko Boger

Fabio FilippelliMarkus GerhartMichael BauerSteffen Kollosche