Your SlideShare is downloading. ×
WIND presentation
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×
Saving this for later? Get the SlideShare app to save on your phone or tablet. Read anywhere, anytime – even offline.
Text the download link to your phone
Standard text messaging rates apply

WIND presentation

1,452
views

Published on

This is the slides presented at the International Opensource Geospatial Research Symposium (OGRS 2009).

This is the slides presented at the International Opensource Geospatial Research Symposium (OGRS 2009).

Published in: Technology, Business

0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total Views
1,452
On Slideshare
0
From Embeds
0
Number of Embeds
0
Actions
Shares
0
Downloads
7
Comments
0
Likes
0
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
No notes for slide

Transcript

  • 1. WIND: an Interaction Lightweight Programming Model for Geographical Web Applications The Nhan Luong thenhan.luong@iutbayonne.univ-pau.fr Thierry Nodenot Patrick Etcheverry Christophe Marquesuzaà IUT de Bayonne Pays Basque DESI team - LIUPPA International Opensource Geospatial Research Symposium (Nantes, July 8, 2009) Luong et al. (DESI team - LIUPPA) Interaction Model for Geographical Web July 8, 2009 1 / 25
  • 2. Outline 1 Introduction 2 WIND Core Concept 3 WIND Implementation 4 Future works Luong et al. (DESI team - LIUPPA) Interaction Model for Geographical Web July 8, 2009 2 / 25
  • 3. Introduction Outline 1 Introduction 2 WIND Core Concept 3 WIND Implementation 4 Future works Luong et al. (DESI team - LIUPPA) Interaction Model for Geographical Web July 8, 2009 3 / 25
  • 4. Introduction Introduction Our goal To conceive a Web environment allowing teachers to produce by them- -selves educational applications exploiting the spatio-temporal semantics embedded into texts. The conception activity is driven by interaction considerations. The environment consists of a Web 2.0 designing interface and a specic API dedicated to interaction model. The source code should be open source so that it can be beneted in the educational community. Luong et al. (DESI team - LIUPPA) Interaction Model for Geographical Web July 8, 2009 4 / 25
  • 5. Introduction Starting point 3 features of geographic information embedded into travel stories: 1 Spatial feature 2 Temporal feature 3 Phenomenon feature [Gaio, 2007] Web Mapping Services: Google Maps, OpenLayers, IGN Geoportail. Mashup environments enable to quickly create web-based applications. Luong et al. (DESI team - LIUPPA) Interaction Model for Geographical Web July 8, 2009 5 / 25
  • 6. Introduction Concerned application example http://erozate.iutbayonne.univ-pau.fr/forbes2007/exp/ Luong et al. (DESI team - LIUPPA) Interaction Model for Geographical Web July 8, 2009 6 / 25
  • 7. Introduction Concerned application example Starting point for educational activities. This application embeds text, map and calendar components. Management of interactions between these components. Coded from scratch by developer (JF Boullier - Ph.D. student, 2007). Specic to this kind of application (not reusable). =⇒ Generic model to design this kind of application: WIND (Web INteraction Design). Luong et al. (DESI team - LIUPPA) Interaction Model for Geographical Web July 8, 2009 7 / 25
  • 8. WIND Core Concept Outline 1 Introduction 2 WIND Core Concept 3 WIND Implementation 4 Future works Luong et al. (DESI team - LIUPPA) Interaction Model for Geographical Web July 8, 2009 8 / 25
  • 9. WIND Core Concept UML model Luong et al. (DESI team - LIUPPA) Interaction Model for Geographical Web July 8, 2009 9 / 25
  • 10. WIND Core Concept Model explanation An interaction may be simply dened as a triple area, event, reactions. i.e. an area (SensiblePart), under a specic user action (event), will launch system reactions (Reaction). Luong et al. (DESI team - LIUPPA) Interaction Model for Geographical Web July 8, 2009 10 / 25
  • 11. WIND Core Concept Model explanation An area (SensiblePart) can be a text area (TextPart) or a map area (MapPart) or a calendar area (CalendarPart). Text area (TextPart): word or a set of words. Map area (MapPart): geometry (point, line, polygon) Calendar area (CalendarPart): date Luong et al. (DESI team - LIUPPA) Interaction Model for Geographical Web July 8, 2009 11 / 25
  • 12. WIND Core Concept Model explanation User action (event): attribute as String type. For example: left-click: (event = 'click') double-click: (event = 'dbclick') mouse-over: (event = 'mouseover') Luong et al. (DESI team - LIUPPA) Interaction Model for Geographical Web July 8, 2009 12 / 25
  • 13. WIND Core Concept Model explanation A reaction (Reaction) results in a visual eect on one area (SensiblePart), which may be dened with dierent styles. For example: boldfacing a text area: (calledFunction = 'bold') focusing a map area on the map: (calledFunction = 'focus') highlighting a date on the calendar: (calledFunction = 'highlight') Luong et al. (DESI team - LIUPPA) Interaction Model for Geographical Web July 8, 2009 13 / 25
  • 14. WIND Core Concept Main features of WIND WIND is object-oriented. WIND objects are simply created by their class constructor. Methods are disposed to implement relationships between objects. WIND model allows programming interactions for whatever reactive areas thanks to polymorphism of the SensiblePart class. WIND is integrative. It combines textual, map and calendar components. The users may include within a web application as many instances of each type of components. WIND is executable thanks to its corresponding JavaScript WIND-API. The users can simply design an interaction and immediately execute it. WIND is declarative. The code of a WIND-based application has a very simple structure. The users only have to declare sensible parts, events and reactions. Luong et al. (DESI team - LIUPPA) Interaction Model for Geographical Web July 8, 2009 14 / 25
  • 15. Implementation Outline 1 Introduction 2 WIND Core Concept 3 WIND Implementation 4 Future works Luong et al. (DESI team - LIUPPA) Interaction Model for Geographical Web July 8, 2009 15 / 25
  • 16. Implementation http://erozate.iutbayonne.univ-pau.fr/wind/simpledemo.html Luong et al. (DESI team - LIUPPA) Interaction Model for Geographical Web July 8, 2009 16 / 25
  • 17. Implementation Four programming steps for WIND-based application 1 Creating the application components with their characteristics. 2 Creating the sensible parts of each component dened in the previous step. 3 Dening the possible reactions for all the sensible parts. 4 Dening the interactions upon previously dened sensible parts and reactions. Luong et al. (DESI team - LIUPPA) Interaction Model for Geographical Web July 8, 2009 17 / 25
  • 18. Implementation JavaScript code example Include WIND JavaScript API: script type=text/javascript src=http://erozate.iutbayonne.univ-pau.fr/wind/wind-api.js/ HTML code: div id=mytext/ div id=mymap/ 1 Creating the application components with their characteristics. var t = new WIND.Text('mytext'); t.setContent(March 20th 2009: we are in Anglet today. Anglet is located in the southwest of France.); var m = new WIND.Map('mymap', {'type': Google_Street, 'longitude': -1.51, 'latitude': 43.49, 'zoom': 11}); 2 Creating the sensible parts of each component dened previously. var tp = t.createSensiblePart(Anglet); var mp = m.createSensiblePart(POLYGON((-1.52 43.53, -1.58 43.46,-1.44 43.48,-1.52 43.53))); Luong et al. (DESI team - LIUPPA) Interaction Model for Geographical Web July 8, 2009 18 / 25
  • 19. Implementation JavaScript code example CSS code: style .ville { font-weight : bold; font-style : italic; font-size : 15pt; color : blue; background-color: pink;} /style 3 Dening the possible reactions for all the sensible parts. var r1 = new WIND.Reaction(mp, 'highlight'); var r2 = new WIND.Reaction(tp, 'setStyleByClass:ville'); 4 Dening the interactions upon previously dened sensible parts and reactions. var i1 = new WIND.Interaction(mp, 'click', null); i1.addReaction(r1); i1.addReaction(r2); i1.activate(); Luong et al. (DESI team - LIUPPA) Interaction Model for Geographical Web July 8, 2009 19 / 25
  • 20. Implementation Demo http://erozate.iutbayonne.univ-pau.fr/wind/index.html Luong et al. (DESI team - LIUPPA) Interaction Model for Geographical Web July 8, 2009 20 / 25
  • 21. Future works Outline 1 Introduction 2 WIND Core Concept 3 WIND Implementation 4 Future works Luong et al. (DESI team - LIUPPA) Interaction Model for Geographical Web July 8, 2009 21 / 25
  • 22. Future works Improvement of the sensible part concept Extension of the sensible part concept (especially TextPart and MapPart) in order to allow programmers dening sensible parts with higher level semantics. For example: var tp = t.createSensiblePart('city'); creates automatically TextPart(s) having city semantics. This work relies on space indexing processes elaborated by DESI team (cf. PIIR, Loustau, 2008 and Geostream, Sallaberry, 2009). Luong et al. (DESI team - LIUPPA) Interaction Model for Geographical Web July 8, 2009 22 / 25
  • 23. Future works Improvement of the user action concept Improvement of the user action concept. For example: the system may react after a sequence of several specic user actions (cf. Fig. c). (a) (b) (c) Luong et al. (DESI team - LIUPPA) Interaction Model for Geographical Web July 8, 2009 23 / 25
  • 24. Future works Creation of authoring environment Creation of a dedicated authoring environment allowing end-users (teachers) to design by themselves WIND-based interaction applications without coding. Luong et al. (DESI team - LIUPPA) Interaction Model for Geographical Web July 8, 2009 24 / 25
  • 25. Thank you for your attention! Questions? The Nhan LUONG thenhan.luong@iutbayonne.univ-pau.fr Luong et al. (DESI team - LIUPPA) Interaction Model for Geographical Web July 8, 2009 25 / 25