3 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
\r
4 <title>The source code</title>
\r
5 <link href="../resources/prettify/prettify.css" type="text/css" rel="stylesheet" />
\r
6 <script type="text/javascript" src="../resources/prettify/prettify.js"></script>
\r
8 <body onload="prettyPrint();">
\r
9 <pre class="prettyprint lang-js"><div id="cls-Ext.tree.TreeSorter"></div>/**
\r
10 * @class Ext.tree.TreeSorter
\r
11 * Provides sorting of nodes in a {@link Ext.tree.TreePanel}. The TreeSorter automatically monitors events on the
\r
12 * associated TreePanel that might affect the tree's sort order (beforechildrenrendered, append, insert and textchange).
\r
13 * Example usage:<br />
\r
15 new Ext.tree.TreeSorter(myTree, {
\r
18 sortType: function(node) {
\r
19 // sort by a custom, typed attribute:
\r
20 return parseInt(node.id, 10);
\r
25 * @param {TreePanel} tree
\r
26 * @param {Object} config
\r
28 Ext.tree.TreeSorter = function(tree, config){
\r
29 <div id="cfg-Ext.tree.TreeSorter-folderSort"></div>/**
\r
30 * @cfg {Boolean} folderSort True to sort leaf nodes under non-leaf nodes (defaults to false)
\r
32 <div id="cfg-Ext.tree.TreeSorter-property"></div>/**
\r
33 * @cfg {String} property The named attribute on the node to sort by (defaults to "text"). Note that this
\r
34 * property is only used if no {@link #sortType} function is specified, otherwise it is ignored.
\r
36 <div id="cfg-Ext.tree.TreeSorter-dir"></div>/**
\r
37 * @cfg {String} dir The direction to sort ("asc" or "desc," case-insensitive, defaults to "asc")
\r
39 <div id="cfg-Ext.tree.TreeSorter-leafAttr"></div>/**
\r
40 * @cfg {String} leafAttr The attribute used to determine leaf nodes when {@link #folderSort} = true (defaults to "leaf")
\r
42 <div id="cfg-Ext.tree.TreeSorter-caseSensitive"></div>/**
\r
43 * @cfg {Boolean} caseSensitive true for case-sensitive sort (defaults to false)
\r
45 <div id="cfg-Ext.tree.TreeSorter-sortType"></div>/**
\r
46 * @cfg {Function} sortType A custom "casting" function used to convert node values before sorting. The function
\r
47 * will be called with a single parameter (the {@link Ext.tree.TreeNode} being evaluated) and is expected to return
\r
48 * the node's sort value cast to the specific data type required for sorting. This could be used, for example, when
\r
49 * a node's text (or other attribute) should be sorted as a date or numeric value. See the class description for
\r
50 * example usage. Note that if a sortType is specified, any {@link #property} config will be ignored.
\r
53 Ext.apply(this, config);
\r
54 tree.on("beforechildrenrendered", this.doSort, this);
\r
55 tree.on("append", this.updateSort, this);
\r
56 tree.on("insert", this.updateSort, this);
\r
57 tree.on("textchange", this.updateSortParent, this);
\r
59 var dsc = this.dir && this.dir.toLowerCase() == "desc";
\r
60 var p = this.property || "text";
\r
61 var sortType = this.sortType;
\r
62 var fs = this.folderSort;
\r
63 var cs = this.caseSensitive === true;
\r
64 var leafAttr = this.leafAttr || 'leaf';
\r
66 this.sortFn = function(n1, n2){
\r
68 if(n1.attributes[leafAttr] && !n2.attributes[leafAttr]){
\r
71 if(!n1.attributes[leafAttr] && n2.attributes[leafAttr]){
\r
75 var v1 = sortType ? sortType(n1) : (cs ? n1.attributes[p] : n1.attributes[p].toUpperCase());
\r
76 var v2 = sortType ? sortType(n2) : (cs ? n2.attributes[p] : n2.attributes[p].toUpperCase());
\r
78 return dsc ? +1 : -1;
\r
80 return dsc ? -1 : +1;
\r
87 Ext.tree.TreeSorter.prototype = {
\r
88 doSort : function(node){
\r
89 node.sort(this.sortFn);
\r
92 compareNodes : function(n1, n2){
\r
93 return (n1.text.toUpperCase() > n2.text.toUpperCase() ? 1 : -1);
\r
96 updateSort : function(tree, node){
\r
97 if(node.childrenRendered){
\r
98 this.doSort.defer(1, this, [node]);
\r
102 updateSortParent : function(node){
\r
103 var p = node.parentNode;
\r
104 if(p && p.childrenRendered){
\r
105 this.doSort.defer(1, this, [p]);
\r