Moving sourceEditor module to its own directory with its own styles

[fnpeditor.git] / modules / rng / rng.js

diff --git a/modules/rng/rng.js b/modules/rng/rng.js
index e1277e5..0322ca2 100644 (file)
--- a/modules/rng/rng.js
+++ b/modules/rng/rng.js
@@ -4,28 +4,40 @@ define([
 'views/tabs/tabs',\r
 'libs/text!./mainLayout.html',\r
 'libs/text!./editingLayout.html',\r
 'views/tabs/tabs',\r
 'libs/text!./mainLayout.html',\r
 'libs/text!./editingLayout.html',\r

-], function(layout, vbox, tabs, mainLayoutTemplate, editingLayoutTemplate) {\r
+], function(layout, vbox, tabs, mainLayoutTemplate, visualEditingLayoutTemplate) {\r

 \r
 return function(sandbox) {\r
     'use strict';\r
     \r
 \r
 return function(sandbox) {\r
     'use strict';\r
     \r

-    var mainTabs = (new tabs.View()).render();\r
-    var mainLayout = new layout.Layout(mainLayoutTemplate);\r
-    var editingLayout = new layout.Layout(editingLayoutTemplate);\r
-    \r
-    sandbox.getDOM().append(mainLayout.getAsView());\r
+    function addMainTab(title, slug, view) {\r
+        views.mainTabs.addTab(title, slug, view);\r
+    }\r

     \r
     \r

-    function addTab(title, slug, view) {\r
-        mainTabs.addTab(title, slug, view);\r
+    var views = {\r
+        mainLayout: new layout.Layout(mainLayoutTemplate),\r
+        mainTabs: (new tabs.View()).render(),\r
+        visualEditing: new layout.Layout(visualEditingLayoutTemplate),\r
+        visualEditingSidebar: (new tabs.View({stacked: true})).render(),\r
+        currentNodePaneLayout: new vbox.VBox()\r

     }\r
     \r
     }\r
     \r

+    views.visualEditing.setView('rightColumn', views.visualEditingSidebar.getAsView());\r
+    addMainTab('rng2 test', 'rng2test', views.visualEditing.getAsView());\r
+    \r
+    sandbox.getDOM().append(views.mainLayout.getAsView());\r
+    \r
+    views.visualEditingSidebar.addTab({icon: 'pencil'}, 'edit', views.currentNodePaneLayout.getAsView());\r
+    \r
+    \r
+\r
+    \r

     /* Events handling */\r
     \r
     var eventHandlers = {};\r
      \r
     eventHandlers.sourceEditor = {\r
         ready: function() {\r
     /* Events handling */\r
     \r
     var eventHandlers = {};\r
      \r
     eventHandlers.sourceEditor = {\r
         ready: function() {\r

-            addTab(gettext('Source'), 'source',  sandbox.getModule('sourceEditor').getView());\r
+            addMainTab(gettext('Source'), 'source',  sandbox.getModule('sourceEditor').getView());\r

             sandbox.getModule('sourceEditor').setDocument(sandbox.getModule('data').getDocument());\r
         }\r
     };\r
             sandbox.getModule('sourceEditor').setDocument(sandbox.getModule('data').getDocument());\r
         }\r
     };\r


@@ -33,16 +45,16 @@ return function(sandbox) {
     eventHandlers.visualEditor = {\r
         ready: function() {\r
             sandbox.getModule('visualEditor').setDocument(sandbox.getModule('data').getDocument());\r
     eventHandlers.visualEditor = {\r
         ready: function() {\r
             sandbox.getModule('visualEditor').setDocument(sandbox.getModule('data').getDocument());\r

-            addTab(gettext('Visual'), 'visual', sandbox.getModule('visualEditor').getView());\r
+            addMainTab(gettext('Visual'), 'visual', sandbox.getModule('visualEditor').getView());\r

             \r
         }\r
     };\r
     \r
     eventHandlers.data = {\r
         ready: function() {\r
             \r
         }\r
     };\r
     \r
     eventHandlers.data = {\r
         ready: function() {\r

-            mainLayout.setView('mainView', mainTabs.getAsView());\r
+            views.mainLayout.setView('mainView', views.mainTabs.getAsView());\r

             \r
             \r

-            _.each(['visualEditor', 'sourceEditor', 'documentCanvas', 'nodePane', 'metadataEditor', 'nodeFamilyTree', 'mainBar', 'indicator'], function(moduleName) {\r
+            _.each(['visualEditor', 'sourceEditor', 'documentCanvas', 'documentToolbar', 'nodePane', 'metadataEditor', 'nodeFamilyTree', 'nodeBreadCrumbs', 'mainBar', 'indicator'], function(moduleName) {\r

                 sandbox.getModule(moduleName).start();\r
             });\r
         },\r
                 sandbox.getModule(moduleName).start();\r
             });\r
         },\r


@@ -62,14 +74,14 @@ return function(sandbox) {
     \r
     eventHandlers.rng2 = {\r
         ready: function() {\r
     \r
     eventHandlers.rng2 = {\r
         ready: function() {\r

-           addTab('rng2 test', 'rng2test', sandbox.getModule('rng2').getView());\r
+           addMainTab('rng2 test', 'rng2test', sandbox.getModule('rng2').getView());\r

            \r
         }\r
     }\r
     \r
     eventHandlers.mainBar = {\r
         ready: function() {\r
            \r
         }\r
     }\r
     \r
     eventHandlers.mainBar = {\r
         ready: function() {\r

-            mainLayout.setView('topPanel', sandbox.getModule('mainBar').getView());\r
+            views.mainLayout.setView('topPanel', sandbox.getModule('mainBar').getView());\r

         },\r
         'cmd.save': function() {\r
             sandbox.getModule('data').fakeSave();\r
         },\r
         'cmd.save': function() {\r
             sandbox.getModule('data').fakeSave();\r


@@ -78,25 +90,22 @@ return function(sandbox) {
     \r
     eventHandlers.indicator = {\r
         ready: function() {\r
     \r
     eventHandlers.indicator = {\r
         ready: function() {\r

-            mainLayout.setView('messages', sandbox.getModule('indicator').getView());\r
+            views.mainLayout.setView('messages', sandbox.getModule('indicator').getView());\r

         }\r
     };\r
     \r
         }\r
     };\r
     \r

-    \r
-    var sidebar = (new tabs.View({stacked: true})).render();\r
-    var box = new vbox.VBox();\r
-    editingLayout.setView('rightColumn', sidebar.getAsView());\r
-    addTab('rng2 test', 'rng2test', editingLayout.getAsView());\r
+\r

     \r
     eventHandlers.documentCanvas = {\r
         ready: function() {\r
             sandbox.getModule('documentCanvas').setDocument(sandbox.getModule('data').getDocument());\r
     \r
     eventHandlers.documentCanvas = {\r
         ready: function() {\r
             sandbox.getModule('documentCanvas').setDocument(sandbox.getModule('data').getDocument());\r

-            editingLayout.setView('leftColumn', sandbox.getModule('documentCanvas').getView());\r
+            views.visualEditing.setView('leftColumn', sandbox.getModule('documentCanvas').getView());\r

         },\r
         \r
         nodeSelected: function(node) {\r
             sandbox.getModule('nodePane').setNode(node);\r
             sandbox.getModule('nodeFamilyTree').setNode(node);\r
         },\r
         \r
         nodeSelected: function(node) {\r
             sandbox.getModule('nodePane').setNode(node);\r
             sandbox.getModule('nodeFamilyTree').setNode(node);\r

+            sandbox.getModule('nodeBreadCrumbs').setNode(node);\r

         },\r
         \r
         contentChanged: function() {\r
         },\r
         \r
         contentChanged: function() {\r


@@ -104,19 +113,22 @@ return function(sandbox) {
         },\r
         \r
         nodeHovered: function(node) {\r
         },\r
         \r
         nodeHovered: function(node) {\r

+            sandbox.getModule('documentCanvas').highlightNode(node.attr('id'));\r
+            sandbox.getModule('nodeFamilyTree').highlightNode(node.attr('id'));\r
+            sandbox.getModule('nodeBreadCrumbs').highlightNode(node.attr('id'));\r

             \r
         },\r
         \r
         nodeBlured: function(node) {\r
             \r
         },\r
         \r
         nodeBlured: function(node) {\r

-        \r
+            sandbox.getModule('documentCanvas').dimNode(node.attr('id'));\r
+            sandbox.getModule('nodeFamilyTree').dimNode(node.attr('id'));\r
+            sandbox.getModule('nodeBreadCrumbs').dimNode(node.attr('id'));\r

         }\r
     };\r
 \r
     eventHandlers.nodePane = {\r
         ready: function() {\r
         }\r
     };\r
 \r
     eventHandlers.nodePane = {\r
         ready: function() {\r

-            //sidebar.addTab({icon: 'pencil'}, 'nodePane', sandbox.getModule('nodePane').getView());\r
-            box.appendView(sandbox.getModule('nodePane').getView());\r
-            sidebar.addTab({icon: 'pencil'}, 'edit', box.getAsView());\r
+            views.currentNodePaneLayout.appendView(sandbox.getModule('nodePane').getView());\r

         },\r
         \r
         nodeChanged: function(attr, value) {\r
         },\r
         \r
         nodeChanged: function(attr, value) {\r


@@ -127,14 +139,13 @@ return function(sandbox) {
     eventHandlers.metadataEditor = {\r
         ready: function() {\r
             sandbox.getModule('metadataEditor').setMetadata(sandbox.getModule('data').getDocument());\r
     eventHandlers.metadataEditor = {\r
         ready: function() {\r
             sandbox.getModule('metadataEditor').setMetadata(sandbox.getModule('data').getDocument());\r

-            sidebar.addTab({icon: 'info-sign'}, 'metadataEditor', sandbox.getModule('metadataEditor').getView());\r
+            views.visualEditingSidebar.addTab({icon: 'info-sign'}, 'metadataEditor', sandbox.getModule('metadataEditor').getView());\r

         }\r
     };\r
     \r
     eventHandlers.nodeFamilyTree = {\r
         ready: function() {\r
         }\r
     };\r
     \r
     eventHandlers.nodeFamilyTree = {\r
         ready: function() {\r

-            //sidebar.addTab({icon: 'home'}, 'family', sandbox.getModule('nodeFamilyTree').getView());\r
-            box.appendView(sandbox.getModule('nodeFamilyTree').getView());\r
+            views.currentNodePaneLayout.appendView(sandbox.getModule('nodeFamilyTree').getView());\r

         },\r
         nodeEntered: function(id) {\r
             sandbox.getModule('documentCanvas').highlightNode(id);\r
         },\r
         nodeEntered: function(id) {\r
             sandbox.getModule('documentCanvas').highlightNode(id);\r


@@ -145,6 +156,37 @@ return function(sandbox) {
         nodeSelected: function(id) {\r
             sandbox.getModule('documentCanvas').selectNode(id);\r
         }\r
         nodeSelected: function(id) {\r
             sandbox.getModule('documentCanvas').selectNode(id);\r
         }\r

+    };\r
+    \r
+    eventHandlers.documentToolbar = {\r
+        ready: function() {\r
+            views.visualEditing.setView('toolbar', sandbox.getModule('documentToolbar').getView());\r
+        },\r
+        toggleGrid: function(toggle) {\r
+            sandbox.getModule('documentCanvas').toggleGrid(toggle);\r
+        },\r
+        newNodeRequested: function(wlxmlTag, wlxmlClass) {\r
+            if(window.getSelection().isCollapsed) {\r
+                sandbox.getModule('documentCanvas').insertNewNode(wlxmlTag, wlxmlClass);\r
+            } else {\r
+                sandbox.getModule('documentCanvas').wrapSelectionWithNewNode(wlxmlTag, wlxmlClass);\r
+            }\r
+        }\r
+    };\r
+    \r
+    eventHandlers.nodeBreadCrumbs = {\r
+        ready: function() {\r
+            views.visualEditing.setView('statusBar', sandbox.getModule('nodeBreadCrumbs').getView());\r
+        },\r
+        nodeHighlighted: function(id) {\r
+            sandbox.getModule('documentCanvas').highlightNode(id);\r
+        },\r
+        nodeDimmed: function(id) {\r
+            sandbox.getModule('documentCanvas').dimNode(id);\r
+        },\r
+        nodeSelected: function(id) {\r
+            sandbox.getModule('documentCanvas').selectNode(id);\r
+        }        \r

     }\r
     \r
     /* api */\r
     }\r
     \r
     /* api */\r