diff --git a/README.md b/README.md index ee9c1671..fddad213 100644 --- a/README.md +++ b/README.md @@ -8,12 +8,13 @@ but does not require you to understand how the internals work. The predefined da Predefined data structures: * Text - [Collaborative Text Editing Example](http://dadamonad.github.io/Yatta/examples/TextEditing/) and [Source](./examples/TextEditing/) * Json - [Tutorial](./examples/PeerJs-Json/) -* XML (coming soon) +* XML - [XML Example](./XmlExample) Collaboratively manipulate the dom with native dom-features and jQuery. Unlike other frameworks, Yatta! supports P2P message propagation and is not bound to a specific communication protocol. It is possible to add any communication protocol to Yatta. Currently it supports: * [PeerJs](http://peerjs.com/) - A WebRTC Framework +* [SimpleWebRTC](http://simplewebrtc.com/) - Another WebRTC Framework * [IWC](http://dbis.rwth-aachen.de/cms/projects/the-xmpp-experience#interwidget-communication) - Inter-widget Communication ## Use it! @@ -75,10 +76,16 @@ Yatta! is still in an early development phase. Don't expect that everything is w But I would become really motivated if you gave me some feedback :) ([github](https://github.com/DadaMonad/Yatta/issues)). ### Current Issues -* XML support +* HTML editable tag +* More efficient representation of text. +* Use a better data structure for the History Buffer - it should be possible to use Arrays. +* SimpleRTC support + ## Support -Please report any issues to the [Github issue page](https://github.com/DadaMonad/Yatta/issues)! +Please report _any_ issues to the [Github issue page](https://github.com/DadaMonad/Yatta/issues)! +I would appreciate if developers gave me feedback on how _convenient_ the framework is, and if it is easy to use. Particularly the XML-support may not support every DOM-methods - if you encounter a method that does not cause any change on other peers, +please state function name, and sample parameters. However, there are browser-specific features, that Yatta won't support. ## License Yatta! is licensed under the [MIT License](./LICENSE.txt). diff --git a/examples/README.md b/examples/README.md index a11fdf44..26f28a60 100644 --- a/examples/README.md +++ b/examples/README.md @@ -8,5 +8,6 @@ Here you find some (hopefully) usefull examples on how to use Yatta! ## Demos * [Text Editing](./TextEditing/) Simple collaborative text editing demo with PeerJs and Text Framework. -* [IWC Demo](./IwcDemo/) More IWC example widgets.. +* [XML Example](./XmlExample) Collaboratively manipulate the dom with native dom-features and jQuery. +* [IWC Demo](./IwcDemo/) More IWC example widgets. diff --git a/examples/XmlExample/index.html b/examples/XmlExample/index.html index dad33c2e..4f0695ba 100644 --- a/examples/XmlExample/index.html +++ b/examples/XmlExample/index.html @@ -2,12 +2,18 @@ - PeerJs Json Example + PeerJs Xml Example +

PeerJs + XML Example

@@ -16,9 +22,22 @@ and PeerJs (WebRTC).

Yatta is a Framework for Real-Time collaboration on arbitrary data structures. -You can find the code for this example here. +You can find the code for this example here. + +

Open this link on other clients: Drop me

. Share this link and build a peer-to-peer based network. Changes won't be recorded by any server. + +

Open the console and use DOM and jQuery in order to manipulate the body-element of this website. You can see live changes on other clients.

+ +

Sample code for the console

+ + +$("body").append('<div id="div_tag">some new div tag </div>');
+$("#div_tag").empty();
+$("<p><i>This is inserted after every p tag</i></p>").insertAfter("p");
+$("p i").remove();
+ + -Drop me

diff --git a/examples/XmlExample/index.js b/examples/XmlExample/index.js index fb47336a..5a0cc700 100644 --- a/examples/XmlExample/index.js +++ b/examples/XmlExample/index.js @@ -54,12 +54,5 @@ Y.createPeerJsConnector({key: 'h7nlefbgavh1tt9'}, function(Connector, user_id){ yatta.val($("#collaborative")[0]) console.log(yatta.getUserId()); - $("#collaborative").attr("contenteditable","true"); - $("#collaborative")[0].onkeyup = function(){ - console.log("dtrn"); - console.log("rtdn"); - } - $("p")[0].onfocus = function(){ - console.log("nrtduiaenrtduiaer"); - } + });