docs/source/TreeSelectionModel.html

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