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.3.1
  11  * Copyright(c) 2006-2010 Sencha Inc.
  12  * licensing@sencha.com
  13  * http://www.sencha.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 = Ext.extend(Object, {
  35
  36     constructor: function(tree, config){
  37         <div id="cfg-Ext.tree.TreeSorter-folderSort"></div>/**
  38      * @cfg {Boolean} folderSort True to sort leaf nodes under non-leaf nodes (defaults to false)
  39      */
  40     <div id="cfg-Ext.tree.TreeSorter-property"></div>/**
  41      * @cfg {String} property The named attribute on the node to sort by (defaults to "text").  Note that this
  42      * property is only used if no {@link #sortType} function is specified, otherwise it is ignored.
  43      */
  44     <div id="cfg-Ext.tree.TreeSorter-dir"></div>/**
  45      * @cfg {String} dir The direction to sort ("asc" or "desc," case-insensitive, defaults to "asc")
  46      */
  47     <div id="cfg-Ext.tree.TreeSorter-leafAttr"></div>/**
  48      * @cfg {String} leafAttr The attribute used to determine leaf nodes when {@link #folderSort} = true (defaults to "leaf")
  49      */
  50     <div id="cfg-Ext.tree.TreeSorter-caseSensitive"></div>/**
  51      * @cfg {Boolean} caseSensitive true for case-sensitive sort (defaults to false)
  52      */
  53     <div id="cfg-Ext.tree.TreeSorter-sortType"></div>/**
  54      * @cfg {Function} sortType A custom "casting" function used to convert node values before sorting.  The function
  55      * will be called with a single parameter (the {@link Ext.tree.TreeNode} being evaluated) and is expected to return
  56      * the node's sort value cast to the specific data type required for sorting.  This could be used, for example, when
  57      * a node's text (or other attribute) should be sorted as a date or numeric value.  See the class description for
  58      * example usage.  Note that if a sortType is specified, any {@link #property} config will be ignored.
  59      */
  60
  61     Ext.apply(this, config);
  62     tree.on({
  63         scope: this,
  64         beforechildrenrendered: this.doSort,
  65         append: this.updateSort,
  66         insert: this.updateSort,
  67         textchange: this.updateSortParent
  68     });
  69
  70     var desc = this.dir && this.dir.toLowerCase() == 'desc',
  71         prop = this.property || 'text';
  72         sortType = this.sortType;
  73         folderSort = this.folderSort;
  74         caseSensitive = this.caseSensitive === true;
  75         leafAttr = this.leafAttr || 'leaf';
  76
  77     if(Ext.isString(sortType)){
  78         sortType = Ext.data.SortTypes[sortType];
  79     }
  80     this.sortFn = function(n1, n2){
  81         var attr1 = n1.attributes,
  82             attr2 = n2.attributes;
  83
  84         if(folderSort){
  85             if(attr1[leafAttr] && !attr2[leafAttr]){
  86                 return 1;
  87             }
  88             if(!attr1[leafAttr] && attr2[leafAttr]){
  89                 return -1;
  90             }
  91         }
  92         var prop1 = attr1[prop],
  93             prop2 = attr2[prop],
  94             v1 = sortType ? sortType(prop1) : (caseSensitive ? prop1 : prop1.toUpperCase());
  95             v2 = sortType ? sortType(prop2) : (caseSensitive ? prop2 : prop2.toUpperCase());
  96
  97         if(v1 < v2){
  98             return desc ? 1 : -1;
  99         }else if(v1 > v2){
 100             return desc ? -1 : 1;
 101         }
 102         return 0;
 103     };
 104     },
 105
 106     doSort : function(node){
 107         node.sort(this.sortFn);
 108     },
 109
 110     updateSort : function(tree, node){
 111         if(node.childrenRendered){
 112             this.doSort.defer(1, this, [node]);
 113         }
 114     },
 115
 116     updateSortParent : function(node){
 117         var p = node.parentNode;
 118         if(p && p.childrenRendered){
 119             this.doSort.defer(1, this, [p]);
 120         }
 121     }
 122 });</pre>
 123 </body>
 124 </html>