Upgrade to ExtJS 3.2.1 - Released 04/27/2010
[extjs.git] / docs / source / TreeSorter.html
1 <html>
2 <head>
3   <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />    
4   <title>The source code</title>
5     <link href="../resources/prettify/prettify.css" type="text/css" rel="stylesheet" />
6     <script type="text/javascript" src="../resources/prettify/prettify.js"></script>
7 </head>
8 <body  onload="prettyPrint();">
9     <pre class="prettyprint lang-js">/*!
10  * Ext JS Library 3.2.1
11  * Copyright(c) 2006-2010 Ext JS, Inc.
12  * licensing@extjs.com
13  * http://www.extjs.com/license
14  */
15 <div id="cls-Ext.tree.TreeSorter"></div>/**
16  * @class Ext.tree.TreeSorter
17  * Provides sorting of nodes in a {@link Ext.tree.TreePanel}.  The TreeSorter automatically monitors events on the
18  * associated TreePanel that might affect the tree's sort order (beforechildrenrendered, append, insert and textchange).
19  * Example usage:<br />
20  * <pre><code>
21 new Ext.tree.TreeSorter(myTree, {
22     folderSort: true,
23     dir: "desc",
24     sortType: function(node) {
25         // sort by a custom, typed attribute:
26         return parseInt(node.id, 10);
27     }
28 });
29 </code></pre>
30  * @constructor
31  * @param {TreePanel} tree
32  * @param {Object} config
33  */
34 Ext.tree.TreeSorter = function(tree, config){
35     <div id="cfg-Ext.tree.TreeSorter-folderSort"></div>/**
36      * @cfg {Boolean} folderSort True to sort leaf nodes under non-leaf nodes (defaults to false)
37      */
38     <div id="cfg-Ext.tree.TreeSorter-property"></div>/**
39      * @cfg {String} property The named attribute on the node to sort by (defaults to "text").  Note that this
40      * property is only used if no {@link #sortType} function is specified, otherwise it is ignored.
41      */
42     <div id="cfg-Ext.tree.TreeSorter-dir"></div>/**
43      * @cfg {String} dir The direction to sort ("asc" or "desc," case-insensitive, defaults to "asc")
44      */
45     <div id="cfg-Ext.tree.TreeSorter-leafAttr"></div>/**
46      * @cfg {String} leafAttr The attribute used to determine leaf nodes when {@link #folderSort} = true (defaults to "leaf")
47      */
48     <div id="cfg-Ext.tree.TreeSorter-caseSensitive"></div>/**
49      * @cfg {Boolean} caseSensitive true for case-sensitive sort (defaults to false)
50      */
51     <div id="cfg-Ext.tree.TreeSorter-sortType"></div>/**
52      * @cfg {Function} sortType A custom "casting" function used to convert node values before sorting.  The function
53      * will be called with a single parameter (the {@link Ext.tree.TreeNode} being evaluated) and is expected to return
54      * the node's sort value cast to the specific data type required for sorting.  This could be used, for example, when
55      * a node's text (or other attribute) should be sorted as a date or numeric value.  See the class description for
56      * example usage.  Note that if a sortType is specified, any {@link #property} config will be ignored.
57      */
58
59     Ext.apply(this, config);
60     tree.on("beforechildrenrendered", this.doSort, this);
61     tree.on("append", this.updateSort, this);
62     tree.on("insert", this.updateSort, this);
63     tree.on("textchange", this.updateSortParent, this);
64
65     var dsc = this.dir && this.dir.toLowerCase() == "desc";
66     var p = this.property || "text";
67     var sortType = this.sortType;
68     var fs = this.folderSort;
69     var cs = this.caseSensitive === true;
70     var leafAttr = this.leafAttr || 'leaf';
71
72     this.sortFn = function(n1, n2){
73         if(fs){
74             if(n1.attributes[leafAttr] && !n2.attributes[leafAttr]){
75                 return 1;
76             }
77             if(!n1.attributes[leafAttr] && n2.attributes[leafAttr]){
78                 return -1;
79             }
80         }
81         var v1 = sortType ? sortType(n1) : (cs ? n1.attributes[p] : n1.attributes[p].toUpperCase());
82         var v2 = sortType ? sortType(n2) : (cs ? n2.attributes[p] : n2.attributes[p].toUpperCase());
83         if(v1 < v2){
84             return dsc ? +1 : -1;
85         }else if(v1 > v2){
86             return dsc ? -1 : +1;
87         }else{
88             return 0;
89         }
90     };
91 };
92
93 Ext.tree.TreeSorter.prototype = {
94     doSort : function(node){
95         node.sort(this.sortFn);
96     },
97
98     compareNodes : function(n1, n2){
99         return (n1.text.toUpperCase() > n2.text.toUpperCase() ? 1 : -1);
100     },
101
102     updateSort : function(tree, node){
103         if(node.childrenRendered){
104             this.doSort.defer(1, this, [node]);
105         }
106     },
107
108     updateSortParent : function(node){
109         var p = node.parentNode;
110         if(p && p.childrenRendered){
111             this.doSort.defer(1, this, [p]);
112         }
113     }
114 };</pre>    
115 </body>
116 </html>