1. Meteoroid Towards a real MVC for the Web Lautaro Fernández Santiago Robles Andrés Fortier Stephane Ducasse Gustavo Rossi Silvia Gordillo ( lfernandez@lifia.info.unlp.edu.ar ) ( srobles@lifia.info.unlp.edu.ar ) ( andres@lifia.info.unlp.edu.ar ) ( stephane.ducasse@inria.fr ) ( gustavo@lifia.info.unlp.edu.ar ) ( gordillo@lifia.info.unlp.edu.ar )

2. Web: To Infinity And Beyond! Cheaper & Faster Lots of services are provided via Web Mail Home banking Collaborative editors Social networks E-Commerce Etc. Present on any device

3. Web evolution Beginning Request/response Static information Now the Web is more complex, requiring Complex models Dynamic information More interaction client/server Client’s updates from the server without the request For the last one a new approach is needed

4. Comet A way to push data from the server into Web browsers Umbrella of technologies JavaScript Ajax Streaming Browser-dependent hack Request/Response mechanism Comet mechanism

5. Comet (cont.) Not an standard (yet) Common technique for all browsers Waiting cursor issues Throbber issues Status bar issues Best techniques for browsers Forever IFrameXMLHttpRequestServer-Sent Events ActiveX + IFrame (others)

6. Understanding some background

7. Seaside Framework to build Web applications Characteristics: Nesting components Hot debugging and recompilation Multiple control flow Stack reification for call and answer Action callbacks Etc.

8. Model-View-Controller Model Independent from Views View Displays Model information Controller Processes events

9. Announcements It is an observer framework simpler and more powerful than legacy frameworks Triggers robust objects instead of symbols, which make the concrete observer behaviour much easier Vs. self change: #value with: aValue self announce: (ValueAnnouncement with: aValue)

10. Value Models General idea Holds a model Understands #value and #value: Notifies its dependents when its value changes Simple, standard Useful for widgets Widgets access the value independently of the model Uniform way to access the value

11. Meteoroid Framework to create Live Web applications Combines Comet concept Seaside features Announcements MVC pattern Value Models

12. Meteoroid Layers Meteoroid is divided in different layers Every layer provides More functionality More abstraction

13. JavaScript Layer Bottom Layer, less abstraction Provides A Comet connection Message #pushScript: aScript DOM manipulation self pushScript: ' alert(“Hello World”); '

14. Demo

15. Announcement Layer More abstraction Through MVC this layer will handle the dependencies Add & remove View-Model dependencies automatically Messages to update and insert JavaScript automatically MeteoroidComponent>>initialize self on: ValueChangedAnnouncement of: self model update: 'someDOM_ID' callback: [:html :announcement :announcer| html text: announcer value ]

16. Demo

17. Web Value Model Layer Combines Announcement layer HTML widgets Value Models Allows to create Web apps like Desktop apps

18. Web Value Model Layer (cont.) WebValueModel ValueModel Wrapper Allows to use #change: and #announce: Updateables Widgets Access a Value Model Value Model notifies a WebValueModel which updates the web widget

19. Demo

21. That’s all, Thanks!