Slide présentation de MAD. Un plugin Eclipse pour l'édition des propriétés des modèles EMF. MAD est un outil réalisé pour se substituer à la vue standard des propriétés. il permet à partir d'une configuration de présenter une interface de saisie personalisée de type formulaire pour chaque type d'élément édité. Il ne nécessite aucune génération de code et toute modification de la configuration est prise en compte immédiatement.

1. SYSORD - Model Agregator eDitor – Fabien Vignal – Stephan Montagnes – Philippe Palau 1
MAD
Model Aggregator eDitor
Fabien Vignal – Philippe Palau
Http://www.sysord.com

2. SYSORD - Model Agregator eDitor – Fabien Vignal – Stephan Montagnes – Philippe Palau 2
Qui sommes nous ?
Ingénieurs en développement
SYSORD
- Petite société (3 personnes) basée à Roquefort (12)
- Eclipse, RCP, Java, J2EE
- Création de progiciels pour l'Industrie agroalimentaire
Intérêt pour la MDA et l'automatisation
Approche empirique avant EMF

3. SYSORD - Model Agregator eDitor – Fabien Vignal – Stephan Montagnes – Philippe Palau 3
Motivations
Utilisation quotidienne de modeleurs EMF / UML
Vue des propriétés
- Pas très ergonomique
- Pas toujours adaptée au besoin

4. SYSORD - Model Agregator eDitor – Fabien Vignal – Stephan Montagnes – Philippe Palau 4
Ce qui serait Bien ...
Formulaire de saisie avec widgets adaptés
Choisir les propriétés en fonction de ses besoins
Organisation du formulaire adaptée
Navigation entre éléments

5. SYSORD - Model Agregator eDitor – Fabien Vignal – Stephan Montagnes – Philippe Palau 5
MAD :Model Aggregator
eDitor
Vidéo MAD avec UML (http://youtu.be/ACFS6ajAsV8)

6. SYSORD - Model Agregator eDitor – Fabien Vignal – Stephan Montagnes – Philippe Palau 6
Concepts de MAD (Configuration)
Utilisation des métamodèles
Description des vues
- Template par EClassifier
- Composées de widgets configurables
- Valeurs obtenues par des requêtes
Réutilisation des templates
- Héritage (implicite / explicite)
- Composition
Configuration appliquée immédiatement
- Pas de code
- Pas de génération

7. SYSORD - Model Agregator eDitor – Fabien Vignal – Stephan Montagnes – Philippe Palau 7
Concepts de MAD (Edition / Sauvegarde)
Edition de l'élément sélectionné
Modification des propriétés par des widgets
Validation des valeurs avant application
Deux catégories de modèles
- Modèle principal
- Modèle étranger
MAD n'enregistre que les modèles étrangers

8. SYSORD - Model Agregator eDitor – Fabien Vignal – Stephan Montagnes – Philippe Palau 8
Architecture
Architecture orientée service
Trois plugins principaux
- API : interfaces (services / objets)
- Core : implémentations
- UI : implémentation vue Eclipse

9. SYSORD - Model Agregator eDitor – Fabien Vignal – Stephan Montagnes – Philippe Palau 9
Core
Services principaux
- View Builder
- Configuration Manager
- Model Access Object
- Query Evaluation Service
Core fournit des Implémentations par défaut
Tout service peut être remplacé ou personnalisé

10. SYSORD - Model Agregator eDitor – Fabien Vignal – Stephan Montagnes – Philippe Palau 10
UI
Utilise le Core pour obtenir le modèle de la vue
Vue Eclipse (SWT)
Personnalisation
- Extension des services ViewBuilder et WidgetBuilder
- Nouveaux Widgets personnalisés
- Nouveau type de rendu : (JavaFx / HTML)

11. SYSORD - Model Agregator eDitor – Fabien Vignal – Stephan Montagnes – Philippe Palau 11
Technologies Utilisées
Eclipse
Xtext (éditeur de configuration + DSL)
SWT + FormToolKit / Vue Eclipse
Evaluateurs de requêtes
- OCL
- Acceleo
EMF Adapters (synchronisation des modèles)
Injection de dépendances avec Guice

12. SYSORD - Model Agregator eDitor – Fabien Vignal – Stephan Montagnes – Philippe Palau 12
Requêtes (I)
Requêtes
"authors" aucun langage n'est défini, OCL est utilisé par défaut.
language:ACCELEO call authorsOfSeveralBooks() appel d'un Query Acceleo
language:MAD "CREATE('books')" fonction MAD pour un créer un nouveau livre.
Chaînes de requêtes
Query Chain {
"books->last()",
language: ACCELEO call authorMultiBook(),
"first()"
}

13. SYSORD - Model Agregator eDitor – Fabien Vignal – Stephan Montagnes – Philippe Palau 13
Requêtes (II)
Sous requêtes
eContainer().oclAsType(Library).books->select(pages > [pages])->isEmpty()
Le premier 'pages' s'applique aux livres de l'itération, '[pages]' évalué avant l'itération
correspond au nombre de pages du livre du contexte.
Variables contextuelles
$CONTEXT, $VALUE, $UIVALUE, $MODEL … variables utilisables dans les requêtes.
$UIVALUE > 10 and $UIVALUE < 10000
Règle de validation utilisant la valeur saisie dans le widget.
Besoin d'espionner les évaluateurs

14. SYSORD - Model Agregator eDitor – Fabien Vignal – Stephan Montagnes – Philippe Palau 14
MAD en Action
Le modèle Tinylibrary

15. SYSORD - Model Agregator eDitor – Fabien Vignal – Stephan Montagnes – Philippe Palau 15
Configuration tinylibrary.mad
Import base de configuration MAD
Import métamodèle de Tinylibrary

16. SYSORD - Model Agregator eDitor – Fabien Vignal – Stephan Montagnes – Philippe Palau 16
Widgets
Palette de widgets configurables
InputWidgets
- Texte, Nombre, Date, Booléen
- ComboBox, Liste, PickList (popup ou embarqué)
- Editeur Xtext embarqué
OutputWidget
NavigationWidget
FlexibleWidget
Command
Extension possible par implémentation personnalisée

17. SYSORD - Model Agregator eDitor – Fabien Vignal – Stephan Montagnes – Philippe Palau 17
Une Première Configuration (I)
//------------------------------------------
// MAD configuration for Tiny library model
//------------------------------------------
//MAD base configuration import
import "platform:/resource/mad.configuration/config.mad"
//Tiny library Ecore metamodel import
import
"platform:/plugin/com.sysord.mad.demo.tinylibrary/model/tinylibrary.ecore"
//Configuration for a Book element
Configuration BOOK for tinylibrary.Book {
template:
//Textbox widget for editing title property
widget:Title //the widget id
label:"Title" //widget label
type:TEXT_WIDGET //display a text widget
value:"title" //Ocl query for getting the 'title' property from the book.
}

18. SYSORD - Model Agregator eDitor – Fabien Vignal – Stephan Montagnes – Philippe Palau 18
Une Première Configuration (II)

19. SYSORD - Model Agregator eDitor – Fabien Vignal – Stephan Montagnes – Philippe Palau 19
Widgets Simples
Configuration BOOK for tinylibrary.Book {
//Format expression for all Book elements Label computing
//queries between [] are evaluated parts.
label provider:"Book: [title]"
template:
...
//Number input widget
widget:Pages
label:"Pages"
type:NUMBER_WIDGET
value:"pages"
//Date input widget
widget:PublicationDate
label:"Publication date"
type:DATE_WIDGET
value:"published"
//Checkbox widget
widget:Damaged
label:"Is damaged"
type:BOOL_WIDGET
value:"damaged"
}

20. SYSORD - Model Agregator eDitor – Fabien Vignal – Stephan Montagnes – Philippe Palau 20
Widgets Listes
Le contenu des listes (les candidats) est fourni par des requêtes
//Configuration for a Book element
Configuration BOOK for tinylibrary.Book {
...
//Combo widget
widget:Category
label:"Category"
type:SINGLE_SELECT_WIDGET
value:"category":tinylibrary.BookCategory
//OCL query for filling combo
candidates:"BookCategory.allInstances()"
//Popup PickList widget
widget:Authors
//Dynamic label value
label:"[authors->size()] authors"
type:MULTI_SELECT_WIDGET:POPUP_PICKLIST
value:"authors"
//Populate the list with candidates query results
candidates:"eContainer().oclAsType(Library).writers"
item label:"[name]"
}

21. SYSORD - Model Agregator eDitor – Fabien Vignal – Stephan Montagnes – Philippe Palau 21
Widget de Navigation
Liste de liens vers la vue détaillée d'un élément
Accès au détail d'un élément par double-clic
Retour par utilisation de la flèche vers la gauche
//Configuration for the Library element
Configuration LIBRARY for tinylibrary.Library {
template:
//Navigation for accessing Book detail
widget:BooksNavigation
label:"Books"
type:NAVIGATION_WIDGET
candidates:"books"
}

22. SYSORD - Model Agregator eDitor – Fabien Vignal – Stephan Montagnes – Philippe Palau 22
Widget Pour l'Affichage
Affichage de valeurs en lecture seule
Propriétés élémentaires ou valeurs calculées
Configuration BOOK for tinylibrary.Book {
...
//Output text
widget:avgPage
label:"Pages by author"
type:OUTPUTTEXT_WIDGET
//conditional visibility
visible when:"not authors->isEmpty()"
//Compute pages average by authors.
value:"(pages / authors->size())"
//value converter from double to string.
valueConverter:DOUBLE
}

23. SYSORD - Model Agregator eDitor – Fabien Vignal – Stephan Montagnes – Philippe Palau 23
Le Widget Flexible (I)
//Configuration for a person element (abstract)
Configuration Abstract_PERSON for tinylibrary.Person {
label provider:"[name]"
template:
widget:Name
...
widget:FirstName
...
widget:LastName
...
}
//Configuration for a Writer element.
//(extends implicitly Person configuration)
Configuration WRITER for tinylibrary.Writer {
template:
widget:Books
label:"Books"
type:FLEXIBLE_WIDGET
//include Book template for each writen book
value:"books"
}

24. SYSORD - Model Agregator eDitor – Fabien Vignal – Stephan Montagnes – Philippe Palau 24
Le Widget Flexible (II)
Sélection du template à utiliser pour les éléments du flexible
//Alternative configuration for a Book element
Configuration BOOK_SHORT for tinylibrary.Book {
//Explicit extension
extends: BOOK //Reuse the BOOK template
template:
//Display only those widgets
layout: Isbn Title
}
Configuration WRITER for tinylibrary.Writer {
template:
widget:Books
label:"Books"
type:FLEXIBLE_WIDGET
//Use the BOOK_SHORT template
//for book detail.
flexible template: BOOK_SHORT
value:"books"
}

25. SYSORD - Model Agregator eDitor – Fabien Vignal – Stephan Montagnes – Philippe Palau 25
Commande
//Icon declaration
Use icon DELETE_ICON URI:"platform:/resource/mad.configuration/icons/delete-icon_16.png"
//Shared command declaration
Common Command DELETE_ELEMENT_COMMAND {
ITEM_COMMAND
"Delete item" //Command label
icon:DELETE_ICON //Image for the command button
//launch the DELETE MAD Macro for deleting selected item
action: language:MAD "DELETE()"
on success: Reload view
}
Configuration LIBRARY for tinylibrary.Library {
template:
widget:BooksNavigation
label:"Books"
type:NAVIGATION_WIDGET
candidates:"books"
commands:
//Inner command for creating a new book
GLOBAL_COMMAND "New Book"
action: language:MAD "CREATE([OCL:'books'])"
//after creation displays view
//for the created item: the command RESULT.
on success: Display view for "$RESULT",
//Use shared command with label override
DELETE_ELEMENT_COMMAND("Delete the selected book.")
}

26. SYSORD - Model Agregator eDitor – Fabien Vignal – Stephan Montagnes – Philippe Palau 26
Autres Widgets
- Xtext embedded editor
- Widgets personnalisés :
- HTML Link
- Google Map widget
Vidéos de démonstration de la première version de MAD:
MAD and Xtext (http://youtu.be/ShoLi5XoQOw)
MAD is customizable (http://youtu.be/2NTAP--Hi1I)

27. SYSORD - Model Agregator eDitor – Fabien Vignal – Stephan Montagnes – Philippe Palau 27
« Layout »
Répartition des widgets par onglet
Sélection de l'ordre d'affichage
//tab declaration
UI Tab {
id:WRITEN_BOOKS
label:"Writen books"
}
Configuration WRITER for tinylibrary.Writer {
template:
widget:Books
//the widget will be diplayed
//on the WRITEN_BOOKS tab
tab:WRITEN_BOOKS
label:"Books"
type:FLEXIBLE_WIDGET
flexible template: BOOK_SHORT
value:"books"
//widgets display order definition
layout: LastName FirstName Name Books
}

28. SYSORD - Model Agregator eDitor – Fabien Vignal – Stephan Montagnes – Philippe Palau 28
Validateurs
Validation à base de règles
Configuration BOOK for tinylibrary.Book {
…
//Number input widget
widget:Pages
label:"Pages"
type:NUMBER_WIDGET
value:"pages"
validators:
//Validation: pages widget must be filled
//and its value between 10 and 10000
validation rule:
"not $UIVALUE.oclIsUndefined()"
I18N Error message:"REQUIRED_VALUE"
validation rule:
"$UIVALUE > 10 and $UIVALUE < 10000"
I18N Error message:"VALUE_OUT_OF_RANGE[10][10000]"
…
}

29. SYSORD - Model Agregator eDitor – Fabien Vignal – Stephan Montagnes – Philippe Palau 29
Layers
Filtrer et rassembler les informations par domaine
Les « Layers » sont hiérarchiques et superposables
//Layers configuration
Layer INFO_LAYER {
label:"All Information"
Sub layers {
Layer BASIC {label:"Basic information"}
Layer DETAILED{label:"Additional information"}
}
}
Layer STATISTICS_LAYER {
label:"Statistics"
Sub layers {
Layer AUTHOR{label:"Authors statistics"}
Layer BOOKS{label:"Books statistics"}
}
}
Configuration BOOK_SHORT for tinylibrary.Book {
...
widget:Pages
//available only in books statistics layer
layers: STATISTICS_LAYER.BOOKS
...
//Output text
widget:avgPage
//available in the two layers
layers:STATISTICS_LAYER.BOOKS,
STATISTICS_LAYER.AUTHOR
label:"Pages by author"
...
}

30. SYSORD - Model Agregator eDitor – Fabien Vignal – Stephan Montagnes – Philippe Palau 30
Autres Fonctionnalités
I18N : pour tous les labels et messages
Référentiels : Requêtes, Commandes, Constantes
Edition multimodèles (décoration et extension)
- Extension manager
- Synchronisation entre modèles.

31. SYSORD - Model Agregator eDitor – Fabien Vignal – Stephan Montagnes – Philippe Palau 31
Cas d'Utilisation
Utilisation dans les approches MDE/MDA sous
Eclipse
Approche RAD : création d'un éditeur avec
l'utilisateur
Edition identique quel que soit le modeleur
Mise à disposition de commandes spécifiques
au domaine.

32. SYSORD - Model Agregator eDitor – Fabien Vignal – Stephan Montagnes – Philippe Palau 32
Conclusion
MAD est fonctionnel
Utilisé par Sysord pour toutes modélisations
(UML, autres …)
Evolutions en cours : compilateur de requêtes
(optimisation des performances)

33. SYSORD - Model Agregator eDitor – Fabien Vignal – Stephan Montagnes – Philippe Palau 33
Perspectives d'Evolution
Assistants pour la création de requêtes
CDO : support du mode multi-utilisateurs
Générateur de configuration
Générateur de plugin MAD
Edition d'éléments multimédia
son, images, vidéos, Charts et Graphs.
Eclipse4, JavaFX

34. SYSORD - Model Agregator eDitor – Fabien Vignal – Stephan Montagnes – Philippe Palau 34
Merci