128 lines
5 KiB
HTML
128 lines
5 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
|
|
<title>The source code</title>
|
|
<link href="../resources/prettify/prettify.css" type="text/css" rel="stylesheet" />
|
|
<script type="text/javascript" src="../resources/prettify/prettify.js"></script>
|
|
<style type="text/css">
|
|
.highlight { display: block; background-color: #ddd; }
|
|
</style>
|
|
<script type="text/javascript">
|
|
function highlight() {
|
|
document.getElementById(location.hash.replace(/#/, "")).className = "highlight";
|
|
}
|
|
</script>
|
|
</head>
|
|
<body onload="prettyPrint(); highlight();">
|
|
<pre class="prettyprint lang-js"><span id='Ext-tree-TreeSorter-method-constructor'><span id='Ext-tree-TreeSorter'>/**
|
|
</span></span> * @class Ext.tree.TreeSorter
|
|
* Provides sorting of nodes in a {@link Ext.tree.TreePanel}. The TreeSorter automatically monitors events on the
|
|
* associated TreePanel that might affect the tree's sort order (beforechildrenrendered, append, insert and textchange).
|
|
* Example usage:<br />
|
|
* <pre><code>
|
|
new Ext.tree.TreeSorter(myTree, {
|
|
folderSort: true,
|
|
dir: "desc",
|
|
sortType: function(value, node) {
|
|
// sort by a custom, typed attribute:
|
|
return parseInt(node.id, 10);
|
|
}
|
|
});
|
|
</code></pre>
|
|
* @constructor
|
|
* @param {TreePanel} tree
|
|
* @param {Object} config
|
|
*/
|
|
Ext.tree.TreeSorter = Ext.extend(Object, {
|
|
|
|
constructor: function(tree, config){
|
|
<span id='Ext-tree-TreeSorter-cfg-folderSort'> /**
|
|
</span> * @cfg {Boolean} folderSort True to sort leaf nodes under non-leaf nodes (defaults to false)
|
|
*/
|
|
<span id='Ext-tree-TreeSorter-cfg-property'> /**
|
|
</span> * @cfg {String} property The named attribute on the node to sort by (defaults to "text"). Note that this
|
|
* property is only used if no {@link #sortType} function is specified, otherwise it is ignored.
|
|
*/
|
|
<span id='Ext-tree-TreeSorter-cfg-dir'> /**
|
|
</span> * @cfg {String} dir The direction to sort ("asc" or "desc," case-insensitive, defaults to "asc")
|
|
*/
|
|
<span id='Ext-tree-TreeSorter-cfg-leafAttr'> /**
|
|
</span> * @cfg {String} leafAttr The attribute used to determine leaf nodes when {@link #folderSort} = true (defaults to "leaf")
|
|
*/
|
|
<span id='Ext-tree-TreeSorter-cfg-caseSensitive'> /**
|
|
</span> * @cfg {Boolean} caseSensitive true for case-sensitive sort (defaults to false)
|
|
*/
|
|
<span id='Ext-tree-TreeSorter-cfg-sortType'> /**
|
|
</span> * @cfg {Function} sortType A custom "casting" function used to convert node values before sorting. The function
|
|
* will be called with a two parameters, the {@link #property} value for the node and the {@link Ext.tree.TreeNode} being evaluated.
|
|
* It is expected to return the node's sort value cast to the specific data type required for sorting. This could be used, for example, when
|
|
* a node's text (or other attribute) should be sorted as a date or numeric value. See the class description for
|
|
* example usage.
|
|
*/
|
|
|
|
Ext.apply(this, config);
|
|
tree.on({
|
|
scope: this,
|
|
beforechildrenrendered: this.doSort,
|
|
append: this.updateSort,
|
|
insert: this.updateSort,
|
|
textchange: this.updateSortParent
|
|
});
|
|
|
|
var desc = this.dir && this.dir.toLowerCase() == 'desc',
|
|
prop = this.property || 'text',
|
|
sortType = this.sortType,
|
|
folderSort = this.folderSort,
|
|
caseSensitive = this.caseSensitive === true,
|
|
leafAttr = this.leafAttr || 'leaf';
|
|
|
|
if(Ext.isString(sortType)){
|
|
sortType = Ext.data.SortTypes[sortType];
|
|
}
|
|
this.sortFn = function(n1, n2){
|
|
var attr1 = n1.attributes,
|
|
attr2 = n2.attributes;
|
|
|
|
if(folderSort){
|
|
if(attr1[leafAttr] && !attr2[leafAttr]){
|
|
return 1;
|
|
}
|
|
if(!attr1[leafAttr] && attr2[leafAttr]){
|
|
return -1;
|
|
}
|
|
}
|
|
var prop1 = attr1[prop],
|
|
prop2 = attr2[prop],
|
|
v1 = sortType ? sortType(prop1, n1) : (caseSensitive ? prop1 : prop1.toUpperCase()),
|
|
v2 = sortType ? sortType(prop2, n2) : (caseSensitive ? prop2 : prop2.toUpperCase());
|
|
|
|
if(v1 < v2){
|
|
return desc ? 1 : -1;
|
|
}else if(v1 > v2){
|
|
return desc ? -1 : 1;
|
|
}
|
|
return 0;
|
|
};
|
|
},
|
|
|
|
<span id='Ext-tree-TreeSorter-method-doSort'> doSort : function(node){
|
|
</span> node.sort(this.sortFn);
|
|
},
|
|
|
|
<span id='Ext-tree-TreeSorter-method-updateSort'> updateSort : function(tree, node){
|
|
</span> if(node.childrenRendered){
|
|
this.doSort.defer(1, this, [node]);
|
|
}
|
|
},
|
|
|
|
<span id='Ext-tree-TreeSorter-method-updateSortParent'> updateSortParent : function(node){
|
|
</span> var p = node.parentNode;
|
|
if(p && p.childrenRendered){
|
|
this.doSort.defer(1, this, [p]);
|
|
}
|
|
}
|
|
});
|
|
</pre>
|
|
</body>
|
|
</html>
|