Merge pull request #15 from Zemistr/master

Fix and update :)
DavidPhilip · Oct 6, 2014 · f327031 · f327031
2 parents 4138ba9 + 6f6718d
commit f327031
Show file tree

Hide file tree

Showing 4 changed files with 24 additions and 43 deletions.
diff --git a/README.md b/README.md
@@ -161,6 +161,10 @@ These advanced config options are also available:
 
 ## Change Log
 
+### 6th October 2014
+
+* [zemistr] Added support for adding classes via input data. (```[{"id": 1, "content": "First item", "classes": ["dd-nochildren", "dd-nodrag", ...] }, ... ]```)
+
 ### 3th October 2014
 
 * [zemistr] Added support for additional data parameters.

diff --git a/bower.json b/bower.json
@@ -1,6 +1,6 @@
 {
   "name": "nestable2",
-  "version": "1.0.0",
+  "version": "1.1.0",
   "homepage": "https://github.com/RamonSmit/Nestable",
   "authors": [
     "Ramon Smit <@_RamonSmit>",

diff --git a/index.html b/index.html
@@ -369,46 +369,7 @@ <h1>Nestable</h1>
 
 <div class="cf nestable-lists">
 
-    <div class="dd" id="nestable">
-        <ol class="dd-list">
-            <li class="dd-item" data-id="2">
-                <ol class="dd-list">
-                    <li class="dd-item" data-id="3">
-                        <div class="dd-handle">Item 3</div>
-                    </li>
-                    <li class="dd-item" data-id="4">
-                        <div class="dd-handle">Item 4</div>
-                    </li>
-                    <li class="dd-item" data-id="5">
-                        <div class="dd-handle">Item 5</div>
-                        <ol class="dd-list">
-                            <li class="dd-item" data-id="6">
-                                <div class="dd-handle">Item 6</div>
-                            </li>
-                            <li class="dd-item" data-id="7">
-                                <div class="dd-handle">Item 7</div>
-                            </li>
-                            <li class="dd-item" data-id="8">
-                                <div class="dd-handle">Item 8</div>
-                            </li>
-                        </ol>
-                    </li>
-                    <li class="dd-item" data-id="9">
-                        <div class="dd-handle">Item 9</div>
-                    </li>
-                    <li class="dd-item" data-id="10">
-                        <div class="dd-handle">Item 10</div>
-                    </li>
-                </ol>
-            </li>
-            <li class="dd-item" data-id="11">
-                <div class="dd-handle">Item 11</div>
-            </li>
-            <li class="dd-item" data-id="12">
-                <div class="dd-handle">Item 12</div>
-            </li>
-        </ol>
-    </div>
+    <div class="dd" id="nestable"></div>
 
     <div class="dd" id="nestable2">
         <ol class="dd-list">
@@ -505,7 +466,8 @@ <h1>Nestable</h1>
         var json = [
             {
                 "id": 1,
-                "content": "First item"
+                "content": "First item",
+                "classes": ["dd-nochildren"]
             },
             {
                 "id": 2,

diff --git a/jquery.nestable.js b/jquery.nestable.js
@@ -183,11 +183,26 @@
             function buildItem(item, options) {
                 var children = item.children;
                 var content = options.contentCallback(item);
+                var item_classes = {};
+                var classes = item.classes || {};
 
                 delete item.children;
+                delete item.classes;
                 delete item.content;
 
-                var html = "<" + options.itemNodeName + " class='" + options.itemClass + "'";
+                for(var k in classes) {
+                    // Remove duplicates
+                    item_classes[classes[k]] = classes[k];
+                }
+
+                item_classes[options.itemClass] = options.itemClass;
+
+                // create class string
+                var classes_string = $.map(item_classes, function(val) {
+                    return val;
+                }).join(' ');
+
+                var html = "<" + options.itemNodeName + " class='" + classes_string + "'";
 
                 $.each(item, function(key, value) {
                     if(typeof value == 'object') {