combining html5 with mvc framework to simplify realtime collaboration for web devlopment
TRANSCRIPT
![Page 1: Combining HTML5 with MVC framework to simplify realtime collaboration for web devlopment](https://reader036.vdocuments.mx/reader036/viewer/2022070316/555e2816d8b42a384f8b5081/html5/thumbnails/1.jpg)
![Page 2: Combining HTML5 with MVC framework to simplify realtime collaboration for web devlopment](https://reader036.vdocuments.mx/reader036/viewer/2022070316/555e2816d8b42a384f8b5081/html5/thumbnails/2.jpg)
What is HTML5?New FeaturesWhat is MVC?
Implementations of MVC
Implementations of MVC with HTML5
Implementation of RTWCS
![Page 3: Combining HTML5 with MVC framework to simplify realtime collaboration for web devlopment](https://reader036.vdocuments.mx/reader036/viewer/2022070316/555e2816d8b42a384f8b5081/html5/thumbnails/3.jpg)
HTML5?
HTML5 is a language for structuring and presenting content for the World Wide Web
Core of Internet 5th revision
Still Under Development
What is HTML5?
![Page 4: Combining HTML5 with MVC framework to simplify realtime collaboration for web devlopment](https://reader036.vdocuments.mx/reader036/viewer/2022070316/555e2816d8b42a384f8b5081/html5/thumbnails/4.jpg)
HTML5?
HTML CSS JS HTML5
![Page 5: Combining HTML5 with MVC framework to simplify realtime collaboration for web devlopment](https://reader036.vdocuments.mx/reader036/viewer/2022070316/555e2816d8b42a384f8b5081/html5/thumbnails/5.jpg)
HTML5?New FeaturesStructural Elements
New Form Controls
Audio and Video
Drag and Drop APIs
Offline App Cache
Client Storage
Canvas APIs
Etc…
![Page 6: Combining HTML5 with MVC framework to simplify realtime collaboration for web devlopment](https://reader036.vdocuments.mx/reader036/viewer/2022070316/555e2816d8b42a384f8b5081/html5/thumbnails/6.jpg)
Model–view–controller (MVC) is a software architecture
Architectural pattern used in software engineering Isolates "domain logic“ from user interface
Independent development, testing and maintenance
What is MVC?
![Page 7: Combining HTML5 with MVC framework to simplify realtime collaboration for web devlopment](https://reader036.vdocuments.mx/reader036/viewer/2022070316/555e2816d8b42a384f8b5081/html5/thumbnails/7.jpg)
![Page 8: Combining HTML5 with MVC framework to simplify realtime collaboration for web devlopment](https://reader036.vdocuments.mx/reader036/viewer/2022070316/555e2816d8b42a384f8b5081/html5/thumbnails/8.jpg)
View uses model to generate interface
Controller selects the necessary view
Model retrieves data from database
Controller manipulates the model
Controller handles input from view
User Interacts with view
![Page 9: Combining HTML5 with MVC framework to simplify realtime collaboration for web devlopment](https://reader036.vdocuments.mx/reader036/viewer/2022070316/555e2816d8b42a384f8b5081/html5/thumbnails/9.jpg)
![Page 10: Combining HTML5 with MVC framework to simplify realtime collaboration for web devlopment](https://reader036.vdocuments.mx/reader036/viewer/2022070316/555e2816d8b42a384f8b5081/html5/thumbnails/10.jpg)
Implementations of MVC
GUI frameworks Web frameworks
• Smalltalk• AppFlower• Xpages• Cocoa• GNUstep• GTK+, etc…
• PureMVC (Actionscript)• CppCMS(C++)• Cairngrom(Flex)• Griffon(Java)• YUI3(Javascript)• CakePHP(PHP), etc…
![Page 11: Combining HTML5 with MVC framework to simplify realtime collaboration for web devlopment](https://reader036.vdocuments.mx/reader036/viewer/2022070316/555e2816d8b42a384f8b5081/html5/thumbnails/11.jpg)
Implementations of MVC with HTML5
Double-Model MVC Architecture
![Page 12: Combining HTML5 with MVC framework to simplify realtime collaboration for web devlopment](https://reader036.vdocuments.mx/reader036/viewer/2022070316/555e2816d8b42a384f8b5081/html5/thumbnails/12.jpg)
• Standard MVC pattern• Provides interface for query or
update states• Two kind of messages
- Server-sent event- Web sockets
• Real Time Web Collaboration Client(RTWCC)
Local MVC
• Responsibility - Present state of Collaboration- Provides interface to access or
modify state- Manage user’s permission- Register as a publisher for
Server-sent event.• Shared Point• Shared Stage
• Interaction Concentrated in - Perform an initialization to a
shared stage- Make synchronization to shared
point - Initialize an update to shared
stage- Execute a query to related state
Shared Model Main Controller
![Page 13: Combining HTML5 with MVC framework to simplify realtime collaboration for web devlopment](https://reader036.vdocuments.mx/reader036/viewer/2022070316/555e2816d8b42a384f8b5081/html5/thumbnails/13.jpg)
Implementation of RTWCS
![Page 14: Combining HTML5 with MVC framework to simplify realtime collaboration for web devlopment](https://reader036.vdocuments.mx/reader036/viewer/2022070316/555e2816d8b42a384f8b5081/html5/thumbnails/14.jpg)
S
Limitations
Development Process
Discussions
• double-model architecture for real-time web collaboration• RTWCC JavaScript library
Summary
![Page 15: Combining HTML5 with MVC framework to simplify realtime collaboration for web devlopment](https://reader036.vdocuments.mx/reader036/viewer/2022070316/555e2816d8b42a384f8b5081/html5/thumbnails/15.jpg)
References
![Page 16: Combining HTML5 with MVC framework to simplify realtime collaboration for web devlopment](https://reader036.vdocuments.mx/reader036/viewer/2022070316/555e2816d8b42a384f8b5081/html5/thumbnails/16.jpg)
![Page 17: Combining HTML5 with MVC framework to simplify realtime collaboration for web devlopment](https://reader036.vdocuments.mx/reader036/viewer/2022070316/555e2816d8b42a384f8b5081/html5/thumbnails/17.jpg)