From: Aleksander Łukasz <aleksander.lukasz@nowoczesnapolska.org.pl>
Date: Thu, 27 Jun 2013 11:45:10 +0000 (+0200)
Subject: Introducing two types of lists: bullet & enum
X-Git-Url: https://git.mdrn.pl/fnpeditor.git/commitdiff_plain/cca351c564d1bc9eabf6aca2bc13d41218443703?ds=sidebyside;hp=756c5554a2b6a23eb95a7e538b4fe45f06b644e5

Introducing two types of lists: bullet & enum
---

diff --git a/modules/documentCanvas/canvas.js b/modules/documentCanvas/canvas.js
index baa2f3c..0585d12 100644
--- a/modules/documentCanvas/canvas.js
+++ b/modules/documentCanvas/canvas.js
@@ -160,7 +160,7 @@ Canvas.prototype.listCreate = function(options) {
             return false;
     });
     
-    var list = canvasNode.create({tag: 'div', klass: 'list-items'}).dom; //this._createNode('div', 'list-items');
+    var list = canvasNode.create({tag: 'div', klass: 'list-items' + (options.type === 'enum' ? '-enum' : '')}).dom; //this._createNode('div', 'list-items');
     element1.before(list);
     
     nodesToWrap.forEach(function(node) {
@@ -190,7 +190,7 @@ Canvas.prototype.getPrecedingNode = function(options) {
 
 Canvas.prototype.nodeInsideList = function(options) {
     if(options.node) {
-        if(options.node.getClass() === 'list-items' || options.node.getClass() === 'item')
+        if(options.node.isOfClass('list-items') || options.node.isOfClass('item'))
             return true;
         var pointerElement = $(this.content.find('#' + options.node.getId()));
         return pointerElement.parents('[wlxml-class=list-items], [wlxml-class=item]').length > 0;
diff --git a/modules/documentCanvas/canvasManager.js b/modules/documentCanvas/canvasManager.js
index 71c9342..7e34e29 100644
--- a/modules/documentCanvas/canvasManager.js
+++ b/modules/documentCanvas/canvasManager.js
@@ -222,7 +222,7 @@ Manager.prototype.command = function(command, meta) {
         }
         else {
             if(!this.canvas.nodeInsideList({node: node})) {
-                this.canvas.listCreate({start: node, end: canvasNode.create(pos.focusNode)});
+                this.canvas.listCreate({start: node, end: canvasNode.create(pos.focusNode), type: meta});
                 this.selectNode(node, {movecaret: 'end'});
                 this.sandbox.publish('contentChanged');
             }
diff --git a/modules/documentCanvas/canvasNode.js b/modules/documentCanvas/canvasNode.js
index 2b108a1..bb1cee7 100644
--- a/modules/documentCanvas/canvasNode.js
+++ b/modules/documentCanvas/canvasNode.js
@@ -73,6 +73,10 @@ CanvasNode.prototype.parents = function() {
 };
 
 
+CanvasNode.prototype.isOfClass = function(klass) {
+    return this.getClass() && this.getClass().substr(0, klass.length) === klass;
+}
+
 return {
     create: function(desc) {
         return new CanvasNode(desc);
diff --git a/modules/documentCanvas/nodes.less b/modules/documentCanvas/nodes.less
index 215d36b..2f51045 100644
--- a/modules/documentCanvas/nodes.less
+++ b/modules/documentCanvas/nodes.less
@@ -67,11 +67,20 @@ span[wlxml-tag] {
 
 [wlxml-class="list-items"] {
 
+    > [wlxml-class="item"] {
+        display: list-item;
+        margin-left: 10px;
+        padding-left: 5px;
+    }
+}
+
+
+[wlxml-class="list-items-enum"] {
+
     counter-reset: myitem;
 
     > [wlxml-class="item"] {
         counter-increment: myitem;
-        display: list-item;
         margin-left: 10px;
         padding-left: 5px;
         
diff --git a/modules/documentCanvas/tests/canvasNode.test.js b/modules/documentCanvas/tests/canvasNode.test.js
index bc11a80..5c55d9c 100644
--- a/modules/documentCanvas/tests/canvasNode.test.js
+++ b/modules/documentCanvas/tests/canvasNode.test.js
@@ -33,6 +33,21 @@ suite('Create canvas node', function() {
     });
 });
 
+suite('class information', function() {
+    test('class of', function() {
+        var node = canvasNode.create({tag: 'header', klass: 'a-b-c'});
+        assert.ok(node.isOfClass('a'), 'first level');
+        assert.ok(node.isOfClass('a-b'), 'second level');
+        assert.ok(node.isOfClass('a-b-c'), 'third level');
+        assert.notOk(node.isOfClass('b-c'));
+        
+        var node2 = canvasNode.create({tag: 'header'});
+        assert.notOk(node2.isOfClass('b'));
+
+    });
+
+});
+
 suite('comparing nodes', function() {
     test('isSame', function() {
         var html = '<div wlxml-class="some-class" wlxml-tag="some-tag">';
diff --git a/modules/documentToolbar/template.html b/modules/documentToolbar/template.html
index 112d93b..f10459f 100644
--- a/modules/documentToolbar/template.html
+++ b/modules/documentToolbar/template.html
@@ -23,7 +23,8 @@
         <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" class="btn btn-mini"><i class="icon-list"></i></button>
+        <button data-btn="createList" data-btn-type="cmd" 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>
 </div>
\ No newline at end of file
diff --git a/modules/nodePane/template.html b/modules/nodePane/template.html
index b87c236..c0733cd 100644
--- a/modules/nodePane/template.html
+++ b/modules/nodePane/template.html
@@ -13,7 +13,7 @@
         <div>
             <label>Klasa</label>
             <select  class="rng-module-nodePane-classSelect">
-                <% var options = ['', 'author', 'title', 'cite', 'cite.code', 'cite.code.xml', 'list', 'list.items', 'item', 'uri', 'p', 'footnote', 'todo', 'emp', 'emph.tech'] %>
+                <% var options = ['', 'author', 'title', 'cite', 'cite.code', 'cite.code.xml', 'list', 'list.items', 'list.items.enum', 'item', 'uri', 'p', 'footnote', 'todo', 'emp', 'emph.tech'] %>
                 <% options.forEach(function(option) { %>
                     <option value="<%= option.replace(/\./g, '-') %>" <% if(option === '') { %>selected<% } %>><%= option %></option>
                 <% }); %>