diff --git a/README.md b/README.md index b86e091..e735a2f 100644 --- a/README.md +++ b/README.md @@ -82,10 +82,13 @@ These advanced config options are also available: * `emptyClass` The class used for empty list placeholder elements (default `'dd-empty'`) * `expandBtnHTML` The HTML text used to generate a list item expand button (default `''`) * `collapseBtnHTML` The HTML text used to generate a list item collapse button (default `''`) +* `autoCollapseClass` The class applied to list item element which will auto collapse others item when click "expandBtn" (default `'dd-auto-collapsed'`) **Inspect the [Nestable Demo](http://dbushell.github.com/Nestable/) for guidance.** ## Change Log +### 10th October 2015 +* support auto-collapse on itemNode. auto collapse others itemNode. ### 15th October 2012 diff --git a/jquery.nestable.js b/jquery.nestable.js index 7323fb4..f65a9db 100644 --- a/jquery.nestable.js +++ b/jquery.nestable.js @@ -42,7 +42,8 @@ collapseBtnHTML : '', group : 0, maxDepth : 5, - threshold : 20 + threshold : 20, + autoCollapseClass : 'dd-auto-collapse' }; function Plugin(element, options) @@ -202,6 +203,18 @@ li.children('[data-action="expand"]').hide(); li.children('[data-action="collapse"]').show(); li.children(this.options.listNodeName).show(); + + var autoCollapse = li.hasClass(this.options.autoCollapseClass); + if(autoCollapse) { + var neiphbors = li.siblings().not(li).not('.dd-collapsed'); + var listNodeName = this.options.listNodeName; + neiphbors.addClass(this.options.collapsedClass); + neiphbors.each(function(){ + $(this).children('[data-action="collapse"]').hide(); + $(this).children('[data-action="expand"]').show(); + $(this).children(listNodeName).hide(); + }); + } }, collapseItem: function(li) diff --git a/jquery.nestable.min.js b/jquery.nestable.min.js new file mode 100644 index 0000000..773b557 --- /dev/null +++ b/jquery.nestable.min.js @@ -0,0 +1,15 @@ +(function(f,k,h,m){function n(a,d){this.w=f(h);this.el=f(a);this.options=f.extend({},q,d);this.init()}var r="ontouchstart"in h,p=function(){var a=h.createElement("div"),d=h.documentElement;if(!("pointerEvents"in a.style))return!1;a.style.pointerEvents="auto";a.style.pointerEvents="x";d.appendChild(a);var f=k.getComputedStyle&&"auto"===k.getComputedStyle(a,"").pointerEvents;d.removeChild(a);return!!f}(),q={listNodeName:"ol",itemNodeName:"li",rootClass:"dd",listClass:"dd-list",itemClass:"dd-item",dragClass:"dd-dragel", +handleClass:"dd-handle",collapsedClass:"dd-collapsed",placeClass:"dd-placeholder",noDragClass:"dd-nodrag",emptyClass:"dd-empty",expandBtnHTML:'',collapseBtnHTML:'',group:0,maxDepth:5,threshold:20,autoCollapseClass:"dd-auto-collapse"};n.prototype={init:function(){var a=this;a.reset();a.el.data("nestable-group",this.options.group);a.placeEl=f('
'); +f.each(this.el.find(a.options.itemNodeName),function(c,b){a.setParent(f(b))});a.el.on("click","button",function(c){if(!a.dragEl){var b=f(c.currentTarget);c=b.data("action");b=b.parent(a.options.itemNodeName);"collapse"===c&&a.collapseItem(b);"expand"===c&&a.expandItem(b)}});var d=function(c){var b=f(c.target);if(!b.hasClass(a.options.handleClass)){if(b.closest("."+a.options.noDragClass).length)return;b=b.closest("."+a.options.handleClass)}b.length&&!a.dragEl&&(a.isTouch=/^touch/.test(c.type),a.isTouch&& +1!==c.touches.length||(c.preventDefault(),a.dragStart(c.touches?c.touches[0]:c)))},g=function(c){a.dragEl&&(c.preventDefault(),a.dragMove(c.touches?c.touches[0]:c))},e=function(c){a.dragEl&&(c.preventDefault(),a.dragStop(c.touches?c.touches[0]:c))};r&&(a.el[0].addEventListener("touchstart",d,!1),k.addEventListener("touchmove",g,!1),k.addEventListener("touchend",e,!1),k.addEventListener("touchcancel",e,!1));a.el.on("mousedown",d);a.w.on("mousemove",g);a.w.on("mouseup",e)},serialize:function(){var a= +this;step=function(d,g){var e=[];d.children(a.options.itemNodeName).each(function(){var c=f(this),b=f.extend({},c.data()),c=c.children(a.options.listNodeName);c.length&&(b.children=step(c,g+1));e.push(b)});return e};return step(a.el.find(a.options.listNodeName).first(),0)},serialise:function(){return this.serialize()},reset:function(){this.mouse={offsetX:0,offsetY:0,startX:0,startY:0,lastX:0,lastY:0,nowX:0,nowY:0,distX:0,distY:0,dirAx:0,dirX:0,dirY:0,lastDirX:0,lastDirY:0,distAxX:0,distAxY:0};this.moving= +this.isTouch=!1;this.dragRootEl=this.dragEl=null;this.dragDepth=0;this.hasNewRoot=!1;this.pointEl=null},expandItem:function(a){a.removeClass(this.options.collapsedClass);a.children('[data-action="expand"]').hide();a.children('[data-action="collapse"]').show();a.children(this.options.listNodeName).show();if(a.hasClass(this.options.autoCollapseClass)){a=a.siblings().not(a).not(".dd-collapsed");var d=this.options.listNodeName;a.addClass(this.options.collapsedClass);a.each(function(){f(this).children('[data-action="collapse"]').hide(); +f(this).children('[data-action="expand"]').show();f(this).children(d).hide()})}},collapseItem:function(a){a.children(this.options.listNodeName).length&&(a.addClass(this.options.collapsedClass),a.children('[data-action="collapse"]').hide(),a.children('[data-action="expand"]').show(),a.children(this.options.listNodeName).hide())},expandAll:function(){var a=this;a.el.find(a.options.itemNodeName).each(function(){a.expandItem(f(this))})},collapseAll:function(){var a=this;a.el.find(a.options.itemNodeName).each(function(){a.collapseItem(f(this))})}, +setParent:function(a){a.children(this.options.listNodeName).length&&(a.prepend(f(this.options.expandBtnHTML)),a.prepend(f(this.options.collapseBtnHTML)));a.children('[data-action="expand"]').hide()},unsetParent:function(a){a.removeClass(this.options.collapsedClass);a.children("[data-action]").remove();a.children(this.options.listNodeName).remove()},dragStart:function(a){var d=this.mouse,g=f(a.target),e=g.closest(this.options.itemNodeName);this.placeEl.css("height",e.height());d.offsetX=a.offsetX!== +m?a.offsetX:a.pageX-g.offset().left;d.offsetY=a.offsetY!==m?a.offsetY:a.pageY-g.offset().top;d.startX=d.lastX=a.pageX;d.startY=d.lastY=a.pageY;this.dragRootEl=this.el;this.dragEl=f(h.createElement(this.options.listNodeName)).addClass(this.options.listClass+" "+this.options.dragClass);this.dragEl.css("width",e.width());e.after(this.placeEl);e[0].parentNode.removeChild(e[0]);e.appendTo(this.dragEl);f(h.body).append(this.dragEl);this.dragEl.css({left:a.pageX-d.offsetX,top:a.pageY-d.offsetY});g=this.dragEl.find(this.options.itemNodeName); +for(a=0;a