NPAC 111 College Place Syracuse NY 13244 4100 Phone: 3154432163

1. Shared Places on the Web: XML for Web-based collaboration and Distance Educationhttp://www.gca.org/conf/xmldev99/http://www.npac.syr.edu/users/gcf/montrealxmlaug99XML Developers ConferenceMontreal August 19-20 1999 Lukasz Beca Geoffrey Fox Marek Podgorny Syracuse University NPAC 111 College Place Syracuse NY 13244 4100 Phone: 3154432163 montrealxmlaug99 http://www.npac.syr.edu gcf@npac.syr.edu

2. Abstract of XML and Collaboration • We describe the essentials of shared event collaboration and how it is naturally integrated with the Web for both replicated client and server side shared objects. • We describe TangoInteractive and its applications • One use of XML is to define Shared Web Pages which implement both asynchronous (portal) and synchronous collaboration • Another use of XML is to support universal access and to link diverse display devices in collaborative sessions • We define the resultant event based architecture to be used in a new implementation of TangoInteractive montrealxmlaug99 http://www.npac.syr.edu gcf@npac.syr.edu

3. WebPage WebPage WebPage What is Web-based Collaboration? • Collaboration means sharing objects • Web-based Collaboration implies use of Web to share distributed objects accessible through the Web • Shared Web Pages; Resources accessed through Web Servers or Brokers; Client-side applications with programmatic interfaces Web Site Specify Page Receive Identical Page montrealxmlaug99 http://www.npac.syr.edu gcf@npac.syr.edu

4. Simplest Shared Object is Client Side Java Applet • Web Pages are an example where there is a single copy of an object; perhaps simpler is the replicated object model used in chat-rooms and more generally shared applets where sharing is maintaining consistent state of replicas ServerSharesEvents Java Chat Rooms (applications or applets). Share text typed by users montrealxmlaug99 http://www.npac.syr.edu gcf@npac.syr.edu

5. Architecture of Tango Distance Education Share URL’s Audio Video ConferencingChat Rooms White Boards etc. JSU WebServer NPAC WebServer Student’s View ofCurriculum Page Teacher’s View ofCurriculum Page Java TangoServer HTTP Address at JSU ofCurriculum Page ……. Java Sockets ……. Java Control Clients Teacher/Lecturer at NPAC Participants at JSU All Curricula placed on the Web montrealxmlaug99 http://www.npac.syr.edu gcf@npac.syr.edu

6. So putting these ideas together for Distance Education • We have curricula authored in some fashion and placed on the Web -- it is shared by sharing specification of current Web Page • At simplest this is URL but also supported using JavaScript API and Shared Web Page Events are: • Shared Scrolling position • Shared Pointer as DHTML layer • We have shared client side C++ object -- the digital audio-video conferencing subsystem • We have several shared Java applets • One or more Chat rooms • Whiteboard • “Raised Hand” / Quiz applets for specialized teacher-student interactions montrealxmlaug99 http://www.npac.syr.edu gcf@npac.syr.edu

7. Applications of Web-based Collaboration • Multi Player Games: Use Chat Rooms and digital VTC to establish context • Share Java, JavaScript, VRML etc. games • Tango has Card Games, Othello, Chess, Snakes and Ladders • Crisis Management: Again use general tools (including whiteboard) and add shared maps and multimedia situation reports • Command and Control:Military, Test and Evaluation -- any real time control of complex system • support distributed experts who can be on call remotely and shared object is visualization of test results • Collaborative Computing and Engineering: Here specialized shared objects are CAD, simulation and planning tools • Socializing ….. montrealxmlaug99 http://www.npac.syr.edu gcf@npac.syr.edu

8. ObjectRepository WebPage WebPage WebPage object object object More General Shared server side Objects • Web Page Sharing is a special case of sharing server side objects -- CGI Scripts, Databases, Object Repositories etc. • This can be done by sharing the Web specification of these objects which can be done client side without ANY change to basic object • This is sharing of client side interface (proxy) to server side object Collaboration ServerShares ObjectSpecification Fetch Identical Objects Specify Object Receive Identical Specification montrealxmlaug99 http://www.npac.syr.edu gcf@npac.syr.edu

9. Sharing Server Side Objects II • We have used the shared proxy notion to implement • Shared Browser • Shared Form to access Server side computation (NCSA Biology Workbench -- bunch of CGI scripts) • Shared access to Web-linked database Server does not need to know about detail of collaboration. It is more efficient if it caches information for re-use. Thus use custom data-base caching or general proxy server montrealxmlaug99 http://www.npac.syr.edu gcf@npac.syr.edu

10. Shared Event Model of Collaboration? • So if all clients want exactly same view at all times, then the “shared event” model is a waste. • Might as well, just share the display produced on originating client (cf. Microsoft NetMeeting) • In fact, shared event typically enables each client to get the same view but instead one shares the object but has different presentation layers on each client • For instance, share a single XML document but apply different style sheets on each client • Again in command and control, basic application is a 3D map (Geographical Information System) but not so interested clients can present a simple 2D view montrealxmlaug99 http://www.npac.syr.edu gcf@npac.syr.edu

11. So what do we have now--TangoInteractive • http://www.npac.syr.edu/tango • Largely Java system enabling collaboration between general client side objects • If client side object is a Server proxy, then this ruse enables sharing of server side objects • Has API for Java applet/application, C++, JavaScript • API Enables sharing of events in applications • This is just a fancy way of saying it forwards messages • API Enables applications to find out about participants • Currently ONLY deployed for Netscape version 4.5 as uses LiveConnect to connect JavaScript to Java • Internet Explorer version not fully debuggd montrealxmlaug99 http://www.npac.syr.edu gcf@npac.syr.edu

12. Next Generation TangoInteractive • So let us imagine that we can redo all of this and assume that • The proxy ruse is correct and one does only need to share client side Web Pages • There are plenty of conventional web pages but full support for XML and W3C DOM in browsers • XML can be used for control pages and specialized pages such as those produced by web-linked databases and education portals • Collaboration implies sharing of electronic objects and is needed in Asynchronous and Synchronous modes • Asynchronous mode is MOST important (in all applications including distance education) and will be supported by run of the mill object web infrastructure • shared web pages and documents • electronic mail • Synchronous mode has important applications and not done fully by giants ... montrealxmlaug99 http://www.npac.syr.edu gcf@npac.syr.edu

13. Shared Places on the Web I • Each “Shared Place on the Web” or SPW is a set of XML and HTML documents • An XML document defines the collaboration Structure -- who is allowed in “Shared Place”; what objects can be there; where they are stored • This replaces the suite of undocumented rigid policies in TangoInteractive as well as scattered configuration files • There is one such XML document for each type of SPW e.g. there would be distedtojacksonstate.xml or xmldevelopersconf.xml etc. • We have developed SPDL (Shared Place Definition Language) which is currently quite simple and is used in the SPW structure definition montrealxmlaug99 http://www.npac.syr.edu gcf@npac.syr.edu

14. Shared Place Example: Introduction • In this example we define a simple shared place where the results of some scientific computations are available. • The place can be used also for discussion among collaborating scientists. The discussion is supported by two shared objects: chat and data viewer. • The chat can be used for the text based discussion about presented results. • The data viewer can be used for the graphical presentation of the results. The authors of the results (‘creators’) have access to the advanced functionality of the data viewer. (e.g. support of particular XML dialects) They can use this functionality to present their findings visually to the ‘observers’. • The shared place is defined by two documents. The presentation layer is described by the HTML document and the collaboration functionality is defined by the SPDL XML/XSL document. montrealxmlaug99 http://www.npac.syr.edu gcf@npac.syr.edu

15. Overview of Typical SPDL Document • The SPDL document defines several collaboration aspects of the shared place. • The header defines the communication protocol used for contact with collaboration server. (could be CORBA or what have you) • Next, all the shared objects embedded in the shared place are enumerated. • The following fragments define the user groups that have access to the shared place, specific user roles, and types of the collaborative sessions that are established in the shared place. • Other fragments describe how the data visible by different users are synchronized and specify the sources of the content presented by the shared objects. • Note how some Shared Place properties (e.g. users and files) are useful in non-collaborative page mode and others support both synchronous and asynchronous collaboration montrealxmlaug99 http://www.npac.syr.edu gcf@npac.syr.edu

16. SPDL Document Header Initialize shared place definition • <?xml version=”1.0”?> • <placedef> • <head> • <title>Result Presentation</title> • <protocol type=”plain”> • <server>kopernik.npac.syr.edu</server> • <port>5555</port> • </protocol> • </head> • The Header contains the title of the place. • It also declares how the shared place communicates with the collaboration framework. (I.e. server in Tango language) • The plain client/server protocol is chosen here with the collaboration server running on the machine: kopernik.npac.syr.edu on the port: 5555. • Other protocols such as IIOP can be used as well. montrealxmlaug99 http://www.npac.syr.edu gcf@npac.syr.edu

17. Declare the Shared Objects • <sharedobject name=”viewer”/><location>http://www.npac.syr.edu/experiments/apps/viewer.jar • </location> • <width>300</width> • <height>300</height> • </shared_object> • <sharedobject name=”chat”>……</sharedobject> • This fragment describes shared objects that are used in the shared place. • Two shared objects are declared. • Other objects which are not declared here, will not be supported by the Shared Place Framework in the ‘Result Presentation’ place (HTML Page). montrealxmlaug99 http://www.npac.syr.edu gcf@npac.syr.edu

18. What does SPDL Document Define Collaboration functionality: • Session management: Defines how the Shared Objects initiate or join collaborative sessions • Synchronization: Describes mechanisms for assuring the consistence of data observed by collaborating users • Control mechanisms: Defines how the behavior of Shared Objects can be controlled and how the state of the collaboration session can be accessed Shared Object data: • Initial state: Defines how the Shared Object are initialized when they start running • Persistence: Describes whether and how the content of the collaborative session is stored • Content: Describes the data to be processed by Shared Objects during collaboration session montrealxmlaug99 http://www.npac.syr.edu gcf@npac.syr.edu

19. What SPDL Document Defines- continued Users: • Grouping: Defines user groups with possibility of assigning roles • User identity based configuration: It is possible to define different behavior of Shared Object depending on the user, user group or user role Referencing Shared Objects: • Shared Object ID: SPDL uses Shared Object ID to define properties for specific Shared Object • Granularity: It is possible to define different behavior for individual Shared Objects, classes of Shared Objects or for the whole Shared Place montrealxmlaug99 http://www.npac.syr.edu gcf@npac.syr.edu

20. Definition of Groups of Users • <groups> • <group name=”syracuse”> • <user>morgan</user> • <user>cheng</user> • </group> • <group name=”boston”> • <user>smith</user> • <user>johnson</user> • </group> • <group name=”washington”> • <user>anderson</user> • <user>brown</user> • </group> • </groups> • This fragment of the SPDL document defines user groups. Those groups are used in further sections of the SPDL document to define other properties of the shared place. Three user groups, each with two users, are defined: syracuse, boston and washington. montrealxmlaug99 http://www.npac.syr.edu gcf@npac.syr.edu

21. Shared Places on the Web II • There are HTML documents defining shared places themselves; they instantiate particular objects and form presentation layer • There is an associated XSL style sheet which invokes necessary programmatic capabilities and interprets XML islands in HTML document. These islands are defined in SPDL • There can be many SPW’s presentation layers with a given SPDL structure • This (HTML + Style sheet) combination replaces the current TangoInteractive “Control Applet” • We will re-use some existing client side Java as SP agent and control objects invoked from style sheets • The TangoInteractive Server can also be largely re-used montrealxmlaug99 http://www.npac.syr.edu gcf@npac.syr.edu

22. A Collection of Shared Place Components SPDL document Web browser <placedef> . . . </placedef> Web page Regular content Shared objects So Web Page is defined as a set of Nodes -- You choose which nodes (and their children) that you wish to share and then events are exchanged maintaining state consistency montrealxmlaug99 http://www.npac.syr.edu gcf@npac.syr.edu

23. Web Page with 2 Shared Objects • <HTML> • <head><title>Page with the computation results</title></head> • <body> • <xml id="placeDocument" src="results.xml"></xml> • <xml id="chatDef"> • <embedobject name="chat"> • <location>http://www.npac.syr.edu/experiments/apps/chat.jar • </location ></embedobject></xml> • <xml id="viewerDef"> • <embedobject name="viewer"> • <location>http://www.npac.syr.edu/experiments/apps/viewer.jar • </location ></embedobject></xml> • <xml id="style" src="spdl.xsl"></xml> SPDL Definitions Page Shared Objects Style Sheet montrealxmlaug99 http://www.npac.syr.edu gcf@npac.syr.edu

24. Object or Visual Proxy for Object Event specifying Object or Change in Object Federate and Queue events Collaboration Framework I • Objects register and then define their state via a stream of events • Need to share (federate) events between domains (your PC and mine) whose event services are normally isolated “Tango Server” Clients which receive events which are either queued (asynchronous) or processed synchronously montrealxmlaug99 http://www.npac.syr.edu gcf@npac.syr.edu

25. Shared Place(SP) Agent Event Stream (Messages) Each Collaborating Client Receives Events • Event Stream becomes set of time stamped XML messages • Control Messages: e.g. New Participant Joined • Shared Object Definition/Update Messages (e.g. Page Scrolled by such and such amount done as XML serialization of JavaScript Event object) One or MoreShared Places One or MoreShared Places …………. montrealxmlaug99 http://www.npac.syr.edu gcf@npac.syr.edu

26. SPW and Portals • There is a lot of interest in portals these days • We build Web-based computing environments which are portals to Supercomputers and Web-based education or portals to a virtual university • Merrill Lynch predicts that Enterprise Information portal market will be $15B by 2002 • Portals are built (by us) as a customizableset of XML components ( e.g. Run a Particular Program or display thumbnail of the next web-page in lecture) • SPW’s can be thought of as customizable collaborative portals which define both synchronous and asynchronous shared components montrealxmlaug99 http://www.npac.syr.edu gcf@npac.syr.edu

27. SPW as Shared Portal on the Web • Electronic Mail and News Updates are just “events” which can be handed to viewer objects in an SPW • In synchronous collaboration, events are typically generated on a client and immediately shared with other clients • Asynchronous events typically are generated by a server (which offers persistent store) and transmitted to client • Integration of Synchronous and Asynchronous Events is essential in “Next Generation” TangoInteractive • Customization is available as you can choose which objects are in your SPW and you can define customization parameters such as area for which you want weather and which sports results should be displayed • Such customized portals are commonplace but SPDL has the advantage that it specifies both synchronous and asynchronous portal components. montrealxmlaug99 http://www.npac.syr.edu gcf@npac.syr.edu

28. Two Uses of XML in Collaboration? • We have introduced XML used to define the nature of collaboration in terms of objects, clients, policies • We have discussed user customization in terms of portals • Consider the JavaScript Shared Browser (JSSB) in TangoInteractive • It is an example of collaborative content built around sharing events defined in Web Page • Difficulties with “version 4 DOM” as bugs and inconsistent or incomplete implementations • However it can be made to work very effectively • Here we discuss “content” Web pages and not the “Collaboration Definition” Web pages we discussed already • Remember that “shared event” Collaborative systems share the object and not its particular presentation layer on each client montrealxmlaug99 http://www.npac.syr.edu gcf@npac.syr.edu

29. JSSB Currently Shares Existing Web DOM in Netscape 4.5 • Clicks on form/linkin layers or frames • Clicks on layers • mouseover and mouseout... • Can veto default action on clicks or other events on nonmaster side • Don’t know how to veto changes on nonmaster in Netscape4 • Save Form Contents at any time • can reload any dump at any time • Resizing so all clients have same scaling • Scrolling • Sharing can be customized from dialog window • Download times to monitor bad networks at application level • JSSB does monitor client page to detect unwanted page changes (One can capture clicks on Page links but not on “back button” ) montrealxmlaug99 http://www.npac.syr.edu gcf@npac.syr.edu

30. JavaScript Shared Browser with Dynamic HTML -- Shared Pointer • Shared Pointer added to Internet Assistant PowerPoint on the Web • Illustrates sharing of Web Object Modelinternal to document montrealxmlaug99 http://www.npac.syr.edu gcf@npac.syr.edu

31. Shared Form Illustrated by Shared Access to NCSA Biology Workbench showing how general server objects can be shared from web interface Shared Multiple List Shared Buttons Shared Text field Shared Checkbox montrealxmlaug99 http://www.npac.syr.edu gcf@npac.syr.edu

32. WebPage User and System Events • One can either share raw system message (click event occurred) or higher level user event generated by JavaScript invoked by event • Note Netscape 4.5 does NOT allow you to generate a general event in a page • You can invoke “click” events on form elements but not so events associated with layers • You can parse JavaScript invoked by event and transmit but this is unreliable • So User events are convenient and sometimes required Capture Click and Invoke Tango JS Interface with meaning that click occurred Function process() … Invoke Tango JS Interface with user defined meaning Or Click on Button which happens to invoke some User JavaScript Code montrealxmlaug99 http://www.npac.syr.edu gcf@npac.syr.edu

33. JSSB and Shared Card Games Cards are 56 DHTML Layers All of this implies XML Framework for Card Games and InternetGambling Dialog BoxInvokes SharedUser Events montrealxmlaug99 http://www.npac.syr.edu gcf@npac.syr.edu

34. Sharing XML Content Pages • So “new version of JSSB” for SPW should implement: • Share XML content of a document • Allow each collaborating client to generate personalized presentation layer using customized stylesheet or equivalent • Note TangoInteractive can map object specification on each client and so customization can be performed either before or after web page generated • Currently we map URL’s before submission so each client accesses optimal mirror site (if available) montrealxmlaug99 http://www.npac.syr.edu gcf@npac.syr.edu

35. XMLContent Pages XMLContent Pages Style Sheet / User Profile Customization Agent Style Sheet / User Profile Customization Agent WebPage WebPage XML JSSB Architecture Content Server Nonmaster Master Shared by SPW Events Trapped byXML JSSB montrealxmlaug99 http://www.npac.syr.edu gcf@npac.syr.edu

36. Applications of Shared XML Content Pages • Support of Collaboration between PC client, Palmtop and high graphics devices such as CAVE’s • So in education, can support a mix of wireless palmtops and laptops in the class, with distance PC’s • Laptops and PC’s get all the information including shared PowerPoint/Web Curricula pages etc. • Palmtops just get quizzes, chatrooms, whiteboard etc. • Linkage of geographically distributed researchers is necessary to support collaborative computational science • One researcher may be in a 3D virtual environment • Others will be looking at traditional scientific visualization on workstations • A common XML specification of visualization is mapped according to display capabilities of client device montrealxmlaug99 http://www.npac.syr.edu gcf@npac.syr.edu

37. XML and Universal Access I • It is essential that collaborative technologies support all users independent of their hardware and physical capabilities • Hardware issues are essentially illustrated by palmtop to CAVE example on previous foil • Suppose we wish to teach a class where some students and/or teachers have impaired sight and hearing. • Then we need to share same object content but render it differently on each client. • Possibly want to render a given object in multiple ways on a given machine • Essential to share content (as in XML JSSB) and this enables you to choose right presentation for given client • Typical HTML layout aimed at fully capable users and needs to be redone for physically impaired users • Concepts of XML JSSB for universal access developed with Al Gilman from Trace Center montrealxmlaug99 http://www.npac.syr.edu gcf@npac.syr.edu

38. XML and Universal Access II • Assume that all education will be web-based • Assume that we need to provide web resources of equal quality for all citizens • This will not work if one has to translate each course from material for “regular user” to that for “user for different access capabilities” • Thus only chance is to define curriculum in XML and produce customized presentation layers • One will need a powerful indexing/abstracting scheme to be able design appropriate navigation schemes for all users and clients • Natural framework is XML based Education Portals with SPW implementing collaboration (a.k.a. teaching) montrealxmlaug99 http://www.npac.syr.edu gcf@npac.syr.edu

39. WebPage Some Technical and System Comments • There is a lot of Tango Software lying around to implement collaboration and so natural to implement customization in Java or JavaScript as an alternative to XSL • 15,000 lines JavaScript and a lot more Java • Note JavaScript very fast but phenomenological • Undefined thread behaviour etc. makes for experimental programming • However there is usually way of getting things to work • Note that on detects events at presentation layer but must share at object layer-- only works if this connection well defined SharedObject XMLContent Pages Converted byBrowser etc. Events Trapped by XML JSSB define object state montrealxmlaug99 http://www.npac.syr.edu gcf@npac.syr.edu

40. Conclusions • We have analyzed a successful Web-based collaboration system TangoInteractive and in particular its JavaScript interface enabling shared interactive web pages • We have noted that it is very helpful to • use XML and new W3C DOM • Link Asynchronous and Synchronous events • Link Portal and Collaboration technology • XML can be used in defining portal/shared collaboration space • XML can support universal access to collaborative environments to those with disabilities -- hence giving them access to education • XML can support collaboration between clients from palmtops, to PC’s and high-end virtual environments • TangoInteractive is available now at http://www.npac.syr.edu/tango • Prototypes involving SPDL and Collaborative PC’s/palmtops will beavailable in Jan 00 • This talk is:http://www.npac.syr.edu/users/gcf/montrealxmlaug99 montrealxmlaug99 http://www.npac.syr.edu gcf@npac.syr.edu