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;athis.dragDepth&&(this.dragDepth=d)},dragStop:function(a){a=this.dragEl.children(this.options.itemNodeName).first();a[0].parentNode.removeChild(a[0]);this.placeEl.replaceWith(a);this.dragEl.remove();this.el.trigger("change");this.hasNewRoot&&this.dragRootEl.trigger("change");this.reset()},dragMove:function(a){var d,g,e,c=this.options,b=this.mouse;this.dragEl.css({left:a.pageX-b.offsetX,top:a.pageY-b.offsetY});b.lastX=b.nowX; +b.lastY=b.nowY;b.nowX=a.pageX;b.nowY=a.pageY;b.distX=b.nowX-b.lastX;b.distY=b.nowY-b.lastY;b.lastDirX=b.dirX;b.lastDirY=b.dirY;b.dirX=0===b.distX?0:0Math.abs(b.distY)?1:0;if(b.moving){b.dirAx!==e?(b.distAxX=0,b.distAxY=0):(b.distAxX+=Math.abs(b.distX),0!==b.dirX&&b.dirX!==b.lastDirX&&(b.distAxX=0),b.distAxY+=Math.abs(b.distY),0!==b.dirY&&b.dirY!==b.lastDirY&&(b.distAxY=0));b.dirAx=e;b.dirAx&&b.distAxX>=c.threshold&&(b.distAxX=0, +e=this.placeEl.prev(c.itemNodeName),0").addClass(c.listClass),d.append(this.placeEl),e.append(d),this.setParent(e)))),0>b.distX&&(e=this.placeEl.next(c.itemNodeName),e.length||(g=this.placeEl.parent(),this.placeEl.closest(c.itemNodeName).after(this.placeEl), +g.children().length||this.unsetParent(g.parent()))));d=!1;p||(this.dragEl[0].style.visibility="hidden");this.pointEl=f(h.elementFromPoint(a.pageX-h.body.scrollLeft,a.pageY-(k.pageYOffset||h.documentElement.scrollTop)));p||(this.dragEl[0].style.visibility="visible");this.pointEl.hasClass(c.handleClass)&&(this.pointEl=this.pointEl.parent(c.itemNodeName));if(this.pointEl.hasClass(c.emptyClass))d=!0;else if(!this.pointEl.length||!this.pointEl.hasClass(c.itemClass))return;e=this.pointEl.closest("."+c.rootClass); +var l=this.dragRootEl.data("nestable-id")!==e.data("nestable-id");b.dirAx&&!l&&!d||l&&c.group!==e.data("nestable-group")||(g=this.dragDepth-1+this.pointEl.parents(c.listNodeName).length,g>c.maxDepth||(a=a.pageY'),l&&(this.dragRootEl=e,this.hasNewRoot=this.el[0]!==this.dragRootEl[0])))}else b.dirAx=e,b.moving=!0}};f.fn.nestable=function(a){var d=this;this.each(function(){var g=f(this).data("nestable");g?"string"===typeof a&&"function"===typeof g[a]&&(d=g[a]()):(f(this).data("nestable",new n(this,a)),f(this).data("nestable-id",(new Date).getTime()))});return d||this}})(window.jQuery||window.Zepto,window,document);