Throwing away skelton module; rng module uses layout instead

This introduces indicator and mainBar modules that takes over
non-layout responsibilities from skelton module

diff --git a/editor.css b/editor.css
index 5c7f403..5944312 100644 (file)
--- a/editor.css
+++ b/editor.css
@@ -11,36 +11,6 @@ body {
     display: none;\r
 }\r
 \r
     display: none;\r
 }\r
 \r

-#rng-skelton {\r
-    position: relative;\r
-}\r
-\r
-#rng-skelton-menu {\r
-    float: right;\r
-}\r
-\r
-#rng-skelton-menu li {\r
-    display: inline;\r
-}\r
-\r
-#rng-skelton-messages {\r
-    position: absolute;\r
-    top: -22px;\r
-    width:100%;\r
-    text-align:center;\r
-}\r
-\r
-#rng-skelton-messages span {\r
-    font-weight: bold;\r
-    background: #f9edbe;\r
-    padding: 2px 5px;\r
-    border: solid 1px #f6e39c;\r
-}\r
-\r
-#rng-skelton-menu ul {\r
-    list-style-type: none;\r
-}\r
-\r

 .rng-visualEditor-nodeHoverTag {\r
     position:absolute;\r
     height:20px;\r
 .rng-visualEditor-nodeHoverTag {\r
     position:absolute;\r
     height:20px;\r

diff --git a/modules.js b/modules.js
index 4c24259..fb30410 100644 (file)
--- a/modules.js
+++ b/modules.js
@@ -6,7 +6,9 @@ define(function(require) {
     return {\r
         data: require('modules/data'),\r
         rng: require('modules/rng'),\r
     return {\r
         data: require('modules/data'),\r
         rng: require('modules/rng'),\r

-        skelton: require('modules/skelton'),\r
+        mainBar: require('modules/mainBar/mainBar'),\r
+        indicator: require('modules/indicator/indicator'),\r
+        \r

         sourceEditor: require('modules/sourceEditor'),\r
         visualEditor: require('modules/visualEditor'),\r
         \r
         sourceEditor: require('modules/sourceEditor'),\r
         visualEditor: require('modules/visualEditor'),\r
         \r

diff --git a/modules.less b/modules.less
index 6982ce8..251c077 100644 (file)
--- a/modules.less
+++ b/modules.less
@@ -1,3 +1,6 @@
+@import 'modules/rng/rng.less';\r

 @import 'modules/rng2/layout.less';\r
 @import 'modules/rng2/layout.less';\r

+@import 'modules/mainBar/mainBar.less';\r
+@import 'modules/indicator/indicator.less';\r

 @import 'modules/nodePane/nodePane.less';\r
 @import 'modules/metadataEditor/metadataEditor.less';
\ No newline at end of file
 @import 'modules/nodePane/nodePane.less';\r
 @import 'modules/metadataEditor/metadataEditor.less';
\ No newline at end of file

diff --git a/modules/data.js b/modules/data.js
index 527b928..0fab1a7 100644 (file)
--- a/modules/data.js
+++ b/modules/data.js
@@ -60,6 +60,12 @@ return function(sandbox) {
                 success: function() {sandbox.publish('savingEnded', 'success');},\r
                 error: function() {sandbox.publish('savingEnded', 'error');}\r
             });\r
                 success: function() {sandbox.publish('savingEnded', 'success');},\r
                 error: function() {sandbox.publish('savingEnded', 'error');}\r
             });\r

+        },\r
+        fakeSave: function() {\r
+            sandbox.publish('savingStarted');\r
+            window.setTimeout(function() {\r
+                sandbox.publish('savingEnded', 'success')\r
+            }, 2000);\r

         }\r
         \r
     }\r
         }\r
         \r
     }\r

diff --git a/modules/indicator/indicator.js b/modules/indicator/indicator.js
new file mode 100644 (file)
index 0000000..0e9bcdc
--- /dev/null
+++ b/modules/indicator/indicator.js
@@ -0,0 +1,32 @@
+define([\r
+'libs/jquery-1.9.1.min',\r
+'libs/underscore-min',\r
+'libs/text!./template.html'\r
+], function($, _, template) {\r
+\r
+'use strict';\r
+\r
+return function(sandbox) {\r
+\r
+    var view = {\r
+        dom: $(_.template(template)()),\r
+        setup: function() {\r
+        \r
+        }\r
+    }\r
+\r
+    return {\r
+        start: function() { sandbox.publish('ready'); },\r
+        getView: function() { return view.dom; },\r
+        showMessage: function(msg) {\r
+            view.dom.html('<span>' + msg + '</span>').show();\r
+        },\r
+        clearMessage: function() {\r
+            view.dom.empty();\r
+        }\r
+        \r
+    }\r
+\r
+}\r
+\r
+});\r

diff --git a/modules/indicator/indicator.less b/modules/indicator/indicator.less
new file mode 100644 (file)
index 0000000..128e775
--- /dev/null
+++ b/modules/indicator/indicator.less
@@ -0,0 +1,9 @@
+.rng-module-indicator {\r
+     span {\r
+        font-weight: bold;\r
+        background: #f9edbe;\r
+        padding: 2px 5px;\r
+        border: solid 1px #f6e39c;\r
+        font-size:12px;\r
+    }\r
+}
\ No newline at end of file

diff --git a/modules/indicator/template.html b/modules/indicator/template.html
new file mode 100644 (file)
index 0000000..48933d9
--- /dev/null
+++ b/modules/indicator/template.html
@@ -0,0 +1,3 @@
+<div class="rng-module-indicator">\r
+\r
+</div>
\ No newline at end of file

diff --git a/modules/mainBar/mainBar.js b/modules/mainBar/mainBar.js
new file mode 100644 (file)
index 0000000..75fd599
--- /dev/null
+++ b/modules/mainBar/mainBar.js
@@ -0,0 +1,26 @@
+define([\r
+'libs/jquery-1.9.1.min',\r
+'libs/underscore-min',\r
+'libs/text!./template.html'], function($, _, template) {\r
+\r
+'use strict';\r
+\r
+return function(sandbox) {\r
+\r
+    var view = $(_.template(template)());\r
+    view.find('button').click(function(e) {\r
+        e.preventDefault();\r
+        sandbox.publish('cmd.' + $(e.target).attr('data-cmd'));\r
+    })\r
+\r
+    return {\r
+        start: function() { sandbox.publish('ready'); },\r
+        getView: function() {return view;},\r
+        setCommandEnabled: function(cmd, enabled) {\r
+            view.find('[data-cmd='+cmd+']').toggleClass('disabled', !enabled);\r
+        }\r
+    }\r
+\r
+};\r
+\r
+});
\ No newline at end of file

diff --git a/modules/mainBar/mainBar.less b/modules/mainBar/mainBar.less
new file mode 100644 (file)
index 0000000..12bdd35
--- /dev/null
+++ b/modules/mainBar/mainBar.less
@@ -0,0 +1,13 @@
+/*#rng-skelton-menu {\r
+    float: right;\r
+}*/\r
+\r
+.rng-module-mainBar {\r
+    li {\r
+        display: inline;\r
+    }\r
+\r
+    ul {\r
+        list-style-type: none;\r
+    }\r
+}
\ No newline at end of file

diff --git a/modules/mainBar/template.html b/modules/mainBar/template.html
new file mode 100644 (file)
index 0000000..0696053
--- /dev/null
+++ b/modules/mainBar/template.html
@@ -0,0 +1,6 @@
+<div class="rng-module-mainBar">\r
+    <ul>\r
+        <li><button class="btn btn-mini btn-info" data-cmd="save">Zapisz</button></li>\r
+        <li><a class="btn btn-mini btn-danger" href="/">Wyjdź</a></li>\r
+    </ul>\r
+</div>
\ No newline at end of file

diff --git a/modules/rng.js b/modules/rng.js
index 623d4ff..f87aa17 100644 (file)
--- a/modules/rng.js
+++ b/modules/rng.js
@@ -1,9 +1,15 @@
-define(['views/tabs/tabs'], function(tabs) {\r
+define([\r
+'fnpjs/layout',\r
+'views/tabs/tabs',\r
+'libs/text!./rng/mainLayout.html'\r
+], function(layout, tabs, mainLayoutTemplate) {\r

 \r
 return function(sandbox) {\r
     'use strict';\r
     \r
     var mainTabs = (new tabs.View()).render();\r
 \r
 return function(sandbox) {\r
     'use strict';\r
     \r
     var mainTabs = (new tabs.View()).render();\r

+    var mainLayout = new layout.Layout(mainLayoutTemplate);\r
+    sandbox.getDOM().append(mainLayout.getAsView());\r

     \r
     function addTab(title, slug, view) {\r
         mainTabs.addTab(title, slug, view);\r
     \r
     function addTab(title, slug, view) {\r
         mainTabs.addTab(title, slug, view);\r


@@ -12,19 +18,6 @@ return function(sandbox) {
     /* Events handling */\r
     \r
     var eventHandlers = {};\r
     /* Events handling */\r
     \r
     var eventHandlers = {};\r

-    \r
-    eventHandlers.skelton = {\r
-        ready: function() {\r
-            sandbox.getModule('skelton').setMainView(mainTabs.getAsView());\r
-            \r
-            _.each(['visualEditor', 'sourceEditor', 'rng2'], function(moduleName) {\r
-                sandbox.getModule(moduleName).start();\r
-            });\r
-        },\r
-        'cmd.save': function() {\r
-            //todo\r
-        }\r
-    };\r

      \r
     eventHandlers.sourceEditor = {\r
         ready: function() {\r
      \r
     eventHandlers.sourceEditor = {\r
         ready: function() {\r


@@ -43,19 +36,23 @@ return function(sandbox) {
     \r
     eventHandlers.data = {\r
         ready: function() {\r
     \r
     eventHandlers.data = {\r
         ready: function() {\r

-            sandbox.getModule('skelton').start();\r
+            mainLayout.setView('mainView', mainTabs.getAsView());\r
+            \r
+            _.each(['visualEditor', 'sourceEditor', 'rng2', 'mainBar', 'indicator'], function(moduleName) {\r
+                sandbox.getModule(moduleName).start();\r
+            });\r

         },\r
         documentChanged: function(document, reason) {\r
             var slug = (reason === 'visual_edit' ? 'source' : 'visual');\r
             sandbox.getModule(slug+'Editor').setDocument(document);\r
         },\r
         savingStarted: function() {\r
         },\r
         documentChanged: function(document, reason) {\r
             var slug = (reason === 'visual_edit' ? 'source' : 'visual');\r
             sandbox.getModule(slug+'Editor').setDocument(document);\r
         },\r
         savingStarted: function() {\r

-            sandbox.getModule('skelton').deactivateCommand('save');\r
-            sandbox.getModule('skelton').showMessage(gettext('Saving...'));\r
+            sandbox.getModule('mainBar').setCommandEnabled('save', false);\r
+            sandbox.getModule('indicator').showMessage(gettext('Saving...'));\r

         },\r
         savingEnded: function(status) {\r
         },\r
         savingEnded: function(status) {\r

-            sandbox.getModule('skelton').activateCommand('save');\r
-            sandbox.getModule('skelton').clearMessage();\r
+            sandbox.getModule('mainBar').setCommandEnabled('save', true);\r
+            sandbox.getModule('indicator').clearMessage();\r

         }\r
     }\r
     \r
         }\r
     }\r
     \r


@@ -66,6 +63,21 @@ return function(sandbox) {
         }\r
     }\r
     \r
         }\r
     }\r
     \r

+    eventHandlers.mainBar = {\r
+        ready: function() {\r
+            mainLayout.setView('topPanel', sandbox.getModule('mainBar').getView());\r
+        },\r
+        'cmd.save': function() {\r
+            sandbox.getModule('data').fakeSave();\r
+        }\r
+    }\r
+    \r
+    eventHandlers.indicator = {\r
+        ready: function() {\r
+            mainLayout.setView('messages', sandbox.getModule('indicator').getView());\r
+        }\r
+    }\r
+    \r

     /* api */\r
     \r
     return {\r
     /* api */\r
     \r
     return {\r

diff --git a/modules/rng/mainLayout.html b/modules/rng/mainLayout.html
new file mode 100644 (file)
index 0000000..160fa13
--- /dev/null
+++ b/modules/rng/mainLayout.html
@@ -0,0 +1,8 @@
+<div id="rng-module-rng-mainLayout">\r
+    <div fnpjs-place="messages"></div>\r
+    <div fnpjs-place="topPanel">\r
+    </div>\r
+    <div style="clear:both"></div>\r
+    <div fnpjs-place="mainView">\r
+    </div>\r
+</div>
\ No newline at end of file

diff --git a/modules/rng/mainLayout.less b/modules/rng/mainLayout.less
new file mode 100644 (file)
index 0000000..08db00d
--- /dev/null
+++ b/modules/rng/mainLayout.less
@@ -0,0 +1,14 @@
+#rng-module-rng-mainLayout {\r
+    position: relative;\r
+    \r
+    [fnpjs-place="messages"] {\r
+        position: absolute;\r
+        top: 5px;\r
+        width:100%;\r
+        text-align:center;\r
+    }\r
+    \r
+    [fnpjs-place="topPanel"] {\r
+        float: right;\r
+    }\r
+}
\ No newline at end of file

diff --git a/modules/rng/rng.less b/modules/rng/rng.less
new file mode 100644 (file)
index 0000000..6641668
--- /dev/null
+++ b/modules/rng/rng.less
@@ -0,0 +1 @@
+@import 'mainLayout.less';
\ No newline at end of file

diff --git a/modules/skelton.js b/modules/skelton.js
deleted file mode 100644 (file)
index 28780f2..0000000
--- a/modules/skelton.js
+++ /dev/null
@@ -1,35 +0,0 @@
-define(function() {\r
-\r
-return function(sandbox) {\r
-    \r
-    var view = $(sandbox.getTemplate('main')());\r
-    \r
-    view.find('#rng-skelton-menu button').click(function(e) {\r
-        e.preventDefault();\r
-        sandbox.publish('cmd.' + $(e.target).attr('data-cmd'));\r
-    });\r
-    \r
-    return {\r
-        start: function() {\r
-            sandbox.getDOM().append(view);\r
-            sandbox.publish('ready');\r
-        },\r
-        setMainView: function(mainView) {\r
-            view.find('#rng-skelton-mainView').html(mainView);\r
-        },\r
-        showMessage: function(message) {\r
-            view.find('#rng-skelton-messages').html('<span>'+message+'</span>').show();\r
-        },\r
-        clearMessage: function() {\r
-            view.find('#rng-skelton-messages').empty().hide();\r
-        },\r
-        deactivateCommand: function(cmd) {\r
-            view.find('[data-cmd='+cmd+']').addClass('disabled');\r
-        },\r
-        activateCommand: function(cmd) {\r
-            view.find('[data-cmd='+cmd+']').removeClass('disabled');\r
-        }\r
-    }\r
-};\r
-\r
-});
\ No newline at end of file

diff --git a/rng.js b/rng.js
index 57d5818..3336dde 100644 (file)
--- a/rng.js
+++ b/rng.js
@@ -3,7 +3,7 @@ define({
     initModules: ['rng'],
     permissions: {
         'skelton': ['getDOM'],
     initModules: ['rng'],
     permissions: {
         'skelton': ['getDOM'],

-        'rng': ['getModule', 'handleEvents'],
+        'rng': ['getModule', 'handleEvents', 'getDOM'],

         'rng2': ['getModule', 'handleEvents']
     }
 });
\ No newline at end of file
         'rng2': ['getModule', 'handleEvents']
     }
 });
\ No newline at end of file