Wikidocs provides a state of the art globally unique real time collaborative editing API for HTML.
No more a huge amount of time, resources and knowledge is necessary to enable real time collaborative editing for HTML. In less than 1h an average web developer can make almost any WYSIWYG editor collaborative. The technology works on HTML for desktop, tablet, mobiles and on native applications.
Wikidocs offers a service, installation in your own cloud, or OEM components to integrate in your software.
2. Realtime collaborative editing
★ though operation transformation (OT)
★ for your HTML content
★ with true WYSIWYG
★ for web and native
3. About OT for HTML
“[...]and HTML makes OT (Operational Transforms)
difficult if not impossible[...]”
http://www.waveprotocol.org/faq#TOC-What-s-the-XML-schema-for-waves-Why-isn-t-it-HTML5-
says
4. About OT for HTML
“[...]and HTML makes OT (Operational Transforms)
difficult if not impossible[...]”
http://www.waveprotocol.org/faq#TOC-What-s-the-XML-schema-for-waves-Why-isn-t-it-HTML5-
it is possible
says
5. create, share, edit on the go
★ for desktop, tablet, mobile
★ web and native
★ native is more responsive
and offers better
possibilities for end user
interaction
6. embed wikidocs wiki in your system
★ Customizable and embed-able
★ 100% REST API coverage
★ authentication, access permissions,
user management, storage, scalable,
etc.
★ a starting point to extend your system
with a wiki functionallity
7. embed wikidocs wiki in your system
★ Customizable and embed-able
★ 100% REST API coverage
★ authentication, access permissions,
user management, storage, scalable,
etc.
★ a starting point to extend your system
with a wiki functionallity
wikidocs demo app
embeded as facebook app
8. wikidocs api: create a new app or
integrate smoothly in your existing system
★ Your app
★ Your users
★ Your access rules
★ We sync
9. wikidocs api: create a new app or
integrate smoothly in your existing system
★ Your app
★ Your users
★ Your access rules
★ We sync
wikidocs api transparently
integrated in facebooks
group docs editor
14. Nice, but what’s real difference?
vs vs
<pre>
! <span class=" firepad-b">Realti</span><span class=" firepad-b firepad-i">me</span>
</pre>
<pre>
! <span class=" firepad-i">collaborative</span>
</pre>
<pre>
! <span class=" firepad-u firepad-i">ed</span><span class=" firepad-u">iting</span>
</pre>
15. Nice, but what’s real difference?
vs vs
<p>
! <b>Realti<i>me</i></b><br>
! <i>collaborative</i>
</p>
<p>
! <u><i>ed</i>iting</u>
</p>
16. What about custom attributes?
<p contenteditable=”true”>
! <span data-my-attr=”needs-work”>H3lp</span>
! <i class=”highlight”>me</i>
</p>
This is an important feature for custom editing functionalities and extensions.
17. What about custom attributes?
<p contenteditable=”true”>
! <span data-my-attr=”needs-work”>H3lp</span>
! <i class=”highlight”>me</i>
</p>
we synch them
This is an important feature for custom editing functionalities and extensions.
18. What about non editables?
<p contenteditable=”true”>
<h1>Watch this</h1>
! <div class=”video” contenteditable=”false”>
! ! <iframe src="//youtu.be/841FgLrc-zQ">
! ! </iframe>
! </div>
</p>
This is an important feature for rich media integration.
19. What about non editables?
<p contenteditable=”true”>
<h1>Watch this</h1>
! <div class=”video” contenteditable=”false”>
! ! <iframe src="//youtu.be/841FgLrc-zQ">
! ! </iframe>
! </div>
</p>
we synch them
This is an important feature for rich media integration.
21. You have HTML, we synch it.
<html>
<body>
! <div id="content-1234"
! ! contenteditable="true">
! <h1>Hello World</h1>
! <p>Wikidocs is here!</p>
! </div>
</body>
</html>
<link rel="stylesheet" href="wikidocs.css">
<script src="sockjs.min.js"></script>
<script src="wikidocs.min.js"></script>
var app = WD.App(accessToken);
var editable =
! document.getElementById('content-1234');
app.Document('/channel-1234').bind(editable);
22. How can I see collaborators?
var app = WD.App(accessToken);
var editable = document.getElementById('content-1234');
var doc = app.Document('/channel-1234').bind(editable);
doc.on('subscribed', updateSubscribers);
doc.on('unsubscribed', updateSubscribers);
function updateSubscribers(session) {
! doc.subscriptions.forEach(function (session) {
! ! // do magic...
! });
}
Wikidocs api provides additional features to provide a good user experience
around real time collaborative editing.