1. Ubiquitous Access for Collaborative Information System Using SVG July 17 2002 Sangmi Lee, Geoffrey Fox, Sunghoon Ko, Minjun Wang, Xiaohong Qui http://grids.ucs.indiana.edu Community Grids Laboratory, Indiana University Computer Science, Syracuse University Computer Science, Florida State University

2. Overview of Garnet System Purpose : Support Education, Training and if possible Computing as Grid(Web) Services Purpose : Support Education, Training and if possible Computing as Grid(Web) Services Integrate Synchronous and Asynchronous collaboration Integrate Synchronous and Asynchronous collaboration Support hand held and desktop clients (universal access)- Carousel project Support hand held and desktop clients (universal access)- Carousel project NaradaBrokering to implement publish/subscribe model NaradaBrokering to implement publish/subscribe model Uniform XML event (message) based architecture Uniform XML event (message) based architecture XML Schema GXOS supports hierarchical data structures XML Schema GXOS supports hierarchical data structures Metadata set for resources : user profile, document, hardware.. Metadata set for resources : user profile, document, hardware.. MyXoS manages XML information nuggets MyXoS manages XML information nuggets Support collaborative features : basic interactive features (textchat, whiteboard, etc.), shared resources (shared display, shared export), AV conferences. Support collaborative features : basic interactive features (textchat, whiteboard, etc.), shared resources (shared display, shared export), AV conferences.

3. Adapting SVG for Shared Export format in Garnet System Vector graphics formats for Collaborative systems : SVG (Scalable Vector Graphics) from W3C, PDF from Adobe Inc. Vector graphics formats for Collaborative systems : SVG (Scalable Vector Graphics) from W3C, PDF from Adobe Inc. Each client can resize and scroll while preserving correct positions of pointers and annotations for their various resolutions. Each client can resize and scroll while preserving correct positions of pointers and annotations for their various resolutions. Various browser and converters are now available. Various browser and converters are now available. Adobe Illustrator, OpenOffice.org Adobe Illustrator, OpenOffice.org converter from PowerPoint, Macro media converter from PowerPoint, Macro media Benefits of XML/Vector graphics Benefits of XML/Vector graphics Extended styling – CSS, XSL Extended styling – CSS, XSL Benefits of using DOM Benefits of using DOM

4. Garnet : Shared Display Shared display shares the bitmap data defining display window of the collaborative application. Major ClientPC usersPDA users

5. Shared Display in collaborative systems Advantage : easy to develop Disadvantage : Shared Display does not allow significant flexibility. Different clients cannot examine separate viewpoints of a scientific visualization. Wireless devices need a wide variety of viewpoints due to their mobile network communication, and limited display systems. Object or WS Object or WS Object or WS Object or WS display Object or WS viewer WS Display Event (message) service

6. More flexible sharing objects : Shared Export In the distributed object technology, objects can have multiple stages in their processing. Web Service R F I O U F I O Web Service R F I O U F I O Web Service R F I O U F I O Event (Message) Service WS Viewer WS Viewer WS Viewer WS Display WS Display WS Display Master Other participants

7. Design Issues Shared Export with SVG format Integrated toolkits : converter from VML, WMF to SVG – initial efforts Integrated toolkits : converter from VML, WMF to SVG – initial efforts Communication : NaradaBrokering/GMSME message types Communication : NaradaBrokering/GMSME message types Separate presentation from document and separate user event from document model. Separate presentation from document and separate user event from document model. Collaborative Events – Collaborative document loading, collaborative Zooming, Scrolling, Annotation Collaborative Events – Collaborative document loading, collaborative Zooming, Scrolling, Annotation Integrate mobile devices Integrate mobile devices Performance issues – compression data for PDAs Performance issues – compression data for PDAs

8. Integrated converting toolkit

9. Workflow of Shared SVG Browser  Collaborative Event handler  DOM tree Generator  SVG Image Renderer  Collaborative Browser

10. Collaborative SVG Event Processing : collaborative document loading Application Invocation : The most initial event of shared SVG Browser processed when the presenter open their shared browser and loads new SVG documents. Application Invocation : The most initial event of shared SVG Browser processed when the presenter open their shared browser and loads new SVG documents. Collaborative document loading : When presenter loads new SVG document, the other participants load new document into local machine. Collaborative document loading : When presenter loads new SVG document, the other participants load new document into local machine. Event message : header( user, device, application information, event type) + new uri Event message : header( user, device, application information, event type) + new uri

11. Collaborative SVG Event Processing : collaborative zooming Resolution Customization Resolution Customization If the presenter zooms in or out, other participants ’ shared SVG browser will render graphics based on the resolution from the presenter. If the presenter zooms in or out, other participants ’ shared SVG browser will render graphics based on the resolution from the presenter. The independent zooming event is processed in every shared browser The independent zooming event is processed in every shared browser Every rendering is from the replica of document initially loaded. Every rendering is from the replica of document initially loaded. Event Message : message header + zooming rate Event Message : message header + zooming rate

12. Collaborative SVG Event Processing : collaborative annotation Annotation : The presenter ’ s annotation is shared in participants ’ browser. Annotation : The presenter ’ s annotation is shared in participants ’ browser. The event annotation will contain the (x, y) 2D graphical positions on the current bitmap and annotation type : event is captures in user interface level (bitmap-wise) The event annotation will contain the (x, y) 2D graphical positions on the current bitmap and annotation type : event is captures in user interface level (bitmap-wise) Each event converted to SVG documents and rendered dynamically on each client application via DOM interface for replica of SVG document. Each event converted to SVG documents and rendered dynamically on each client application via DOM interface for replica of SVG document. Event Message : message header + X,Y position in user device + annotation type + annotation message Event Message : message header + X,Y position in user device + annotation type + annotation message Converted event : SVG document Converted event : SVG document X,Y position in original SVG coordinate system X,Y position in original SVG coordinate system Annotation described in SVG located in local system for each users. (editable) Annotation described in SVG located in local system for each users. (editable)

13. Garnet : Shared Export PCsPDAs

14. My_Professo r : integrated GUI for PDAs

15. Development Environment Desktop application Desktop application modify Batik browser to be able to collaborate (supporting message services, and event handling). modify Batik browser to be able to collaborate (supporting message services, and event handling). Integrate collaborative browser as a Java sharedlet. Integrate collaborative browser as a Java sharedlet. Access DOM tree via Batik DOM interface Access DOM tree via Batik DOM interface Windows 2000 Windows 2000 PDA application PDA application Rendering image with Batik rendering APIs. Rendering image with Batik rendering APIs. J2ME Personal Java1.1 J2ME Personal Java1.1 Wireless communication IEEE 802.11b Wireless communication IEEE 802.11b WinCE 3.0 WinCE 3.0

16. Experimental Results GMSME : iPaq H3650, WinCE 3.0, Personal-Java1.1 GMSME : iPaq H3650, WinCE 3.0, Personal-Java1.1 Wireless 11 Mbit/s IEEE 802.11b Wireless 11 Mbit/s IEEE 802.11b Total Latency

17. Conclusions and Future work Future Work Future Work SVG Shared export as a collaborative Web Services. SVG Shared export as a collaborative Web Services. Port to Palm OS based devices/HTTP protocol Port to Palm OS based devices/HTTP protocol Storing Annotated documents Storing Annotated documents SVG provided high-quality display system for heterogeneous devices and clear interfaces for other document based resources. SVG provided high-quality display system for heterogeneous devices and clear interfaces for other document based resources. We integrated PDAs into conventional collaborative system and implemented event systems for various stages on object pipeline. We integrated PDAs into conventional collaborative system and implemented event systems for various stages on object pipeline.