Formularbasierte Benutzerinteraktion mit Fachkomponenten

Transkript

1 Formularbasierte Benutzerinteraktion mit Fachkomponenten Dr. Martin Gaedke, Martin Nussbaumer Universität t Karlsruhe (TH) Institut für f r Telematik IT Management und Web Engineering Fachkomponente Einführung kapselt Anwendungslogik Trend: Dienste im Web anbieten E-Business E-Commerce,... Problem: unterschiedliche Browser Desktop, Personal Digital Assistent, Handy Anwendungslogik darstellungsunabhängig

2 Fachkomponente und Web Anwendung Web Anwendung realisiert Benutzerschnittstelle Fachkomponente unabhängig von Darstellung Dargestellte Web Anwendung Interaktionseinheit Interaktionsstruktur Navigation Interaktionsstruktur Navigation Modifikation NavigationModifikation Navigation Rückkopplung Modifikation Rückkopplung Modifikation Rückkopplung Rückkopplung Formulardaten als Parameter in XML Web-Server Generierung Daten Darstellung Navigation Interaktion Verarbeitung - Fachkomponente Web-Anwendung Stand der Technik Endliche Automaten UML Aktivitätsdiagramme Petri-Netze

3 Vorgehensmodell PetrIX Modellierung mit Petri-Netzen Abbildung auf das konkrete Modell XForms Abbildung auf Zielplattform durch Unterstützungssystem Modellierung XForms Implementierung Internet Explorer Petri-Netze Abstraktes Modell Abbildung Konkretes Modell Zielplattform 1 XForms Zielplattform 2 Modellierung mit Petri-Netzen Abbildung auf das konkrete Modell XForms Abbildung auf Zielplattform Phase 1: Petri-Netze Einführung Werte Wertübergang Stelle S 2 T 1 T 3.1 T 4 S S 2.1 S 2.2 S 3 1 T 2 Markierungen Hierarchie Sichtbarkeit

4 Modellierung mit Petri-Netzen Abbildung auf das konkrete Modell XForms Abbildung auf Zielplattform Phase 1: Petri-Netze Objektmodell 2..n 2..n 2..n {abstract} Stelle #marked:bool #visible:bool #value:uuid {abstract} InteractionStructure #valuespace:valuespace #ref:controler-element {abstract} InteractionElement #ref:xml-element #container:xmldoc 1 1 ISConcat ISTour ISSelect ISToggle Textbox Textarea Output SelectOne Button Modellierung mit Petri-Netzen Abbildung auf das konkrete Modell XForms Abbildung auf Zielplattform Ziel Phase 2: Abbildung Termalgebra Abbildung des Abstrakten auf das Konkrete Modell Weg Abbildung Abstraktes Modell (Objektstruktur) auf kontextfreie Grammatik Interaktionselemente = Grundterme einer Termalgebra Interaktionsstrukturen = Operationen einer Termalgebra Abbildung der produzierten Terme durch ein Termersetzungssystem

5 Modellierung mit Petri-Netzen Abbildung auf das konkrete Modell XForms Abbildung auf Zielplattform Phase 2: Abbildung kontextfreie Grammatik InteractionStructure InteractionStructure := ISConcat ISToggle ISConcat ISToggle InteractionStructure := concat(isconcat) toggle(istoggle) ISConcat ISConcat param := Stelle param := param Stelle Stelle Stelle 2..n ISConcat param := Stelle, param := param, Stelle Stelle Modellierung mit Petri-Netzen Abbildung auf das konkrete Modell XForms Abbildung auf Zielplattform Phase 2: Abbildung Termersetzung I Petri-Netz Term ersetzter Term t textbox <textbox xform= t textbox.container ref= t textbox.ref >... </textbox> concat (t 1,...,t n ) eval(t 1 )... eval(t n ) toggle (t 1, t 2 ) <switch xform= toggle.controler ref= toggle.ref > <case id= t 1.value >eval(t 1 )</case> <case id= t 2.value >eval(t 2 )</case> </switch>

6 Modellierung mit Petri-Netzen Abbildung auf das konkrete Modell XForms Abbildung auf Zielplattform Phase 2: Abbildung Termersetzung II tour (t 1,...,t n ) <switch xform= tour.container ref= tour.ref > <case id= t 1.value >eval(t 1 ) <button.../> </case> <case id= t 2.value >eval(t 2 ) <button.../> </case>... <case id= t n.value >eval(t n ) <button.../> </case> </switch> select (s, t 1,...,t n ) P 1 P n <selectone selectui= radiogroup xform= select.container ref= select.ref > <item value= t 1.value ></item>... </selectone> <switch xform= select.container ref= select.ref > <case id= t 1.value >eval(t 1 )</case>... <case id= t n.value >eval(t n )</case> </switch> Modellierung mit Petri-Netzen Abbildung auf das konkrete Modell XForms Abbildung auf Zielplattform Phase 3: XForms Einordnung W3C-Akitivtät Erster Draft: 10. Juni 2001 Aktuell: letzter Draft vor Empfehlung Ziel XML-konforme Formulare Lösungsansatz Trennung Daten (XForms model) Layout (User Interface) Beispiel <selectone selectui=x> X={ radiogroup, listbox, pulldown }

7 Modellierung mit Petri-Netzen Abbildung auf das konkrete Modell XForms Abbildung auf Zielplattform Phase 4: Unterstützungssystem Realisierung Ausgangspunkt Platzierung des Übersetzers Client (im Browser) Server (Server übersetzt und schickt Programm an Client) Modularität Sprachkern soll modifizierbar sein Zerteil-Algorithmus muss anpassbar sein Codeerzeugung soll für bestimmte Plattformen austauschbar sein Hindernisse XForms zum Entwicklungszeitpunkt in Draft-Version 1.0 Modellierung mit Petri-Netzen Abbildung auf das konkrete Modell XForms Abbildung auf Zielplattform Phase 4: Unterstützungssystem Architektur

8 Modellierung mit Petri-Netzen Abbildung auf das konkrete Modell XForms Abbildung auf Zielplattform Phase 4: Unterstützungssystem tzungssystem Benutzerschnittstelle Beispiel I value= P 0 valuespace={ P 1, P 2 } ISTour P 0 select= PP 2 2 value= P 2 valuespace={ P 3, P 4 } ISSelect PP 1 1 P 2 select=p 1 P 1 select= P 3 select= P 4 P 3 P 4

9 Beispiel II Phase 2:Abbildung auf Termalgebra ISTour(IE output, ISSelect(IE SelectOne, IE output, IE textbox )) Phase 3:XForms XForms- Programm Phase 4: Übersetzung Beispiel III Zielplattform

10 Zusammenfassung und Ausblick Vorgehensmodell Voraussetzungen für rechnergestützte Abbildung XForms-Compiler gefärbte Petri-Netze CASE-Tools Codeerzeugungs-Factories