DOCSLIB.ORG

Developing Rich, Web-Based User Interfaces with the Statecharts Interpretation and Optimization Engine

Total Page：16

File Type：pdf, Size：1020Kb

Download full-text PDF Read full-text
Developing Rich, Web-Based User Interfaces with the Statecharts Interpretation and Optimization Engine Developing Rich, Web-Based User Interfaces with the Statecharts Interpretation and Optimization Engine Jacob Beard Supervised by: Hans Vangheluwe School of Computer Science McGill University Montreal, Quebec, Canada March 23rd, 2013 A thesis submitted to McGill University in partial fulfilment of the requirements of the degree of Master of Science in Computer Science Copyright ©2013 Jacob Beard. All rights reserved. Abstract Today's Web browsers provide a platform for the development of complex, richly interactive user interfaces. But, with this complexity come additional challenges for Web develop- ers. The complicated behavioural relationships between user interface components are often stateful, and are difficult to describe, encode and maintain using conventional programming techniques with ECMAScript, the general-purpose scripting language embedded in all Web browsers. Furthermore, user interfaces must be performant, reacting to user input quickly; if the system responds too slowly, the result is a visible UI \lag," degrading the user's experience. Statecharts, a visual modelling language created in the 1980's for developing safety- critical embedded systems, can provide solutions to these problems, as it is well-suited to describing the reactive, timed, state-based behaviour that often comprises the essential com- plexity of a Web user interface. The contributions of this thesis are then twofold. First, in order to use Statecharts effectively, an interpreter is required to execute the Statecharts models. Therefore, the primary contribution of this thesis is the design, description, implementation and empirical evaluation of the Statecharts Interpretation and Optimization eNgine (SCION), a Statecharts interpreter implemented in ECMAScript that can run in all Web browsers, as well as other ECMAScript environments such as Node.js and Rhino. This thesis first describes a syntax and semantics for SCION which aims to be maximally intuitive for Web developers. Next, test-driven development is used to verify the correct implementation of this semantics. Finally, SCION is optimized and rigorously evaluated to maximize performance and minimize memory usage when run in various Web browser environments. While SCION began as a research project toward the completion of this master thesis, it has grown into an established open source software project, and is currently being used for real work in production environments by several organizations. The secondary contribution of this thesis is the introduction of a new Statecharts-based design pattern called Stateful Command Syntax, which can be used to guide Web user interface development with Statecharts. This design pattern can be applied to a wide class of Web user interfaces, specifically those whose behaviour comprises a command syntax that varies depending on high-level application state. Its use is illustrated through detailed case studies of two highly interactive, but very different applications. i ii Abr´eg´e Les navigateurs web modernes permettent la cr´eationd'interfaces utilisateur complexes et extr^emement interactives. Mais cela engendre ´egalement des difficult´esadditionnelles pour les d´eveloppeurs web. Les relations complexes qui existent entre les diff´erentes composantes des interfaces utilisateur sont souvent `a´etats,et sont difficile `ad´ecrire,encoder et entretenir en utilisant les techniques de programmation conventionnelles qu’offre ECMAScript, un lan- gage banalis´eque l'on retrouve dans tous les navigateurs. De plus, les interfaces doivent ^etreperformantes et r´epondre rapidement aux actions de l'utilisateur; un syst`emetrop lent engendre un d´ecalageperceptible qui nuit `al'exp´erienced'utilisation. Statecharts, un langage de mod´elisationvisuelle cr´e´edans les ann´ees80 pour assurer la s´ecurit´edes syst`emesembarqu´es,peut offrir des solutions `aces d´efis: il est adapt´e`a la description du comportement r´eactif,chronom´etr´e,et fond´esur l'´etat, qui repr´esente en somme ce qui est le plus difficile avec les interfaces utilisateur sur le web. L'apport de ce m´emoire est double. Tout d'abord, l'ex´ecution des mod`elesStatecharts, pour ^etre efficace, n´ecessiteun interpr`ete. La premi`erecontribution de cet article consiste donc en le design, l'´elaboration, l'impl´ementation et l'´evaluation empirique du Statecharts In- terpretation and Optimization eNgine (SCION), un interpr`eteen ECMAScript qui peut ^etre ex´ecut´edans tous les navigateurs web ainsi que dans d'autres environnements ECMAScript, comme Node.js et Rhino. Notre th`esed´ecriten premier lieu une syntaxe et une s´emantique pour SCION qui se veut la plus intuitive possible pour les d´eveloppeurs web. De nombreux tests sont ensuite effectu´es pour en assurer le bon fonctionnement. Enfin, SCION est rigoureusement optimis´eafin de maximiser la performance et de minimiser l'utilisation de la m´emoirevive dans diff´erents navigateurs web. Bien que SCION ait d´ebut´ecomme un projet de recherche personnel en vue de l'obtention du dipl^omede matrise, il est devenu un logiciel libre bien ´etabliet utilis´epar plusieurs organisations dans leurs environnements de travail. La deuxi`emecontribution de ce m´emoireest la pr´esentation d'un nouveau patron de con- ception cr´e´e`apartir de Statecharts nomm´eStateful Command Syntax, qui peut ^etreutilis´e pour guider la cr´eationd'interfaces utilisateur sur le web. Ce patron de conception peut ^etre employ´esur une grande vari´et´ed'interfaces, notamment celles dont le comportement inclut une syntaxe de commande qui varie selon le degr´ed'abstraction de l'application. Son utilisation est illustr´ee`atravers quelques ´etudesde cas ainsi que deux logiciels tr`es diff´erents mais hautement interactifs. iii iv Acknowledgements I would like to thank my supervisor Professor Hans Vangheluwe for providing research op- portunities and setting me down an interesting path. I would also like to thank my parents for raising me, my girlfriend Tamar Swartz for her continued love and support, my employer, INFICON, for sponsoring the development of SCION, my supervisor at INFICON, Dr. Pierre Wellner, for reading my thesis and providing useful feedback, and my colleagues Xavier Peich, who translated my thesis abstract into French, Rohan Shiloh Shah, for introducing me to Computer Science in my freshman year, and Anton Dubrau, who gave me the push I needed to start writing this thesis. Finally, I would like to thank Linus Torvalds and Richard Stallman for their contributions to the free and open source software movement. Without the GNU/Linux operating system, I would not be a fraction as productive as I am now. v vi Contents 1 Introduction 1 1.1 Background . .2 1.1.1 State Machines for User Interface Development . .2 1.1.2 Interactive Web-based User Interfaces . .2 1.1.3 Statecharts for Web User Interfaces . .3 1.2 Contributions . .3 1.3 Thesis Outline . .4 2 SCION Syntax and Semantics 5 2.1 Motivation for Using SCXML . .5 2.2 Syntax . .6 2.2.1 States . .6 2.2.2 Transitions . .7 2.2.3 Actions . .8 2.2.4 History . 10 2.3 Common Basic Semantics . 10 2.3.1 Enabled Transitions . 12 2.3.2 Selecting States to Enter and States to Exit in a Small-Step . 12 2.4 Examples of Common Basic Semantics . 13 2.4.1 Basic States . 13 2.4.2 OR States . 14 2.4.3 AND States . 15 2.4.4 History . 16 2.5 Semantic Aspects . 19 2.5.1 General Influences on SCION Semantics . 19 2.5.2 Memory Protocol . 20 2.5.3 Maximality . 22 2.5.4 Event Lifelines . 26 2.5.5 External Event Communication . 27 2.5.6 Transition Consistency . 30 2.5.7 Transition Priority . 36 2.5.8 Concurrency . 37 vii 3 Pseudocode for SCION step algorithm 41 3.1 Data Structures . 41 3.2 Constants . 42 3.3 Global Objects . 42 3.4 Utility Functions . 42 3.5 procedure init . 43 3.6 procedure start . 43 3.7 procedure performBigStep . 43 3.8 procedure performSmallStep . 43 3.9 function getStatesExited . 44 3.10 function getStatesEntered . 46 3.11 procedure recursivelyAddStatesToEnter . 46 3.12 function selectTransitions . 47 3.13 function getActiveTransitions . 48 3.14 function selectPriorityEnabledTransitions . 48 3.15 function getTransitionWithHigherSourceChildPriority . 49 3.16 function getInconsistentTransitions . 49 3.17 function isArenaOrthogonal . 50 3.18 procedure gen . 50 3.19 procedure evaluateAction . 50 4 Optimizing SCION for ECMAScript and the World Wide Web 55 4.1 Problem Statement . 55 4.2 Project Background . 56 4.3 Statecharts Optimization Strategies . 56 4.3.1 Transition Selection . 56 4.3.2 Set Data Structure . 59 4.3.3 Transition Flattening Transformation . 62 4.3.4 Cached Structural Information . 64 4.4 SCION Architecture . 64 4.5 Experimental Framework . 65 4.5.1 Optimization Profiles . 65 4.5.2 Test Cases . 65 4.5.3 ECMAScript Interpreters . 71 4.5.4 Testing Methodology . 74 4.6 Results . 75 4.6.1 Performance . 76 4.6.2 Memory Usage . 94 4.6.3 Memory Usage versus Performance . 100 4.6.4 Conclusion . 102 viii 5 Web User Interface Development with the Stateful Command Syntax De- sign Pattern 105 5.1 Overview . 105 5.2 Case Study 1: Application of SCS to Vim Modal Text Editor . 106 5.2.1 Introduction . 106 5.2.2 Case Study Goals . 107 5.2.3 Editor Requirements . 107 5.2.4 Application Architecture . 108 5.2.5 VimBehaviour Statechart Design . 111 5.3 Case Study 2: Vector Graphics Drawing Tool Based on Inkscape . 122 5.3.1 High-Level Goals . 122 5.3.2 Natural-Language Specification of User Interface Requirements . 122 5.3.3 Application Architecture . 124 5.3.4 Mapping DOM User Interface Events to Statecharts Events . 125 5.3.5 InkscapeBehaviour Statechart Design . 125 5.4 Critique of SCS . 131 6 Conclusion 133 Bibliography 136 ix x List of Figures 2.1 A Statecharts model with AND, OR and basic states, arranged hierarchically7 2.2 An example of a transition with two triggers, a condition and an action .
Load more

Recommended publications
  • Multilingual Aspects in Speech and Multimodal Interfaces
    Multilingual Aspects in Speech and Multimodal Interfaces Paolo Baggia Director of International Standards 1 Outline Loquendo Today Do we need multilingual applications? Voice is different from text? Current Solutions – a Tour: Speech Interface Framework Today Voice Applications Speech Recognition Grammars Speech Prompts Pronunciation Lexicons Discussion Points 2 Company Profile . Privately held company (fully owned by Telecom Italia), founded in 2001 as spin-off from Telecom Italia Labs, capitalizing on 30yrs experience and expertise in voice processing. Global Company, leader in Europe and South America for award-winning, high quality voice technologies (synthesis, recognition, authentication and identification) available in 30 languages and 71 voices. Multilingual, proprietary technologies protected Munich over 100 patents worldwide London . Financially robust, break-even reached in 2004, revenues and earnings growing year on year Paris . Offices in New York. Headquarters in Torino, Madrid local representative sales offices in Rome, Torino New York Madrid, Paris, London, Munich Rome . Flexible: About 100 employees, plus a vibrant ecosystem of local freelancers. 3 International Awards Market leader-Best Speech Engine Speech Industry Award 2007, 2008, 2009, 2010 2010 Speech Technology Excellence Award CIS Magazine 2008 Frost & Sullivan European Telematics and Infotainment Emerging Company of the Year Award Loquendo MRCP Server: Winner of 2008 IP Contact Center Technology Pioneer Award Best Innovation in Automotive Speech Synthesis Prize AVIOS- SpeechTEK West 2007 Best Innovation in Expressive Speech Synthesis Prize AVIOS- SpeechTEK West 2006 Best Innovation in Multi-Lingual Speech Synthesis Prize AVIOS- SpeechTEK West 2005 4 Do We Need Multilingual Applications? Yes, because … . We live in a Multicultural World . Movement of students/professionals, migration, tourism .
    [Show full text]
  • Bibliography of Erik Wilde
    dretbiblio dretbiblio Erik Wilde's Bibliography References [1] AFIPS Fall Joint Computer Conference, San Francisco, California, December 1968. [2] Seventeenth IEEE Conference on Computer Communication Networks, Washington, D.C., 1978. [3] ACM SIGACT-SIGMOD Symposium on Principles of Database Systems, Los Angeles, Cal- ifornia, March 1982. ACM Press. [4] First Conference on Computer-Supported Cooperative Work, 1986. [5] 1987 ACM Conference on Hypertext, Chapel Hill, North Carolina, November 1987. ACM Press. [6] 18th IEEE International Symposium on Fault-Tolerant Computing, Tokyo, Japan, 1988. IEEE Computer Society Press. [7] Conference on Computer-Supported Cooperative Work, Portland, Oregon, 1988. ACM Press. [8] Conference on Office Information Systems, Palo Alto, California, March 1988. [9] 1989 ACM Conference on Hypertext, Pittsburgh, Pennsylvania, November 1989. ACM Press. [10] UNIX | The Legend Evolves. Summer 1990 UKUUG Conference, Buntingford, UK, 1990. UKUUG. [11] Fourth ACM Symposium on User Interface Software and Technology, Hilton Head, South Carolina, November 1991. [12] GLOBECOM'91 Conference, Phoenix, Arizona, 1991. IEEE Computer Society Press. [13] IEEE INFOCOM '91 Conference on Computer Communications, Bal Harbour, Florida, 1991. IEEE Computer Society Press. [14] IEEE International Conference on Communications, Denver, Colorado, June 1991. [15] International Workshop on CSCW, Berlin, Germany, April 1991. [16] Third ACM Conference on Hypertext, San Antonio, Texas, December 1991. ACM Press. [17] 11th Symposium on Reliable Distributed Systems, Houston, Texas, 1992. IEEE Computer Society Press. [18] 3rd Joint European Networking Conference, Innsbruck, Austria, May 1992. [19] Fourth ACM Conference on Hypertext, Milano, Italy, November 1992. ACM Press. [20] GLOBECOM'92 Conference, Orlando, Florida, December 1992. IEEE Computer Society Press. http://github.com/dret/biblio (August 29, 2018) 1 dretbiblio [21] IEEE INFOCOM '92 Conference on Computer Communications, Florence, Italy, 1992.
    [Show full text]
  • QUERYING JSON and XML Performance Evaluation of Querying Tools for Offline-Enabled Web Applications
    QUERYING JSON AND XML Performance evaluation of querying tools for offline-enabled web applications Master Degree Project in Informatics One year Level 30 ECTS Spring term 2012 Adrian Hellström Supervisor: Henrik Gustavsson Examiner: Birgitta Lindström Querying JSON and XML Submitted by Adrian Hellström to the University of Skövde as a final year project towards the degree of M.Sc. in the School of Humanities and Informatics. The project has been supervised by Henrik Gustavsson. 2012-06-03 I hereby certify that all material in this final year project which is not my own work has been identified and that no work is included for which a degree has already been conferred on me. Signature: ___________________________________________ Abstract This article explores the viability of third-party JSON tools as an alternative to XML when an application requires querying and filtering of data, as well as how the application deviates between browsers. We examine and describe the querying alternatives as well as the technologies we worked with and used in the application. The application is built using HTML 5 features such as local storage and canvas, and is benchmarked in Internet Explorer, Chrome and Firefox. The application built is an animated infographical display that uses querying functions in JSON and XML to filter values from a dataset and then display them through the HTML5 canvas technology. The results were in favor of JSON and suggested that using third-party tools did not impact performance compared to native XML functions. In addition, the usage of JSON enabled easier development and cross-browser compatibility. Further research is proposed to examine document-based data filtering as well as investigating why performance deviated between toolsets.
    [Show full text]
  • Lively Mashups for Mobile Devices
    Lively Mashups for Mobile Devices Feetu Nyrhinen, Arto Salminen, Tommi Mikkonen Tampere University of Technology Antero Taivalsaari Sun Microsystems Laboratories Outline • Background • Mashups • Mashup Development and Tools • Lively Mashups • Qt as a Mashup Platform • Mashup demos • Experiences • Conclusions Background • Web as the platform • End-user software is moving to the Web. • Typical examples: project management, calendars, document management, instant messaging, social networking, … • Web browser acts as a replacement for the conventional OS. • Mobile devices are becoming web-enabled, but there still are constraints such as smaller screen size, battery consumption, lower CPU speed and network bandwidth. Mashups • Mashup: A web site that combines content from more than one source (multiple web sites) into an integrated experience. • Mashups leverage the power of the Web to support worldwide sharing of content that would not have been easily accessible or reusable before the Web. • In principle, the content to be combined can be anything (text, source code, maps, video, blogs, product reviews, price data, ...) as long as it can be meaningfully combined with other content. • See, e.g., http://woozor.us/ (Weather conditions on Google Map) Mashup Development and Tools • There is a plethora of various tools for the mashup development. • However, general tools are still fairly limited in functionality and many of those are far from finished applications. • Some common trends: • Using the web not only for executing applications but also for developing them. • Visual programming techniques. • The web server is used to host and share mashups. • Direct connections to existing web services. • Mashup development for mobile devices is still a field with big challenges.
    [Show full text]
  • Ontology Matching • Semantic Social Networks and Peer-To-Peer Systems
    The web: from XML to OWL Rough Outline 1. Foundations of XML (Pierre Genevès & Nabil Layaïda) • Core XML • Programming with XML Development of the future web • Foundations of XML types (tree grammars, tree automata) • Tree logics (FO, MSO, µ-calculus) • Expressing information ! Languages • A taste of research: introduction to some grand challenges • Manipulating it ! Algorithms 2. Semantics of knowledge representation on the web (Jérôme Euzenat & • in the most correct, efficient and ! Logic Marie-Christine Rousset) meaningful way ! Semantics • Semantic web languages (URI, RDF, RDFS and OWL) • Querying RDF and RDFS (SPARQL) • Querying data though ontologies (DL-Lite) • Ontology matching • Semantic social networks and peer-to-peer systems 1 / 8 2 / 8 Foundations of XML Semantic web We will talk about languages, algorithms, and semantics for efficiently and meaningfully manipulating formalised knowledge. We will talk about languages, algorithms, and programming techniques for efficiently and safely manipulating XML data. You will learn about: You will learn about: • Expressing formalised knowledge on the semantic web (RDF) • Tree structured data (XML) ! Syntax and semantics ! Tree grammars & validation You will not learn about: • Expressing ontologies on the semantic • XML programming (XPath, XSLT...) You will not learn about: web (RDFS, OWL, DL-Lite) • Tagging pictures ! Queries & transformations ! Syntax and semantics • Hacking CGI scripts ! Reasoning • Sharing MP3 • Foundational theory & tools • HTML • Creating facebook ! Regular expressions
    [Show full text]
  • WEB-BASED ANNOTATION and COLLABORATION Electronic Document Annotation Using a Standards-Compliant Web Browser
    WEB-BASED ANNOTATION AND COLLABORATION Electronic Document Annotation Using a Standards-compliant Web Browser Trev Harmon School of Technology, Brigham Young University, 265 CTB, Provo, Utah, USA Keywords: Annotation, collaboration, web-based, e-learning. Abstract: The Internet provides a powerful medium for communication and collaboration through web-based applications. However, most web-based annotation and collaboration applications require additional software, such as applets, plug-ins, and extensions, in order to work correctly with the web browsers typically found on today’s computers. This in combination with the ever-growing number of file formats poses an obstacle to the wide-scale deployment of annotation and collaboration systems across the heterogeneous networks common in the academic and corporate worlds. In order to address these issues, a web-based system was developed that allows for freeform (handwritten) and typed annotation of over twenty common file formats via a standards-compliant web browser without the need of additional software. The system also provides a multi-tiered security architecture that allows authors control over who has access to read and annotate their documents. While initially designed for use in academia, flexibility within the system allows it to be used for many annotation and collaborative tasks such as distance-learning, collaborative projects, online discussion and bulletin boards, graphical wikis, and electronic grading. The open-source nature of the system provides the opportunity for its continued development and extension. 1 INTRODUCTION did not foresee the broad spectrum of uses expected of their technologies by today’s users. While serving While the telegraph and telephone may have cracked this useful purpose, such add-on software can open the door of instantaneous, worldwide become problematic in some circumstances because communication, the Internet has flung it wide open.
    [Show full text]
  • Scraping HTML with Xpath Stéphane Ducasse, Peter Kenny
    Scraping HTML with XPath Stéphane Ducasse, Peter Kenny To cite this version: Stéphane Ducasse, Peter Kenny. Scraping HTML with XPath. published by the authors, pp.26, 2017. hal-01612689 HAL Id: hal-01612689 https://hal.inria.fr/hal-01612689 Submitted on 7 Oct 2017 HAL is a multi-disciplinary open access L’archive ouverte pluridisciplinaire HAL, est archive for the deposit and dissemination of sci- destinée au dépôt et à la diffusion de documents entific research documents, whether they are pub- scientifiques de niveau recherche, publiés ou non, lished or not. The documents may come from émanant des établissements d’enseignement et de teaching and research institutions in France or recherche français ou étrangers, des laboratoires abroad, or from public or private research centers. publics ou privés. Scraping HTML with XPath Stéphane Ducasse and Peter Kenny Square Bracket tutorials September 28, 2017 master @ a0267b2 Copyright 2017 by Stéphane Ducasse and Peter Kenny. The contents of this book are protected under the Creative Commons Attribution-ShareAlike 3.0 Unported license. You are free: • to Share: to copy, distribute and transmit the work, • to Remix: to adapt the work, Under the following conditions: Attribution. You must attribute the work in the manner specified by the author or licensor (but not in any way that suggests that they endorse you or your use of the work). Share Alike. If you alter, transform, or build upon this work, you may distribute the resulting work only under the same, similar or a compatible license. For any reuse or distribution, you must make clear to others the license terms of this work.
    [Show full text]
  • Document Object Model
    Document Object Model CITS3403: Agile Web Development Semester 1, 2021 Introduction • We’ve seen JavaScript core – provides a general scripting language – but why is it so useful for the web? • Client-side JavaScript adds collection of objects, methods and properties that allow scripts to interact with HTML documents dynamic documents client-side programming • This is done by bindings to the Document Object Model (DOM) – “The Document Object Model is a platform- and language-neutral interface that will allow programs and scripts to dynamically access and update the content, structure and style of documents.” – “The document can be further processed and the results of that processing can be incorporated back into the presented page.” • DOM specifications describe an abstract model of a document – API between HTML document and program – Interfaces describe methods and properties – Different languages will bind the interfaces to specific implementations – Data are represented as properties and operations as methods • https://www.w3schools.com/js/js_htmldom.asp The DOM Tree • DOM API describes a tree structure – reflects the hierarchy in the XTML document – example... <html xmlns = "http://www.w3.org/1999/xhtml"> <head> <title> A simple document </title> </head> <body> <table> <tr> <th>Breakfast</th> <td>0</td> <td>1</td> </tr> <tr> <th>Lunch</th> <td>1</td> <td>0</td> </tr> </table> </body> </html> Execution Environment • The DOM tree also includes nodes for the execution environment in a browser • Window object represents the window displaying a document – All properties are visible to all scripts – Global variables are properties of the Window object • Document object represents the HTML document displayed – Accessed through document property of Window – Property arrays for forms, links, images, anchors, … • The Browser Object Model is sometimes used to refer to bindings to the browser, not specific to the current page (document) being rendered.
    [Show full text]
  • Chapter 10 Document Object Model and Dynamic HTML
    Chapter 10 Document Object Model and Dynamic HTML The term Dynamic HTML, often abbreviated as DHTML, refers to the technique of making Web pages dynamic by client-side scripting to manipulate the document content and presen- tation. Web pages can be made more lively, dynamic, or interactive by DHTML techniques. With DHTML you can prescribe actions triggered by browser events to make the page more lively and responsive. Such actions may alter the content and appearance of any parts of the page. The changes are fast and e±cient because they are made by the browser without having to network with any servers. Typically the client-side scripting is written in Javascript which is being standardized. Chapter 9 already introduced Javascript and basic techniques for making Web pages dynamic. Contrary to what the name may suggest, DHTML is not a markup language or a software tool. It is a technique to make dynamic Web pages via client-side programming. In the past, DHTML relies on browser/vendor speci¯c features to work. Making such pages work for all browsers requires much e®ort, testing, and unnecessarily long programs. Standardization e®orts at W3C and elsewhere are making it possible to write standard- based DHTML that work for all compliant browsers. Standard-based DHTML involves three aspects: 447 448 CHAPTER 10. DOCUMENT OBJECT MODEL AND DYNAMIC HTML Figure 10.1: DOM Compliant Browser Browser Javascript DOM API XHTML Document 1. Javascript|for cross-browser scripting (Chapter 9) 2. Cascading Style Sheets (CSS)|for style and presentation control (Chapter 6) 3. Document Object Model (DOM)|for a uniform programming interface to access and manipulate the Web page as a document When these three aspects are combined, you get the ability to program changes in Web pages in reaction to user or browser generated events, and therefore to make HTML pages more dynamic.
    [Show full text]
  • SVG-Based Knowledge Visualization
    MASARYK UNIVERSITY FACULTY}w¡¢£¤¥¦§¨ OF I !"#$%&'()+,-./012345<yA|NFORMATICS SVG-based Knowledge Visualization DIPLOMA THESIS Miloš Kaláb Brno, spring 2012 Declaration Hereby I declare, that this paper is my original authorial work, which I have worked out by my own. All sources, references and literature used or excerpted during elaboration of this work are properly cited and listed in complete reference to the due source. Advisor: RNDr. Tomáš Gregar Ph.D. ii Acknowledgement I would like to thank RNDr. Tomáš Gregar Ph.D. for supervising the thesis. His opinions, comments and advising helped me a lot with accomplishing this work. I would also like to thank to Dr. Daniel Sonntag from DFKI GmbH. Saarbrücken, Germany, for the opportunity to work for him on the Medico project and for his supervising of the thesis during my erasmus exchange in Germany. Big thanks also to Jochen Setz from Dr. Sonntag’s team who worked on the server background used by my visualization. Last but not least, I would like to thank to my family and friends for being extraordinary supportive. iii Abstract The aim of this thesis is to analyze the visualization of semantic data and sug- gest an approach to general visualization into the SVG format. Afterwards, the approach is to be implemented in a visualizer allowing user to customize the visualization according to the nature of the data. The visualizer was integrated as an extension of Fresnel Editor. iv Keywords Semantic knowledge, SVG, Visualization, JavaScript, Java, XML, Fresnel, XSLT v Contents Introduction . .3 1 Brief Introduction to the Related Technologies ..........5 1.1 XML – Extensible Markup Language ..............5 1.1.1 XSLT – Extensible Stylesheet Lang.
    [Show full text]
  • Latex Beamer Presentation
    Extend your KDE application Using QML! Artur Duque de Souza Aug/2011 Agenda • (Big) Introduction • A problem • KDE Solution • Issues • Future Qt Script QtScript C++ API to make your applications scriptable QScriptEngine • Environment to evaluate a script • Context • Global Object • Use QMetaObject system to automatically export QObjects QObjects Can be exported out of the box: • Properties • Signals • Slots • Q_INVOKABLE QScriptValue Container for QtScript data types: • Support for ECMA-262 types • Support for QObject, QVariant and QMetaObject • Prototype property that is common to all instances of an object JS Bindings JS Bindings for Qt Bindings are proxy objects/functions to interface with the ’real’ libraries JS Bindings for Qt Steps to create your bindings: • Create wrap code (check context arguments) • Register your wrappers with the engine • Be happy :) JS Bindings for Qt Steps to create your bindings: • Create wrap code (check context arguments) • Register your wrappers with the engine • Be happy :) JS Bindings for Qt Steps to create your bindings: • Create wrap code (check context arguments) • Register your wrappers with the engine • Be happy :) QML QML Declarative language to ease the development of UIs QDeclarativeEngine • Handles QML code • Does not inherit QScriptEngine • It has a QScriptEngine inside QDeclarativeEngine • Handles QML code • Does not inherit QScriptEngine • It has a QScriptEngine inside QDeclarativeEngine Public API • QML specific methods • It has its own ’context’: QDeclarativeContext • QObject works out of the box • It’s possible to register C++ declarative items QDeclarativeExpression Evaluate a JS expression in a QML context KDE First of all... ... why use QML? Declarative languages are way better (and faster) to build rich UIs! • Microblog plasmoid (C++): 1250 LOC • Declarative Microblog: 500 LOC First of all..
    [Show full text]
  • Orchestration Server Developer's Guide
    Orchestration Server Developer's Guide SCXML Language Reference 10/2/2021 Contents • 1 SCXML Language Reference • 1.1 Usage • 1.2 Syntax and Semantics • 1.3 Extensions and Deviations • 1.4 SCXML Elements • 1.5 Event Extensions • 2 Logging and Metrics • 2.1 Supported URI Schemes • 2.2 Supported Profiles • 2.3 Examples Orchestration Server Developer's Guide 2 SCXML Language Reference SCXML Language Reference Click here to view the organization and contents of the SCXML Language Reference. SCXML stands for State Chart XML: State Machine Notation for Control Abstraction. Orchestration Server utilizes an internally developed SCXML engine which is based on, and supports the specifications outlined in the W3C Working Draft 7 May 2009 [1]. There are, however, certain changes and/or notable differences (see Extensions and Deviations) between the W3C specification and the implementation in Orchestration Server which are described on this page. Only the ECMAScript profile is supported (the minimal and XPath profiles are not supported). Usage SCXML documents are a means of defining control behaviour through the design of state machines. The SCXML engine supports a variety of control flow elements as well as methods to manipulate and send/receive data, thus enabling users to create complex mechanisms. For example, Orchestration, which is a consumer of the SCXML engine, uses SCXML documents to execute strategies. A simple strategy may involve defining different call routing behaviours depending on the incoming caller, however, the SCXML engine facilitates a wide variety of applications beyond simple call routing. Authoring SCXML documents can be done using any text editor or by leveraging the Genesys Composer tool.
    [Show full text]