Repurposing LNG terminals for Hydrogen Ammonia: Feasibility and Cost Saving
Shared Editing on the Web: A Classification of Developer Support Frameworks
1. Learning
Layers
CollaborateCom 2013
2013-10-23
Austin, TX, USA
Shared Editing on the Web:
A Classification of Developer
Support Libraries
István Koren, Andreas Guth, Ralf Klamma
Advanced Community Information Systems (ACIS)
RWTH Aachen University, Germany
koren | guth | klamma@dbis.rwth-aachen.de
Lehrstuhl Informatik 5
(Information Systems)
Prof. Dr. M. Jarke
1
This slide deck is licensed under a Creative Commons Attribution-ShareAlike 3.0 Unported License.
2. Advanced / ATLAS / Awesome / Aachen
Community Information Systems (ACIS)
Lehrstuhl Informatik 5
(Information Systems)
Prof. Dr. M. Jarke
2
Responsive
Open
Community
Information
Systems
Community
Visualization
and
Simulation
Community
Support
Community
Analytics
Requirements
Engineering
Web Analytics
Web Engineering
Learning
Layers
5. Learning
Layers
Motivation for Developing Web Apps
Many
Platforms
– Mobile cross-platform development tools
– Completely Web based OS’s
– Responsive Web Design
Multiple
devices per user
Many “script” developers join the market
It is very hard to develop Shared Editing from scratch!
Lehrstuhl Informatik 5
(Information Systems)
Prof. Dr. M. Jarke
5
6. Learning
Layers
Server-Push Technologies
Ajax
Comet
WebSockets
various
JS libraries available
– socket.io, BrowserChannel, CometD
XMPP
offers structured data exchange
between client and server
Lehrstuhl Informatik 5
(Information Systems)
Prof. Dr. M. Jarke
6
7. Learning
Layers
WebRTC – Peer-to-Peer on the Web
Audio
& Video Communication
DataChannel for sending arbitrary data
Signaling server required
Lehrstuhl Informatik 5
(Information Systems)
Prof. Dr. M. Jarke
7
10. Learning
Layers
Architectures for Shared Editing
Systems
Centralized
Peer-to-peer
Hybrid
Lehrstuhl Informatik 5
(Information Systems)
Prof. Dr. M. Jarke
10
11. Learning
Layers
Workspace Awareness
Answers
Who, What and Where questions
Participant
list
Teleselection
Telepointers
Radar view
Lehrstuhl Informatik 5
(Information Systems)
Prof. Dr. M. Jarke
11
12. Learning
Layers
Workspace Awareness Tools
(case Etherpad)
1: User-specific colors
2: Mouseover effects
3: Participant list
4: Chat
Lehrstuhl Informatik 5
(Information Systems)
Prof. Dr. M. Jarke
12
13. Learning
Layers
Google Drive SDK Realtime API
Object
oriented approach
Integrated in Google Drive ecosystem
History support (undo/redo)
UI binding
// initialize string variable
var str = model.createString(’Hello World!’);
model.getRoot().set(’text’, str);
var textArea = document.getElementById(’edit’);
realtime.databinding.bindString(str, textArea);
Lehrstuhl Informatik 5
(Information Systems)
Prof. Dr. M. Jarke
13
https://developers.google.com/drive/realtime/
14. Learning
Layers
OpenCoweb
Utilizes
operational transformation
Comes with ready-made widgets (text, maps, chat)
collab.sendSync("examplename", "x", "insert", 5);
collab.sendSync("examplename", null, "delete", 5);
OT
Lehrstuhl Informatik 5
(Information Systems)
Prof. Dr. M. Jarke
14
library available separately
http://opencoweb.org/
15. Learning
Layers
MobWrite
Uses
differential synchronization
Syncs HTML elements
Two data types: text and numbers
mobwrite.share("textfield");
mobwrite.unshare("textfield");
Lehrstuhl Informatik 5
(Information Systems)
Prof. Dr. M. Jarke
15
https://code.google.com/p/google-mobwrite/
16. Learning
Layers
ShareJS
Server
runs on node.js
Large parts of source taken from Etherpad
OT operations for arbitrary JSON objects
No history support
doc.submitOp({i:"Some text", p:100}, callback);
doc.insert(100, "Some text", callback);
Lehrstuhl Informatik 5
(Information Systems)
Prof. Dr. M. Jarke
16
http://sharejs.org/
17. Learning
Layers
Changesets
Low
level access to OT functionality
Only plain-text
Changes must be sent to collaborators manually
doc.submitOp({i:"Some text", p:100}, callback);
doc.insert(100, "Some text", callback);
Lehrstuhl Informatik 5
(Information Systems)
Prof. Dr. M. Jarke
17
https://github.com/marcelklehr/changesets
18. Learning
Layers
Collaborative Editing Framework for
XML (CEFX)
Not
targeted for Web; XMPP for message exchange
Uses multiple history-buffers per document
– queues of remote operations
– updates do not affect other nodes
<!DOCTYPE html>
<html>
<body>
<p>
<a href="#C4">See also Chapter 4.</a>
</p>
<h2>Chapter 1</h2>
<p>This chapter explains ba bla bla</p>
Lehrstuhl Informatik 5
(Information Systems)
Prof. Dr. M. Jarke
18
<h2>Chapter 2</h2>
<p>This chapter explains ba bla bla</p>
</body>
</html>
19. Learning
Layers
Comparison
All
but one based on OT
Lack of awareness tools
Well-documented
Lehrstuhl Informatik 5
(Information Systems)
Prof. Dr. M. Jarke
19
20. Learning
Layers
ROLE Sandbox & SDK
Web application (composed of widgets)
Lehrstuhl Informatik 5
(Information Systems)
Prof. Dr. M. Jarke
20
Space (shared by multiple users)
Widget (collaborative web
component)
http://role-sandbox.eu/
25. Learning
Layers
fin
This work was supported by the LAYERS FP7 ICT Integrated Project of
the European Commission (grant agreement no. 318209).
Lehrstuhl Informatik 5
(Information Systems)
Prof. Dr. M. Jarke
25