docs/source/TreeSorter.html

   1 <html>\r
   2 <head>\r
   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
   7 </head>\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
  14  * <pre><code>\r
  15 new Ext.tree.TreeSorter(myTree, {\r
  16     folderSort: true,\r
  17     dir: "desc",\r
  18     sortType: function(node) {\r
  19         // sort by a custom, typed attribute:\r
  20         return parseInt(node.id, 10);\r
  21     }\r
  22 });\r
  23 </code></pre>\r
  24  * @constructor\r
  25  * @param {TreePanel} tree\r
  26  * @param {Object} config\r
  27  */\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
  31      */\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
  35      */\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
  38      */\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
  41      */\r
  42     <div id="cfg-Ext.tree.TreeSorter-caseSensitive"></div>/** \r
  43      * @cfg {Boolean} caseSensitive true for case-sensitive sort (defaults to false)\r
  44      */\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
  51      */\r
  52     \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
  58     \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
  65 \r
  66     this.sortFn = function(n1, n2){\r
  67         if(fs){\r
  68             if(n1.attributes[leafAttr] && !n2.attributes[leafAttr]){\r
  69                 return 1;\r
  70             }\r
  71             if(!n1.attributes[leafAttr] && n2.attributes[leafAttr]){\r
  72                 return -1;\r
  73             }\r
  74         }\r
  75         var v1 = sortType ? sortType(n1.attributes[p]) : (cs ? n1.attributes[p] : n1.attributes[p].toUpperCase());\r
  76         var v2 = sortType ? sortType(n2.attributes[p]) : (cs ? n2.attributes[p] : n2.attributes[p].toUpperCase());\r
  77         if(v1 < v2){\r
  78                         return dsc ? +1 : -1;\r
  79                 }else if(v1 > v2){\r
  80                         return dsc ? -1 : +1;\r
  81         }else{\r
  82                 return 0;\r
  83         }\r
  84     };\r
  85 };\r
  86 \r
  87 Ext.tree.TreeSorter.prototype = {\r
  88     doSort : function(node){\r
  89         node.sort(this.sortFn);\r
  90     },\r
  91     \r
  92     compareNodes : function(n1, n2){\r
  93         return (n1.text.toUpperCase() > n2.text.toUpperCase() ? 1 : -1);\r
  94     },\r
  95     \r
  96     updateSort : function(tree, node){\r
  97         if(node.childrenRendered){\r
  98             this.doSort.defer(1, this, [node]);\r
  99         }\r
 100     },\r
 101     \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
 106         }\r
 107     }\r
 108 };</pre>    \r
 109 </body>\r
 110 </html>