[WIP] Added file system level collaboration

src/bramble/client/main.js

@@ -285,7 +285,9 @@ define([
                     if (options.hideUntilReady) {
                         _iframe.style.visibility = "visible";
                     }
-
+                    if(options.enableCollaboration) {
+                        self._executeRemoteCommand({commandCategory: "bramble", command: "INITIALIZE_COLLABORATION",args: [{collaborationUrl: options.collaborationUrl}]});
+                    }
                     // Set intial state
                     _state.fullPath = data.fullPath;
                     _state.filename = data.filename;
@@ -304,7 +306,6 @@ define([
                     _state.autoUpdate = data.autoUpdate;
                     _state.openSVGasXML = data.openSVGasXML;
 
-                    setReadyState(Bramble.READY);
                 }
                 // Listen for callbacks from commands we triggered via _executeRemoteCommand
                 else if(data.type === "bramble:remoteCommand:callback") {

src/editor/Collaboration.js

@@ -1,50 +1,52 @@
 define(function (require, exports, module) {
     "use strict";
 
-    var SimpleWebRTC    = require("simplewebrtc");
+    var SimpleWebRTC    = require("simplewebrtc"),
+        StartupState    = require("bramble/StartupState");
 
-    function Collaboration() {
-        var webrtc = new SimpleWebRTC({
+    var _webrtc;
+    var _changing;
+    var _pending;
+    var _room;
+
+    function initialize(options) {
+        if(_webrtc) {
+            console.error("Collaboration already initialized");
+            return;
+        }
+        _webrtc = new SimpleWebRTC({
             // the id/element dom element that will hold "our" videos
             localVideoEl: 'localVideo',
             // the id/element dom element that will hold remote videos
             remoteVideosEl: 'remotesVideos',
             // immediately ask for camera access
             autoRequestMedia: false,
             // TODO : Shift this to config.
-            url: "localhost:8888"
+            url: options.collaborationUrl
         });
-        //To be moved to the bramble API.
-        var query = (new URL(window.location.href)).searchParams;
-        this.room = query.get("collaboration") || Math.random().toString(36).substring(7);
-        console.log(this.room);
-        this.webrtc = webrtc;
-        this.pending = []; // pending clients that need to be initialized.
-        this.changing = false;
-    };
-
-    Collaboration.prototype.init = function(codemirror) {
-        var self = this;
-        this.webrtc.joinRoom(this.room, function() {
-            self.codemirror = codemirror;
-            self.webrtc.sendToAll("new client", {});
-            self.webrtc.on("createdPeer", function(peer) {
-                self.initializeNewClient(peer);
+        _room = options.room;
+        _webrtc.joinRoom(_room, function() {
+            _webrtc.sendToAll("new client", {});
+            _webrtc.on("createdPeer", function(peer) {
+                _initializeNewClient(peer);
             });
 
-            self.webrtc.connection.on('message', function (msg) {
-                self.handleMessage(msg);
+            _webrtc.connection.on('message', function (msg) {
+                _handleMessage(msg);
             });
         });
+        console.log(_room);
+        _pending = []; // pending clients that need to be initialized.
+        _changing = false;
     };
 
-    Collaboration.prototype.handleMessage = function(msg) {
+    function _handleMessage(msg) {
         switch(msg.type) {
             case "new client":
-                this.pending.push(msg.from);
+                _pending.push(msg.from);
                 break;
             case "codemirror-change":
-                this.handleCodemirrorChange(msg.payload);
+                _handleCodemirrorChange(msg.payload);
                 break;
             case "initClient":
                 if(this.changing) {
@@ -57,8 +59,7 @@ define(function (require, exports, module) {
         }
     };
 
-
-    Collaboration.prototype.initializeNewClient = function(peer) {
+    function _initializeNewClient(peer) {
         this.changing = true;
         for(var i = 0; i<this.pending.length; i++) {
             if(this.pending[i] === peer.id) {
@@ -70,12 +71,14 @@ define(function (require, exports, module) {
         this.changing = false;
     };
 
-    Collaboration.prototype.handleCodemirrorChange = function(delta) {
-        if(this.changing) {
+    function _handleCodemirrorChange(params) {
+        if(_changing) {
             return;
         }
-        this.changing = true;
-        var cm = this.codemirror;
+        var delta = params.delta;
+        var relPath = params.path;
+        var fullPath = StartupState.project("root") + relPath;
+        _changing = true;
         var start = cm.indexFromPos(delta.from);
         // apply the delete operation first
         if (delta.removed.length > 0) {
@@ -93,17 +96,22 @@ define(function (require, exports, module) {
         var from = cm.posFromIndex(start);
         var to = from;
         cm.replaceRange(param, from, to);
-        this.changing = false;
+        _changing = false;
     };
 
-    Collaboration.prototype.triggerCodemirrorChange = function(changeList) {
-        if(this.changing) {
+    function triggerCodemirrorChange(changeList, fullPath) {
+        if(_changing) {
             return;
         }
+        var relPath = fullPath.replace(StartupState.project("root"), "");
         for(var i = 0; i<changeList.length; i++) {
-            this.webrtc.sendToAll("codemirror-change",changeList[i]);
+            _webrtc.sendToAll("codemirror-change", {
+                delta: changeList[i],
+                path: relPath
+            });
         }
     };
 
-    exports.Collaboration = Collaboration;
+    exports.initialize = initialize;
+    exports.triggerCodemirrorChange = triggerCodemirrorChange;
 });

src/editor/Editor.js

@@ -77,7 +77,7 @@ define(function (require, exports, module) {
         ValidationUtils    = require("utils/ValidationUtils"),
         ViewUtils          = require("utils/ViewUtils"),
         MainViewManager    = require("view/MainViewManager"),
-        Collaboration      = require("editor/Collaboration").Collaboration,
+        Collaboration      = require("editor/Collaboration"),
         _                  = require("thirdparty/lodash");
 
     /** Editor preferences */
@@ -103,7 +103,6 @@ define(function (require, exports, module) {
 
 
     var cmOptions         = {};
-    var collabInstance    = new Collaboration();
 
     /**
      * Constants
@@ -432,7 +431,6 @@ define(function (require, exports, module) {
         // CodeMirror-focused. Instead, track focus via onFocus and onBlur
         // options and track state with this._focused
         this._focused = false;
-        collabInstance.init(this._codeMirror);
 
         this._installEditorListeners();
 
@@ -931,7 +929,8 @@ define(function (require, exports, module) {
         // whereas the "change" event should be listened to on the document. Also the
         // Editor dispatches a change event before this event is dispatched, because
         // CodeHintManager needs to hook in here when other things are already done.
-        collabInstance.triggerCodemirrorChange(changeList);
+
+        Collaboration.triggerCodemirrorChange(changeList, this.getFile().fullPath);
         this.trigger("editorChange", this, changeList);
     };
 

src/extensions/default/bramble/lib/RemoteCommandHandler.js

@@ -16,6 +16,7 @@ define(function (require, exports, module) {
     var PreferencesManager = brackets.getModule("preferences/PreferencesManager");
     var _                  = brackets.getModule("thirdparty/lodash");
     var ArchiveUtils       = brackets.getModule("filesystem/impls/filer/ArchiveUtils");
+    var Collaboration      = brackets.getModule("editor/Collaboration");
 
     var SVGUtils = require("lib/SVGUtils");
     var MouseManager = require("lib/MouseManager");
@@ -195,6 +196,11 @@ define(function (require, exports, module) {
             skipCallback = true;
             CommandManager.execute("bramble.addCodeSnippet", args[0]).always(callback);
             break;
+        case "INITIALIZE_COLLABORATION":
+            var query = (new URL(window.location.href)).searchParams;
+            var room = query.get("collaboration") || Math.random().toString(36).substring(7);
+            Collaboration.initialize({room: room, collaborationUrl: args[0].collaborationUrl});
+            break;
         default:
             console.log('[Bramble] unknown command:', command);
             skipCallback = true;

src/hosted.js

@@ -95,7 +95,9 @@
     function load(Bramble) {
         Bramble.load("#bramble",{
             url: "index.html",
-            useLocationSearch: true
+            useLocationSearch: true,
+            enableCollaboration: true,
+            collaborationUrl: "localhost:8888"
         });
 
         // Event listeners