tree.js

当前比较流行的,漂亮的JS框架,这里面用到的API文档

Ext.tree.TreeFilter=function(A,B){this.tree=A;this.filtered={};Ext.apply(this,B)};Ext.tree.TreeFilter.prototype={clearBlank:false,reverse:false,autoClear:false,remove:false,filter:function(D,A,B){A=A||"text";var C;if(typeof D=="string"){var E=D.length;if(E==0&&this.clearBlank){this.clear();return }D=D.toLowerCase();C=function(F){return F.attributes[A].substr(0,E).toLowerCase()==D}}else{if(D.exec){C=function(F){return D.test(F.attributes[A])}}else{throw"Illegal filter type, must be string or regex"}}this.filterBy(C,null,B)},filterBy:function(D,C,B){B=B||this.tree.root;if(this.autoClear){this.clear()}var A=this.filtered,H=this.reverse;var E=function(J){if(J==B){return true}if(A[J.id]){return false}var I=D.call(C||J,J);if(!I||H){A[J.id]=J;J.ui.hide();return false}return true};B.cascade(E);if(this.remove){for(var G in A){if(typeof G!="function"){var F=A[G];if(F&&F.parentNode){F.parentNode.removeChild(F)}}}}},clear:function(){var B=this.tree;var A=this.filtered;for(var D in A){if(typeof D!="function"){var C=A[D];if(C){C.ui.show()}}}this.filtered={}}};
Ext.tree.TreeSorter=function(B,C){Ext.apply(this,C);B.on("beforechildrenrendered",this.doSort,this);B.on("append",this.updateSort,this);B.on("insert",this.updateSort,this);B.on("textchange",this.updateSortParent,this);var E=this.dir&&this.dir.toLowerCase()=="desc";var F=this.property||"text";var G=this.sortType;var A=this.folderSort;var D=this.caseSensitive===true;var H=this.leafAttr||"leaf";this.sortFn=function(J,I){if(A){if(J.attributes[H]&&!I.attributes[H]){return 1}if(!J.attributes[H]&&I.attributes[H]){return -1}}var L=G?G(J):(D?J.attributes[F]:J.attributes[F].toUpperCase());var K=G?G(I):(D?I.attributes[F]:I.attributes[F].toUpperCase());if(L<K){return E?+1:-1}else{if(L>K){return E?-1:+1}else{return 0}}}};Ext.tree.TreeSorter.prototype={doSort:function(A){A.sort(this.sortFn)},compareNodes:function(B,A){return(B.text.toUpperCase()>A.text.toUpperCase()?1:-1)},updateSort:function(A,B){if(B.childrenRendered){this.doSort.defer(1,this,[B])}},updateSortParent:function(A){var B=A.parentNode;if(B&&B.childrenRendered){this.doSort.defer(1,this,[B])}}};
if(Ext.dd.DropZone){Ext.tree.TreeDropZone=function(A,B){this.allowParentInsert=false;this.allowContainerDrop=false;this.appendOnly=false;Ext.tree.TreeDropZone.superclass.constructor.call(this,A.innerCt,B);this.tree=A;this.dragOverData={};this.lastInsertClass="x-tree-no-status"};Ext.extend(Ext.tree.TreeDropZone,Ext.dd.DropZone,{ddGroup:"TreeDD",expandDelay:1000,expandNode:function(A){if(A.hasChildNodes()&&!A.isExpanded()){A.expand(false,null,this.triggerCacheRefresh.createDelegate(this))}},queueExpand:function(A){this.expandProcId=this.expandNode.defer(this.expandDelay,this,[A])},cancelExpand:function(){if(this.expandProcId){clearTimeout(this.expandProcId);this.expandProcId=false}},isValidDropPoint:function(A,I,G,D,C){if(!A||!C){return false}var E=A.node;var F=C.node;if(!(E&&E.isTarget&&I)){return false}if(I=="append"&&E.allowChildren===false){return false}if((I=="above"||I=="below")&&(E.parentNode&&E.parentNode.allowChildren===false)){return false}if(F&&(E==F||F.contains(E))){return false}var B=this.dragOverData;B.tree=this.tree;B.target=E;B.data=C;B.point=I;B.source=G;B.rawEvent=D;B.dropNode=F;B.cancel=false;var H=this.tree.fireEvent("nodedragover",B);return B.cancel===false&&H!==false},getDropPoint:function(E,D,I){var J=D.node;if(J.isRoot){return J.allowChildren!==false?"append":false}var B=D.ddel;var K=Ext.lib.Dom.getY(B),G=K+B.offsetHeight;var F=Ext.lib.Event.getPageY(E);var H=J.allowChildren===false||J.isLeaf();if(this.appendOnly||J.parentNode.allowChildren===false){return H?false:"append"}var C=false;if(!this.allowParentInsert){C=J.hasChildNodes()&&J.isExpanded()}var A=(G-K)/(H?2:3);if(F>=K&&F<(K+A)){return"above"}else{if(!C&&(H||F>=G-A&&F<=G)){return"below"}else{return"append"}}},onNodeEnter:function(D,A,C,B){this.cancelExpand()},onNodeOver:function(B,G,F,E){var I=this.getDropPoint(F,B,G);var C=B.node;if(!this.expandProcId&&I=="append"&&C.hasChildNodes()&&!B.node.isExpanded()){this.queueExpand(C)}else{if(I!="append"){this.cancelExpand()}}var D=this.dropNotAllowed;if(this.isValidDropPoint(B,I,G,F,E)){if(I){var A=B.ddel;var H;if(I=="above"){D=B.node.isFirst()?"x-tree-drop-ok-above":"x-tree-drop-ok-between";H="x-tree-drag-insert-above"}else{if(I=="below"){D=B.node.isLast()?"x-tree-drop-ok-below":"x-tree-drop-ok-between";H="x-tree-drag-insert-below"}else{D="x-tree-drop-ok-append";H="x-tree-drag-append"}}if(this.lastInsertClass!=H){Ext.fly(A).replaceClass(this.lastInsertClass,H);this.lastInsertClass=H}}}return D},onNodeOut:function(D,A,C,B){this.cancelExpand();this.removeDropIndicators(D)},onNodeDrop:function(C,I,E,D){var H=this.getDropPoint(E,C,I);var F=C.node;F.ui.startDrop();if(!this.isValidDropPoint(C,H,I,E,D)){F.ui.endDrop();return false}var G=D.node||(I.getTreeNode?I.getTreeNode(D,F,H,E):null);var B={tree:this.tree,target:F,data:D,point:H,source:I,rawEvent:E,dropNode:G,cancel:!G,dropStatus:false};var A=this.tree.fireEvent("beforenodedrop",B);if(A===false||B.cancel===true||!B.dropNode){F.ui.endDrop();return B.dropStatus}F=B.target;if(H=="append"&&!F.isExpanded()){F.expand(false,null,function(){this.completeDrop(B)}.createDelegate(this))}else{this.completeDrop(B)}return true},completeDrop:function(G){var D=G.dropNode,E=G.point,C=G.target;if(!Ext.isArray(D)){D=[D]}var F;for(var B=0,A=D.length;B<A;B++){F=D[B];if(E=="above"){C.parentNode.insertBefore(F,C)}else{if(E=="below"){C.parentNode.insertBefore(F,C.nextSibling)}else{C.appendChild(F)}}}F.ui.focus();if(this.tree.hlDrop){F.ui.highlight()}C.ui.endDrop();this.tree.fireEvent("nodedrop",G)},afterNodeMoved:function(A,C,E,D,B){if(this.tree.hlDrop){B.ui.focus();B.ui.highlight()}this.tree.fireEvent("nodedrop",this.tree,D,C,A,E)},getTree:function(){return this.tree},removeDropIndicators:function(B){if(B&&B.ddel){var A=B.ddel;Ext.fly(A).removeClass(["x-tree-drag-insert-above","x-tree-drag-insert-below","x-tree-drag-append"]);this.lastInsertClass="_noclass"}},beforeDragDrop:function(B,A,C){this.cancelExpand();return true},afterRepair:function(A){if(A&&Ext.enableFx){A.node.ui.highlight()}this.hideProxy()}})};
if(Ext.dd.DragZone){Ext.tree.TreeDragZone=function(A,B){Ext.tree.TreeDragZone.superclass.constructor.call(this,A.getTreeEl(),B);this.tree=A};Ext.extend(Ext.tree.TreeDragZone,Ext.dd.DragZone,{ddGroup:"TreeDD",onBeforeDrag:function(A,B){var C=A.node;return C&&C.draggable&&!C.disabled},onInitDrag:function(B){var A=this.dragData;this.tree.getSelectionModel().select(A.node);this.tree.eventModel.disable();this.proxy.update("");A.node.ui.appendDDGhost(this.proxy.ghost.dom);this.tree.fireEvent("startdrag",this.tree,A.node,B)},getRepairXY:function(B,A){return A.node.ui.getDDRepairXY()},onEndDrag:function(A,B){this.tree.eventModel.enable.defer(100,this.tree.eventModel);this.tree.fireEvent("enddrag",this.tree,A.node,B)},onValidDrop:function(A,B,C){this.tree.fireEvent("dragdrop",this.tree,this.dragData.node,A,B);this.hideProxy()},beforeInvalidDrop:function(A,C){var B=this.tree.getSelectionModel();B.clearSelections();B.select(this.dragData.node)}})};
Ext.tree.TreeEditor=function(A,B){B=B||{};var C=B.events?B:new Ext.form.TextField(B);Ext.tree.TreeEditor.superclass.constructor.call(this,C);this.tree=A;if(!A.rendered){A.on("render",this.initEditor,this)}else{this.initEditor(A)}};Ext.extend(Ext.tree.TreeEditor,Ext.Editor,{alignment:"l-l",autoSize:false,hideEl:false,cls:"x-small-editor x-tree-editor",shim:false,shadow:"frame",maxWidth:250,editDelay:350,initEditor:function(A){A.on("beforeclick",this.beforeNodeClick,this);A.on("dblclick",this.onNodeDblClick,this);this.on("complete",this.updateNode,this);this.on("beforestartedit",this.fitToTree,this);this.on("startedit",this.bindScroll,this,{delay:10});this.on("specialkey",this.onSpecialKey,this)},fitToTree:function(B,C){var E=this.tree.getTreeEl().dom,D=C.dom;if(E.scrollLeft>D.offsetLeft){E.scrollLeft=D.offsetLeft}var A=Math.min(this.maxWidth,(E.clientWidth>20?E.clientWidth:E.offsetWidth)-Math.max(0,D.offsetLeft-E.scrollLeft)-5);this.setSize(A,"")},triggerEdit:function(A,B){this.completeEdit();if(A.attributes.editable!==false){this.editNode=A;this.autoEditTimer=this.startEdit.defer(this.editDelay,this,[A.ui.textNode,A.text]);return false}},bindScroll:function(){this.tree.getTreeEl().on("scroll",this.cancelEdit,this)},beforeNodeClick:function(A,B){clearTimeout(this.autoEditTimer);if(this.tree.getSelectionModel().isSelected(A)){B.stopEvent();return this.triggerEdit(A)}},onNodeDblClick:function(A,B){clearTimeout(this.autoEditTimer)},updateNode:function(A,B){this.tree.getTreeEl().un("scroll",this.cancelEdit,this);this.editNode.setText(B)},onHide:function(){Ext.tree.TreeEditor.superclass.onHide.call(this);if(this.editNode){this.editNode.ui.focus.defer(50,this.editNode.ui)}},onSpecialKey:function(C,B){var A=B.getKey();if(A==B.ESC){B.stopEvent();this.cancelEdit()}else{if(A==B.ENTER&&!B.hasModifier()){B.stopEvent();this.completeEdit()}}}});