AUTOMATIC GENERATION OF VISUAL PROGRAMMING ENVIRONMENTS A workflow

AUTOMATIC GENERATION OF VISUAL PROGRAMMING ENVIRONMENTS A workflow Universidade do Minho, Departamento de Informática Nuno Oliveira, 2009

CONTEXT Textual Programming Languages: Require fine knowledge about their syntax; Small errors can make programming activity boring; Comprehension is very hard. Visual Programming Languages: Are intended to have a much simpler syntax, easier to recall and understand; Comprehesion should be easier; Require a sophisticated programming Env. Universidade do Minho, Departamento de Informática Nuno Oliveira, 2009 2

CONTEXT Visual Programming Environments Usually are developed from scratch, without systematization ; Code written for their development is (most of the times) hard to maintain/evolve; But the environments are efficient and support large scale specifications. Universidade do Minho, Departamento de Informática Nuno Oliveira, 2009 3

MOTIVATION Systematize the development of Visual Programming Environments, using Generators based on the Attribute Grammar of the underlying Visual Language. (work developed as a 2 nd year MSc project (UCE -15)) Universidade do Minho, Departamento de Informática Nuno Oliveira, 2009 4

OUTLINE The Generator Chosen: DEVi. L (an overview) The Case-Study: Visual. LISA VPE Development: Workflow Attribute Grammar Specification Interaction Definition Semantic Analyzer Implementation Code Generation Generated Environment Conclusion Universidade do Minho, Departamento de Informática Nuno Oliveira, 2009 5

DEVIL OVERVIEW Visual Programming Environment generator; AG-based; The AG spec is modular and symbol-oriented rather then production-oriented; Generates a simple and intuitive interface. Universidade do Minho, Departamento de Informática Nuno Oliveira, 2009 6

DEVIL – DEVELOPMENT ENVIRONMENT FOR VISUAL LANGUAGES Pros Very good support; Many examples, addressing several DEVi. L features; Exists for Mac. OS, Windows and Linux; Allows programmers to extend capabilities. Cons Complex Installation; Disperse documentation and written in German; Generated Editor is only compatible with the SO where it was developed; Universidade do Minho, Departamento de Informática Nuno Oliveira, 2009 7

CASE-STUDY: VISUALLISA Is a graphical front-end for LISA (an AG-based compiler generator). Used to visually edit LISA specifications: AGs; Aims at reducing mental effort when specifying AGs. Universidade do Minho, Departamento de Informática Nuno Oliveira, 2009 8

VISUALLISA – THE ENVIRONMENT Should verify syntactical and semantically the visual specification of the AG; Should translate the same specification into one of: Simple BNF notation; Textual LISA specification; An XML notation designed to support AG specifications; Universidade do Minho, Departamento de Informática Nuno Oliveira, 2009 9

VISUALLISA – THE VISUAL LANGUAGE Language should be production-oriented and incremental; LHS symbol’s shape should be highlighted; Connection between LHS and RHS symbols should exist; Attributes should connect to LHS and RHS symbols; Universidade do Minho, Departamento de Informática Nuno Oliveira, 2009 10

VISUALLISA – THE VISUAL LANGUAGE (2) Semantic rules should be declared: over derivation rules (productions); separated from each others; reusing the production’s structure; Functions, Lexemes and other base definitions should be allowed; The VL must hold all the generic AG’s semantic constraints. Universidade do Minho, Departamento de Informática Nuno Oliveira, 2009 11

VL Requirements VPE Generator Workflow Visual Programming Environment Universidade do Minho, Departamento de Informática Nuno Oliveira, 2009 12

WORKFLOW Attribute Grammar Specification Universidade do Minho, Departamento de Informática Nuno Oliveira, 2009 13

ATTRIBUTE GRAMMAR Modular definition of symbols; Object Oriented Approach: Grammar symbols can be seen as classes; Symbol attributes can be seen as class attributes. Syntax is defined by relations between the classes; Universidade do Minho, Departamento de Informática Nuno Oliveira, 2009 14

Model Representation CLASS Root { name: VAL VLString; semprods: SUB Semprod*; definitions: SUB Definitions!; library: SUB Library? ; } A Tree Grammar is produced 15

ATTRIBUTE GRAMMAR Abstract classes are used to group symbols and refine syntactic aspects; Coupling of grammar symbols used to replicate structures. Universidade do Minho, Departamento de Informática Nuno Oliveira, 2009 16

WORKFLOW Attribute Grammar Specification Interaction Definition Buttons Symbols L&F Universidade do Minho, Departamento de Informática Nuno Oliveira, 2009 17

INTERACTION DEFINITION Development of several files where: Views of the VL are defined; Dock Buttons are created; L&F of buttons is declared (p. e. using images); The behavior of a button is defined; Tooltips can be added; Events can be programmed to add extra behavior to the button’s actions. Universidade do Minho, Departamento de Informática Nuno Oliveira, 2009 18

INTERACTION DEFINITION A VIEW DECLARATION VIEW root. View ROOT Root { BUTTON IMAGE "img: : btn. Semprod" INSERTS Semprod INFO "Inserts a new Grammar Production"; } Universidade do Minho, Departamento de Informática Nuno Oliveira, 2009 19

INTERACTION DEFINITION Definition of canvas’ L&F: Visual Patterns are associated to tree-grammar symbols to define their basic appearence; Computations are declared to implement the VPs; Icons are associated to symbols (SYNT. drawing); Semantic rules can be declare to assign values to the attributes of the symbols. Universidade do Minho, Departamento de Informática Nuno Oliveira, 2009 20

INTERACTION DEFINITION A VIEW SYNTHESIS SYMBOL root. View_Root INHERITS VPRoot. Element, VPForm COMPUTE SYNT. drawing = ADDROF(root. View. Drawing); END; SYMBOL root. View_Root_semprods INHERITS VPForm. Element, VPSimple. List COMPUTE SYNT. form. Element. Name = "productions"; END; Universidade do Minho, Departamento de Informática Nuno Oliveira, 2009 21

WORKFLOW Attribute Grammar Specification Interaction Definition Buttons Symbols L&F Semantic Analyzer Implementation Universidade do Minho, Departamento de Informática Nuno Oliveira, 2009 22

SEMANTIC ANALYZER IMPLEMENTATION DEVi. L offers tree-walker (function) named add. Check; Tree-walker executes in a given context; A tree-context is a symbol or attribute in the tree-grammar; Id-Tables, Lists, etc. can be implemented with ease; Universidade do Minho, Departamento de Informática Nuno Oliveira, 2009 23

SEMANTIC ANALYZER IMPLEMENTATION Contextual Condition: A production must have one and only one root symbol checkutil: : add. Check Semprod { set n [llength [c: : get. List {$obj. grammar. Elements. CHILDREN[Left. Symbol]}]] set symb. Name [c: : get {$obj. name. VALUE}] if { $n == 0 } { eturn "Production '$symb. Name' must have one Root symbol!” } elseif {$n > 1} { return "Production '$symb. Name' must have only one Root symbol!” } return ”” } Universidade do Minho, Departamento de Informática Nuno Oliveira, 2009 24

WORKFLOW Attribute Grammar Specification Interaction Definition Buttons Symbols L&F Semantic Analyzer Implementation Code Generation Universidade do Minho, Departamento de Informática Nuno Oliveira, 2009 25

CODE GENERATION Templates for structuring the output are used (IPTG/PTG Files); Typical AG approach: Attributes can be associated to symbols of the tree- grammar; Semantic rules are declared to compute value for these attributes; Attributes can be referenced outside the context of the symbol; Auxiliary functions can be defined to aid the computations; Universidade do Minho, Departamento de Informática Nuno Oliveira, 2009 26

bnf. Prod(lhs, rhs): [lhs] -> [rhs] SYMBOL bnfgen_Semprod: bnf. LHS : PTGNode; SYMBOL bnfgen_Semprod: bnf. RHS : PTGNode; SYMBOL bnfgen_Semprod: bnf. Code : PTGNode; SYMBOL bnfgen_Semprod COMPUTE SYNT. bnf. LHS = CONSTITUENTS bnfgen_Left. Symbol. pers_symbol. Name WITH(PTGNode, PTGNew. Line. Seq, PTGAs. Is, PTGNull); SYNT. bnf. RHS = PTGAs. Is(VLString(SELECT(vl. List( "print. BNFOrdered. RHSElements", THIS. obj. Id), eval()))); SYNT. bnf. Code = PTGbnf. Prod(THIS. bnf. LHS, THIS. bnf. RHS); END; Universidade do Minho, Departamento de Informática Nuno Oliveira, 2009 27

28

29

FILE REPRESENTATION OF THE WORKFLOW 30

File Dependencies Symbols. GIF Viag. XMODEL images. GDR Buttons. PNG View. LIDO Semantics. TCL Edit. TCL Sync. TCL View. MODEL Code. IPTG Viag. DEFS Code. SPECS Code. HEAD Code. LIDO Code. MODEL Aux. TCL 31 Template. RES

THE GENERATED ENVIRONMENT 32

THE GENERATED ENVIRONMENT 33

CONCLUSIONS Systematization is achieved using generators; Separation of concerns (with DEVi. L): Syntax; Interaction; Semantics; Code Generation; Less code produced; Ease on maintaining or evolving the code; Universidade do Minho, Departamento de Informática Nuno Oliveira, 2009 34

VISUALLISA www. di. uminho. pt/~gepl/Visual. LISA 35