Web Modeler W3L AG Ein webbasiertes Modellierungswerkzeugs mit integrierter Plugin-Architektur

Größe: px

Ab Seite anzeigen:

Download "Web Modeler W3L AG Ein webbasiertes Modellierungswerkzeugs mit integrierter Plugin-Architektur"

Lena Michaela Krause
vor 7 Jahren
Abrufe

1 1 Web Modeler Ein webbasiertes Modellierungswerkzeugs mit integrierter Plugin-Architektur W3L AG

2 2 Inhaltsverzeichnis Motivation Modellierungswerkzeug Techniken Architektur Datenhaltung Plugin-Architektur Web Modeler Editor Framework Linien Organigramm-Plugin Live-Präsentation Zusammenfassung Ausblick zurück

3 3 Motivation Trend Web 2.0 Ajax Clientseitige Webanwendung Desktop-ähnliche Anwendung Bedienbarkeit Leistungsfähigkeit

4 4 Modellierungswerkzeug Was ist ein Modellierungswerkzeug? Darstellung von Grafischen Elemente Geometrische Figuren Linien Unterstützung von Diagrammarten Flussdiagramm Netzplan Entity-Relationship-Diagramm UML-Diagramme

5 5 Modellierungswerkzeug Desktopanwendung Visio Dia MagicDraw Rational Rose Webanwendung mxgraph Open-jACOB Web Modeler

6 6 Modellierungswerkzeug Web Modeler Webbasiertes Modellierungswerkzeug Bedienbarkeit vgl. mit Desktopanwendung 3-Schichten-Architektur Plugin-Architektur Nutzt JSUIL (JavaScript User Interface Library) Lauffähig in Microsoft Internet Explorer 7 Mozilla Firefox 1.5 und 2.0

7 7 Techniken HTML Indirekt über DOM Grafische Darstellung DOM XML-Dokument in Baumstruktur Zugriff auf Knoten Manipulation von Knoten CSS Layoutinformationen JavaScript glue code Ermöglicht Ereignisverwaltung

8 8 Architektur Übersicht der Architektur

9 9 Architektur Kommunikation Web Modeler JSUIL :Client «singleton» :ServerProxy «servlet» :RequestHandler «interface» :ICommand executecommand execute execute executecommand

10 10 Plugin-Architektur Zweck der Plugin-Architektur Funktionalität für Diagrammtypen Dynamische Erweiterbarkeit der Anwendung <html> <head> <title></title> <script language="javascript" type="text/javascript" src="datei1.js"></script> <script language="javascript" type="text/javascript" src="datei2.js"></script> </head> <body> </body> </html>

11 Plugin-Architektur 11

12 12 Plugin-Architektur Verzeichnisstruktur eines Plugins «Java-Archiv» Plugin plugin.xml

13 13 Plugin-Architektur Ausschnitt einer Konfigurationsdatei <plugin id="classdiagramplugin" version="1.0"> <name>klassendiagramm</name> <author>max Mustermann</author> <description> Mit dem Klassendiagramm-Plugin können UML 2.0 Klassendiagramme entworfen werden. Das Plugin enthält folgende Elemente: Paket, </description> <resources> <class name="classdiagramplugin" file="resources/resources.xrf" /> </resources> </plugin>

14 14 Plugin-Architektur Vorhandene Plugins Aktivitätsdiagramm Klassendiagramm Organigramm Plugins in Entwicklung ER-Diagramm GUI-Modellierung

15 Live-Präsentation 15

16 16 Zeichenfläche Steuerelement aus der JSUIL Darstellung grafischer Elemente Funktionen Selektieren Drag & Drop Größenänderung Layout

17 17 Web Modeler Editor Framework Framework für Plugins Enthält Oberklassen für Geometrische Elemente Linien Trennung zwischen Darstellung Modell

18 18 Web Modeler Editor Framework Einbettung in Gesamtarchitektur von Web Modeler JSUIL WMEF Plugin Component Abstrakte Oberklasse für alle grafischen Elemente CanvasElement Abstrakte Oberklasse für Elemente in einer Zeichenfläche Kann selektiert, verschoben und in der Größe verändert werden VisualElement Abstrakte Oberklasse des WMEF Implementiert Standardverhalten für alle visuellen Elemente BlockElement, LineElement, LineEnd Definieren Standardverhalten (z. B. Drag & Drop) ConcretePluginElement Darstellung Nutzt Standardverhalten Stellt spezifische Funktionalität zur Verfügung

19 19 Web Modeler Editor Framework Klassendiagramm WMEF

20 20 Datenhaltung Web Modeler Generische Lösung in JSUIL (XJS) XML-Format (XWM) Archivierung in WMZIP Plugins Implementiert Schnittstelle ISerializable Zugriffsmethoden für Eigenschaften

21 21 Datenhaltung Ausschnitt Fachkonzept

22 22 Linien Liniendarstellung im Web Modeler Verbindung zweier Blockelemente Automatische Berechnung des Linienverlaufs Gerade Linien Endliche Anzahl an Segmenten Keine Kollisionsvermeidung Schräge Linien Bresenham-Algorithmus Linie gerade Linie schräg

23 23 Linien Linien im Modell

24 24 Linien Linienalgorithmus

25 25 Linienalgorithmus < MIN_CORRIDOR_WIDTH_3SEG Explizite Darstellung: f(x) = y = m x + b mit b = 0 Implizite Darstellung: F(x, y) = m x y = 0 F(x, y) > 0 (x, y) T unterhalb der Geraden F(x, y) = 0 (x, y) T auf der Geraden F(x, y) < 0 (x, y) T überhalb der Geraden Auswertung und Analyse von F(x, y) und G(x, y) mit (x, y) T = b2 T mid

26 26 Organigramm-Plugin Organigramm Darstellung der Organisation von Unternehmen Keine einheitliche Definition WMEF OrgaChartPlugin

27 27 Zusammenfassung Modellierungswerkzeug im Webbrowser Plugin-Architektur Framework für Plugins Erweiterbarer Linienalgorithmus

28 28 Ausblick Konvertierung in verschiedene Dateiformate Vektorgrafik (SVG) Rastergrafik (JPEG, PNG) Erweiterung der Bedienbarkeit Undo / Redo Funktion In-Place Editor Generierung von Webanwendungen

Inhouse-Schulungen W3L-Akademie Flexibel online lernen und studieren! Wir bieten Inhouse-Schulungen und Beratung durch unsere IT-Experten und Berater.

29 Inhouse-Schulungen W3L-Akademie Flexibel online lernen und studieren! Wir bieten Inhouse-Schulungen und Beratung durch unsere IT-Experten und Berater. Schulungsthemen Softwarearchitektur (OOD) Requirements Engineering (OOA) Nebenläufige & verteilte Programmierung Gerne konzipieren wir auch eine individuelle Schulung zu Ihren Fragestellungen. In Zusammenarbeit mit der Fachhochschule Dortmund bieten wir zwei Online-Studiengänge B.Sc. Web- und Medieninformatik B.Sc. Wirtschaftsinformatik und 7 Weiterbildungen im IT-Bereich an. Sprechen Sie uns an! Tel. 0231/ , info@w3l.de Besuchen Sie unsere Akademie!

Ähnliche Dokumente

Dependency Injection mit dem Unity Container

1 Dependency Injection mit dem Unity Container Vom Problem zur Lösung unter Anwendung des Unity Containers W3L AG info@w3l.de 2015 2 Inhalt Problemstellung Einführung Dependency Injection Manuelle Objektkomposition