Basic communication between source and visual editors; data module

diff --git a/modules/data.js b/modules/data.js
new file mode 100644 (file)
index 0000000..2799499
--- /dev/null
+++ b/modules/data.js
@@ -0,0 +1,19 @@
+rng.modules.data = function(sandbox) {\r
+\r
+    var document = sandbox.getBootstrappedData().document;\r
+\r
+    return {\r
+        start: function() {\r
+            sandbox.publish('ready');\r
+        },\r
+        getDocument: function() {\r
+            return document;\r
+        },\r
+        commitDocument: function(newDocument, reason) {\r
+            document = newDocument;\r
+            sandbox.publish('documentChanged', document, reason);\r
+        }\r
+        \r
+    }\r
+\r
+};
\ No newline at end of file

diff --git a/modules/rng.js b/modules/rng.js
index e6f3c26..baa400d 100644 (file)
--- a/modules/rng.js
+++ b/modules/rng.js
@@ -20,27 +20,48 @@ rng.modules.rng = function(sandbox) {
             _.each(['visualEditor', 'sourceEditor'], function(moduleName) {\r
                 sandbox.getModule(moduleName).start();\r
             });\r
+        },\r
+        leaving: function(slug) {\r
+            if(slug === 'source' || slug === 'visual') {\r
+                var editor = sandbox.getModule(slug+'Editor');\r
+                if(editor.isDirty()) {\r
+                    sandbox.getModule('data').commitDocument(editor.getDocument(), slug + '_edit');\r
+                    editor.setDirty(false);\r
+                }\r
+            }\r
         }\r
     };\r
     \r
     eventHandlers.sourceEditor = {\r
         ready: function() {\r
             addTab('Source', 'source',  sandbox.getModule('sourceEditor').getView());\r
+            sandbox.getModule('sourceEditor').setDocument(sandbox.getModule('data').getDocument());\r
         }\r
     };\r
     \r
     eventHandlers.visualEditor = {\r
         ready: function() {\r
             addTab('Visual', 'visual', sandbox.getModule('visualEditor').getView());\r
+            sandbox.getModule('visualEditor').setDocument(sandbox.getModule('data').getDocument());\r
         }\r
     };\r
     \r
+    eventHandlers.data = {\r
+        ready: function() {\r
+            sandbox.getModule('skelton').start();\r
+        },\r
+        documentChanged: function(document, reason) {\r
+            var slug = (reason === 'visual_edit' ? 'source' : 'visual');\r
+            sandbox.getModule(slug+'Editor').setDocument(document);\r
+        }\r
+    }\r
+    \r
     \r
     /* api */\r
     \r
     return {\r
         start: function() {\r
-            sandbox.getModule('skelton').start();\r
+            sandbox.getModule('data').start();\r
         },\r
         handleEvent: function(moduleName, eventName, args) {\r
             if(eventHandlers[moduleName] && eventHandlers[moduleName][eventName]) {\r

diff --git a/modules/sourceEditor.js b/modules/sourceEditor.js
index ea84ee3..787bfb9 100644 (file)
--- a/modules/sourceEditor.js
+++ b/modules/sourceEditor.js
@@ -1,11 +1,31 @@
 rng.modules.sourceEditor = function(sandbox) {\r
 \r
+    var view = $(sandbox.getTemplate('main')());\r
+    var isDirty = false;\r
+    \r
+    $('textarea', view).on('keyup', function() {\r
+        isDirty = true;\r
+    });\r
+    \r
     return {\r
         start: function() {\r
             sandbox.publish('ready');\r
         },\r
         getView: function() {\r
-            return $('<p>source editor</p>');\r
+            return view;\r
+        },\r
+        setDocument: function(document) {\r
+            $('textarea', view).val(document);\r
+            isDirty = false;\r
+        },\r
+        getDocument: function() {\r
+            return $('textarea', view).val();\r
+        },\r
+        isDirty: function() {\r
+            return isDirty;\r
+        },\r
+        setDirty: function(dirty) {\r
+            isDirty = dirty;\r
         }\r
     \r
     }\r

diff --git a/modules/tabsManager.js b/modules/tabsManager.js
index 1dd857d..56d647d 100644 (file)
--- a/modules/tabsManager.js
+++ b/modules/tabsManager.js
@@ -16,6 +16,8 @@ rng.modules.tabsManager = function(sandbox) {
         \r
         if(prevSlug == slug)\r
             return;\r
+        if(prevSlug)\r
+            sandbox.publish('leaving', prevSlug);\r
         \r
         tabBar.find('li').removeClass('active');\r
         tabBar.find('a[href=#' + slug + ']').parent().addClass('active');\r
@@ -26,7 +28,6 @@ rng.modules.tabsManager = function(sandbox) {
     }\r
        \r
     \r
-    \r
     view.on('click', 'li a', function(e) {\r
         selectTab($(e.target).attr('href').substr(1));\r
     });\r

diff --git a/modules/visualEditor.js b/modules/visualEditor.js
index 5e503bb..b22aa7d 100644 (file)
--- a/modules/visualEditor.js
+++ b/modules/visualEditor.js
@@ -1,15 +1,39 @@
 rng.modules.visualEditor = function(sandbox) {\r
 \r
-    var data = sandbox.getBootstrappedData();\r
-    var view = $(sandbox.getTemplate('main')({title: data.title, content: data.text}));\r
+    var view = $(sandbox.getTemplate('main')());\r
+    var isDirty = false;\r
+    \r
+    var document2html = function(document) {\r
+        return document;\r
+    }\r
+    \r
+    var html2document = function() {\r
+        return $('#rng-visualEditor-content').text();\r
+    }\r
+    \r
+    $('#rng-visualEditor-content', view).on('keyup', function() {\r
+        isDirty = true;\r
+    });\r
     \r
-\r
     return {\r
         start: function() {\r
             sandbox.publish('ready');\r
         },\r
         getView: function() {\r
             return view;\r
+        },\r
+        setDocument: function(document) {\r
+            $('#rng-visualEditor-content', view).html(document2html(document));\r
+            isDirty = false;\r
+        },\r
+        getDocument: function() {\r
+            return html2document();\r
+        },\r
+        isDirty: function() {\r
+            return isDirty;\r
+        },\r
+        setDirty: function(dirty) {\r
+            isDirty = dirty;\r
         }\r
     \r
     }\r