docs/source/TreeSelectionModel.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.DefaultSelectionModel"></div>/**
  16  * @class Ext.tree.DefaultSelectionModel
  17  * @extends Ext.util.Observable
  18  * The default single selection for a TreePanel.
  19  */
  20 Ext.tree.DefaultSelectionModel = Ext.extend(Ext.util.Observable, {
  21
  22     constructor : function(config){
  23         this.selNode = null;
  24
  25         this.addEvents(
  26             <div id="event-Ext.tree.DefaultSelectionModel-selectionchange"></div>/**
  27              * @event selectionchange
  28              * Fires when the selected node changes
  29              * @param {DefaultSelectionModel} this
  30              * @param {TreeNode} node the new selection
  31              */
  32             'selectionchange',
  33
  34             <div id="event-Ext.tree.DefaultSelectionModel-beforeselect"></div>/**
  35              * @event beforeselect
  36              * Fires before the selected node changes, return false to cancel the change
  37              * @param {DefaultSelectionModel} this
  38              * @param {TreeNode} node the new selection
  39              * @param {TreeNode} node the old selection
  40              */
  41             'beforeselect'
  42         );
  43
  44         Ext.apply(this, config);
  45         Ext.tree.DefaultSelectionModel.superclass.constructor.call(this);
  46     },
  47
  48     init : function(tree){
  49         this.tree = tree;
  50         tree.mon(tree.getTreeEl(), 'keydown', this.onKeyDown, this);
  51         tree.on('click', this.onNodeClick, this);
  52     },
  53
  54     onNodeClick : function(node, e){
  55         this.select(node);
  56     },
  57
  58     <div id="method-Ext.tree.DefaultSelectionModel-select"></div>/**
  59      * Select a node.
  60      * @param {TreeNode} node The node to select
  61      * @return {TreeNode} The selected node
  62      */
  63     select : function(node, /* private*/ selectNextNode){
  64         // If node is hidden, select the next node in whatever direction was being moved in.
  65         if (!Ext.fly(node.ui.wrap).isVisible() && selectNextNode) {
  66             return selectNextNode.call(this, node);
  67         }
  68         var last = this.selNode;
  69         if(node == last){
  70             node.ui.onSelectedChange(true);
  71         }else if(this.fireEvent('beforeselect', this, node, last) !== false){
  72             if(last && last.ui){
  73                 last.ui.onSelectedChange(false);
  74             }
  75             this.selNode = node;
  76             node.ui.onSelectedChange(true);
  77             this.fireEvent('selectionchange', this, node, last);
  78         }
  79         return node;
  80     },
  81
  82     <div id="method-Ext.tree.DefaultSelectionModel-unselect"></div>/**
  83      * Deselect a node.
  84      * @param {TreeNode} node The node to unselect
  85      * @param {Boolean} silent True to stop the selectionchange event from firing.
  86      */
  87     unselect : function(node, silent){
  88         if(this.selNode == node){
  89             this.clearSelections(silent);
  90         }
  91     },
  92
  93     <div id="method-Ext.tree.DefaultSelectionModel-clearSelections"></div>/**
  94      * Clear all selections
  95      * @param {Boolean} silent True to stop the selectionchange event from firing.
  96      */
  97     clearSelections : function(silent){
  98         var n = this.selNode;
  99         if(n){
 100             n.ui.onSelectedChange(false);
 101             this.selNode = null;
 102             if(silent !== true){
 103                 this.fireEvent('selectionchange', this, null);
 104             }
 105         }
 106         return n;
 107     },
 108
 109     <div id="method-Ext.tree.DefaultSelectionModel-getSelectedNode"></div>/**
 110      * Get the selected node
 111      * @return {TreeNode} The selected node
 112      */
 113     getSelectedNode : function(){
 114         return this.selNode;
 115     },
 116
 117     <div id="method-Ext.tree.DefaultSelectionModel-isSelected"></div>/**
 118      * Returns true if the node is selected
 119      * @param {TreeNode} node The node to check
 120      * @return {Boolean}
 121      */
 122     isSelected : function(node){
 123         return this.selNode == node;
 124     },
 125
 126     <div id="method-Ext.tree.DefaultSelectionModel-selectPrevious"></div>/**
 127      * Selects the node above the selected node in the tree, intelligently walking the nodes
 128      * @return TreeNode The new selection
 129      */
 130     selectPrevious : function(/* private */ s){
 131         if(!(s = s || this.selNode || this.lastSelNode)){
 132             return null;
 133         }
 134         // Here we pass in the current function to select to indicate the direction we're moving
 135         var ps = s.previousSibling;
 136         if(ps){
 137             if(!ps.isExpanded() || ps.childNodes.length < 1){
 138                 return this.select(ps, this.selectPrevious);
 139             } else{
 140                 var lc = ps.lastChild;
 141                 while(lc && lc.isExpanded() && Ext.fly(lc.ui.wrap).isVisible() && lc.childNodes.length > 0){
 142                     lc = lc.lastChild;
 143                 }
 144                 return this.select(lc, this.selectPrevious);
 145             }
 146         } else if(s.parentNode && (this.tree.rootVisible || !s.parentNode.isRoot)){
 147             return this.select(s.parentNode, this.selectPrevious);
 148         }
 149         return null;
 150     },
 151
 152     <div id="method-Ext.tree.DefaultSelectionModel-selectNext"></div>/**
 153      * Selects the node above the selected node in the tree, intelligently walking the nodes
 154      * @return TreeNode The new selection
 155      */
 156     selectNext : function(/* private */ s){
 157         if(!(s = s || this.selNode || this.lastSelNode)){
 158             return null;
 159         }
 160         // Here we pass in the current function to select to indicate the direction we're moving
 161         if(s.firstChild && s.isExpanded() && Ext.fly(s.ui.wrap).isVisible()){
 162              return this.select(s.firstChild, this.selectNext);
 163          }else if(s.nextSibling){
 164              return this.select(s.nextSibling, this.selectNext);
 165          }else if(s.parentNode){
 166             var newS = null;
 167             s.parentNode.bubble(function(){
 168                 if(this.nextSibling){
 169                     newS = this.getOwnerTree().selModel.select(this.nextSibling, this.selectNext);
 170                     return false;
 171                 }
 172             });
 173             return newS;
 174          }
 175         return null;
 176     },
 177
 178     onKeyDown : function(e){
 179         var s = this.selNode || this.lastSelNode;
 180         // undesirable, but required
 181         var sm = this;
 182         if(!s){
 183             return;
 184         }
 185         var k = e.getKey();
 186         switch(k){
 187              case e.DOWN:
 188                  e.stopEvent();
 189                  this.selectNext();
 190              break;
 191              case e.UP:
 192                  e.stopEvent();
 193                  this.selectPrevious();
 194              break;
 195              case e.RIGHT:
 196                  e.preventDefault();
 197                  if(s.hasChildNodes()){
 198                      if(!s.isExpanded()){
 199                          s.expand();
 200                      }else if(s.firstChild){
 201                          this.select(s.firstChild, e);
 202                      }
 203                  }
 204              break;
 205              case e.LEFT:
 206                  e.preventDefault();
 207                  if(s.hasChildNodes() && s.isExpanded()){
 208                      s.collapse();
 209                  }else if(s.parentNode && (this.tree.rootVisible || s.parentNode != this.tree.getRootNode())){
 210                      this.select(s.parentNode, e);
 211                  }
 212              break;
 213         };
 214     }
 215 });
 216
 217 <div id="cls-Ext.tree.MultiSelectionModel"></div>/**
 218  * @class Ext.tree.MultiSelectionModel
 219  * @extends Ext.util.Observable
 220  * Multi selection for a TreePanel.
 221  */
 222 Ext.tree.MultiSelectionModel = Ext.extend(Ext.util.Observable, {
 223
 224     constructor : function(config){
 225         this.selNodes = [];
 226         this.selMap = {};
 227         this.addEvents(
 228             <div id="event-Ext.tree.MultiSelectionModel-selectionchange"></div>/**
 229              * @event selectionchange
 230              * Fires when the selected nodes change
 231              * @param {MultiSelectionModel} this
 232              * @param {Array} nodes Array of the selected nodes
 233              */
 234             'selectionchange'
 235         );
 236         Ext.apply(this, config);
 237         Ext.tree.MultiSelectionModel.superclass.constructor.call(this);
 238     },
 239
 240     init : function(tree){
 241         this.tree = tree;
 242         tree.mon(tree.getTreeEl(), 'keydown', this.onKeyDown, this);
 243         tree.on('click', this.onNodeClick, this);
 244     },
 245
 246     onNodeClick : function(node, e){
 247         if(e.ctrlKey && this.isSelected(node)){
 248             this.unselect(node);
 249         }else{
 250             this.select(node, e, e.ctrlKey);
 251         }
 252     },
 253
 254     <div id="method-Ext.tree.MultiSelectionModel-select"></div>/**
 255      * Select a node.
 256      * @param {TreeNode} node The node to select
 257      * @param {EventObject} e (optional) An event associated with the selection
 258      * @param {Boolean} keepExisting True to retain existing selections
 259      * @return {TreeNode} The selected node
 260      */
 261     select : function(node, e, keepExisting){
 262         if(keepExisting !== true){
 263             this.clearSelections(true);
 264         }
 265         if(this.isSelected(node)){
 266             this.lastSelNode = node;
 267             return node;
 268         }
 269         this.selNodes.push(node);
 270         this.selMap[node.id] = node;
 271         this.lastSelNode = node;
 272         node.ui.onSelectedChange(true);
 273         this.fireEvent('selectionchange', this, this.selNodes);
 274         return node;
 275     },
 276
 277     <div id="method-Ext.tree.MultiSelectionModel-unselect"></div>/**
 278      * Deselect a node.
 279      * @param {TreeNode} node The node to unselect
 280      */
 281     unselect : function(node){
 282         if(this.selMap[node.id]){
 283             node.ui.onSelectedChange(false);
 284             var sn = this.selNodes;
 285             var index = sn.indexOf(node);
 286             if(index != -1){
 287                 this.selNodes.splice(index, 1);
 288             }
 289             delete this.selMap[node.id];
 290             this.fireEvent('selectionchange', this, this.selNodes);
 291         }
 292     },
 293
 294     <div id="method-Ext.tree.MultiSelectionModel-clearSelections"></div>/**
 295      * Clear all selections
 296      */
 297     clearSelections : function(suppressEvent){
 298         var sn = this.selNodes;
 299         if(sn.length > 0){
 300             for(var i = 0, len = sn.length; i < len; i++){
 301                 sn[i].ui.onSelectedChange(false);
 302             }
 303             this.selNodes = [];
 304             this.selMap = {};
 305             if(suppressEvent !== true){
 306                 this.fireEvent('selectionchange', this, this.selNodes);
 307             }
 308         }
 309     },
 310
 311     <div id="method-Ext.tree.MultiSelectionModel-isSelected"></div>/**
 312      * Returns true if the node is selected
 313      * @param {TreeNode} node The node to check
 314      * @return {Boolean}
 315      */
 316     isSelected : function(node){
 317         return this.selMap[node.id] ? true : false;
 318     },
 319
 320     <div id="method-Ext.tree.MultiSelectionModel-getSelectedNodes"></div>/**
 321      * Returns an array of the selected nodes
 322      * @return {Array}
 323      */
 324     getSelectedNodes : function(){
 325         return this.selNodes.concat([]);
 326     },
 327
 328     onKeyDown : Ext.tree.DefaultSelectionModel.prototype.onKeyDown,
 329
 330     selectNext : Ext.tree.DefaultSelectionModel.prototype.selectNext,
 331
 332     selectPrevious : Ext.tree.DefaultSelectionModel.prototype.selectPrevious
 333 });</pre>
 334 </body>
 335 </html>