changing lists ui wip: toggling first approach

diff --git a/modules/documentCanvas/canvasManager.js b/modules/documentCanvas/canvasManager.js
index 95e1d91..235c97b 100644 (file)
--- a/modules/documentCanvas/canvasManager.js
+++ b/modules/documentCanvas/canvasManager.js
@@ -228,20 +228,37 @@ Manager.prototype.onBackspaceKey = function(e) {
     }
 };
 
     }
 };
 

-Manager.prototype.command = function(command, meta) {
+Manager.prototype.toggleList = function(toggle) {

     var selection  = window.getSelection(),
         node1 = $(selection.anchorNode).parent()[0],
         node2 = $(selection.focusNode).parent()[0],
         element1 = this.canvas.getDocumentElement(node1),
         element2 = this.canvas.getDocumentElement(node2);
     var selection  = window.getSelection(),
         node1 = $(selection.anchorNode).parent()[0],
         node2 = $(selection.focusNode).parent()[0],
         element1 = this.canvas.getDocumentElement(node1),
         element2 = this.canvas.getDocumentElement(node2);

-    if(command === 'createList') {
+    if(toggle) {

         this.canvas.list.create({element1: element1, element2: element2});
         this.canvas.list.create({element1: element1, element2: element2});

-    } else if(command === 'unwrap-node') {
+    } else {
+        if(this.canvas.list.areItemsOfTheSameList({element1: element1, element2: element2})) {
+            this.canvas.list.extractItems({element1: element1, element2: element2, merge: false});
+        } 
+    }
+};
+
+Manager.prototype.command = function(command, meta) {
+    var selection  = window.getSelection(),
+        node1 = $(selection.anchorNode).parent()[0],
+        node2 = $(selection.focusNode).parent()[0],
+        element1 = this.canvas.getDocumentElement(node1),
+        element2 = this.canvas.getDocumentElement(node2);
+    if(command === 'unwrap-node') {

         // this.canvas.nodeUnwrap({node: canvasNode.create(pos.parentNode)});
         // this.sandbox.publish('contentChanged');
         if(this.canvas.list.areItemsOfTheSameList({element1: element1, element2: element2})) {
             this.canvas.list.extractItems({element1: element1, element2: element2});
         }
         // this.canvas.nodeUnwrap({node: canvasNode.create(pos.parentNode)});
         // this.sandbox.publish('contentChanged');
         if(this.canvas.list.areItemsOfTheSameList({element1: element1, element2: element2})) {
             this.canvas.list.extractItems({element1: element1, element2: element2});
         }

+    } else if(command === 'wrap-node') {
+        if(this.canvas.list.areItemsOfTheSameList({element1: element1, element2: element2})) {
+            this.canvas.list.create({element1: element1, element2: element2});
+        }

     }
 
 };
     }
 
 };

diff --git a/modules/documentCanvas/documentCanvas.js b/modules/documentCanvas/documentCanvas.js
index 7500e35..2085155 100644 (file)
--- a/modules/documentCanvas/documentCanvas.js
+++ b/modules/documentCanvas/documentCanvas.js
@@ -59,6 +59,9 @@ return function(sandbox) {
         toggleGrid: function(toggle) {
             manager.toggleGrid(toggle);
         },
         toggleGrid: function(toggle) {
             manager.toggleGrid(toggle);
         },

+        toggleList: function(toggle) {
+            manager.toggleList(toggle);
+        },

         insertNewNode: function(wlxmlTag, wlxmlClass) {
             manager.insertNewNode(wlxmlTag, wlxmlClass);
         },
         insertNewNode: function(wlxmlTag, wlxmlClass) {
             manager.insertNewNode(wlxmlTag, wlxmlClass);
         },

diff --git a/modules/documentToolbar/documentToolbar.js b/modules/documentToolbar/documentToolbar.js
index 2d963d2..0e17fa3 100644 (file)
--- a/modules/documentToolbar/documentToolbar.js
+++ b/modules/documentToolbar/documentToolbar.js
@@ -20,6 +20,8 @@ return function(sandbox) {
                         event = 'toggleGrid';
                     if(btnId === 'tags')
                         event = 'toggleTags';
                         event = 'toggleGrid';
                     if(btnId === 'tags')
                         event = 'toggleTags';

+                    if(btnId === 'list')
+                        event = 'toggleList'

                     sandbox.publish(event, btn.hasClass('active'));
                 }
                 if(btn.attr('data-btn-type') === 'cmd') {
                     sandbox.publish(event, btn.hasClass('active'));
                 }
                 if(btn.attr('data-btn-type') === 'cmd') {

diff --git a/modules/documentToolbar/template.html b/modules/documentToolbar/template.html
index 62f4070..f639c43 100644 (file)
--- a/modules/documentToolbar/template.html
+++ b/modules/documentToolbar/template.html
@@ -20,13 +20,14 @@
     </div>
     <div class="rng-module-documentToolbar-toolbarGroup">
         <button data-btn="unwrap-node" data-btn-type="cmd" class="btn btn-mini"><i class="icon-arrow-up"></i></button>
     </div>
     <div class="rng-module-documentToolbar-toolbarGroup">
         <button data-btn="unwrap-node" data-btn-type="cmd" class="btn btn-mini"><i class="icon-arrow-up"></i></button>

+        <button data-btn="wrap-node" data-btn-type="cmd" class="btn btn-mini"><i class="icon-arrow-down"></i></button>

     </div>    
     <div class="rng-module-documentToolbar-toolbarGroup">
         <button data-btn="grid" data-btn-type="toggle" class="btn btn-mini"><i class="icon-th-large"></i></button>
         <button data-btn="tags" data-btn-type="toggle" class="btn btn-mini"><i class="icon-tag"></i></button>
     </div>
     <div class="rng-module-documentToolbar-toolbarGroup">
     </div>    
     <div class="rng-module-documentToolbar-toolbarGroup">
         <button data-btn="grid" data-btn-type="toggle" class="btn btn-mini"><i class="icon-th-large"></i></button>
         <button data-btn="tags" data-btn-type="toggle" class="btn btn-mini"><i class="icon-tag"></i></button>
     </div>
     <div class="rng-module-documentToolbar-toolbarGroup">

-        <button data-btn="createList" data-btn-type="cmd" data-meta="bullets" class="btn btn-mini"><i class="icon-list"></i></button>
+        <button data-btn="list" data-btn-type="toggle" data-meta="bullets" class="btn btn-mini"><i class="icon-list"></i></button>

         <button data-btn="createList" data-btn-type="cmd" data-meta="enum" class="btn btn-mini"><i class="icon-th-list"></i></button>
     </div>
     <div style="clear: both;"></div>
         <button data-btn="createList" data-btn-type="cmd" data-meta="enum" class="btn btn-mini"><i class="icon-th-list"></i></button>
     </div>
     <div style="clear: both;"></div>

diff --git a/modules/rng/rng.js b/modules/rng/rng.js
index 2078494..42c71ec 100644 (file)
--- a/modules/rng/rng.js
+++ b/modules/rng/rng.js
@@ -259,6 +259,9 @@ return function(sandbox) {
         toggleGrid: function(toggle) {
             sandbox.getModule('documentCanvas').toggleGrid(toggle);
         },
         toggleGrid: function(toggle) {
             sandbox.getModule('documentCanvas').toggleGrid(toggle);
         },

+        toggleList: function(toggle) {
+            sandbox.getModule('documentCanvas').toggleList(toggle);
+        },

         newNodeRequested: function(wlxmlTag, wlxmlClass) {
                 sandbox.getModule('documentCanvas').insertNewNode(wlxmlTag, wlxmlClass);
         },
         newNodeRequested: function(wlxmlTag, wlxmlClass) {
                 sandbox.getModule('documentCanvas').insertNewNode(wlxmlTag, wlxmlClass);
         },