Tree.html 10 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  5. <title>The source code</title>
  6. <link href="../resources/prettify/prettify.css" type="text/css" rel="stylesheet" />
  7. <script type="text/javascript" src="../resources/prettify/prettify.js"></script>
  8. <style type="text/css">
  9. .highlight { display: block; background-color: #ddd; }
  10. </style>
  11. <script type="text/javascript">
  12. function highlight() {
  13. document.getElementById(location.hash.replace(/#/, "")).className = "highlight";
  14. }
  15. </script>
  16. </head>
  17. <body onload="prettyPrint(); highlight();">
  18. <pre class="prettyprint lang-js"><span id='Ext-data-Tree'>/**
  19. </span> * @class Ext.data.Tree
  20. *
  21. * This class is used as a container for a series of nodes. The nodes themselves maintain
  22. * the relationship between parent/child. The tree itself acts as a manager. It gives functionality
  23. * to retrieve a node by its identifier: {@link #getNodeById}.
  24. *
  25. * The tree also relays events from any of it's child nodes, allowing them to be handled in a
  26. * centralized fashion. In general this class is not used directly, rather used internally
  27. * by other parts of the framework.
  28. *
  29. */
  30. Ext.define('Ext.data.Tree', {
  31. alias: 'data.tree',
  32. mixins: {
  33. observable: &quot;Ext.util.Observable&quot;
  34. },
  35. <span id='Ext-data-Tree-property-root'> /**
  36. </span> * @property {Ext.data.NodeInterface}
  37. * The root node for this tree
  38. */
  39. root: null,
  40. <span id='Ext-data-Tree-method-constructor'> /**
  41. </span> * Creates new Tree object.
  42. * @param {Ext.data.NodeInterface} root (optional) The root node
  43. */
  44. constructor: function(root) {
  45. var me = this;
  46. me.mixins.observable.constructor.call(me);
  47. if (root) {
  48. me.setRootNode(root);
  49. }
  50. },
  51. <span id='Ext-data-Tree-method-getRootNode'> /**
  52. </span> * Returns the root node for this tree.
  53. * @return {Ext.data.NodeInterface}
  54. */
  55. getRootNode : function() {
  56. return this.root;
  57. },
  58. <span id='Ext-data-Tree-method-setRootNode'> /**
  59. </span> * Sets the root node for this tree.
  60. * @param {Ext.data.NodeInterface} node
  61. * @return {Ext.data.NodeInterface} The root node
  62. */
  63. setRootNode : function(node) {
  64. var me = this;
  65. me.root = node;
  66. if (me.fireEvent('beforeappend', null, node) !== false) {
  67. node.set('root', true);
  68. node.updateInfo();
  69. // root node should never be phantom or dirty, so commit it
  70. node.commit();
  71. node.on({
  72. scope: me,
  73. insert: me.onNodeInsert,
  74. append: me.onNodeAppend,
  75. remove: me.onNodeRemove
  76. });
  77. me.relayEvents(node, [
  78. <span id='Ext-data-Tree-event-append'> /**
  79. </span> * @event append
  80. * @inheritdoc Ext.data.NodeInterface#append
  81. */
  82. &quot;append&quot;,
  83. <span id='Ext-data-Tree-event-remove'> /**
  84. </span> * @event remove
  85. * @inheritdoc Ext.data.NodeInterface#remove
  86. */
  87. &quot;remove&quot;,
  88. <span id='Ext-data-Tree-event-move'> /**
  89. </span> * @event move
  90. * @inheritdoc Ext.data.NodeInterface#move
  91. */
  92. &quot;move&quot;,
  93. <span id='Ext-data-Tree-event-insert'> /**
  94. </span> * @event insert
  95. * @inheritdoc Ext.data.NodeInterface#insert
  96. */
  97. &quot;insert&quot;,
  98. <span id='Ext-data-Tree-event-beforeappend'> /**
  99. </span> * @event beforeappend
  100. * @inheritdoc Ext.data.NodeInterface#beforeappend
  101. */
  102. &quot;beforeappend&quot;,
  103. <span id='Ext-data-Tree-event-beforeremove'> /**
  104. </span> * @event beforeremove
  105. * @inheritdoc Ext.data.NodeInterface#beforeremove
  106. */
  107. &quot;beforeremove&quot;,
  108. <span id='Ext-data-Tree-event-beforemove'> /**
  109. </span> * @event beforemove
  110. * @inheritdoc Ext.data.NodeInterface#beforemove
  111. */
  112. &quot;beforemove&quot;,
  113. <span id='Ext-data-Tree-event-beforeinsert'> /**
  114. </span> * @event beforeinsert
  115. * @inheritdoc Ext.data.NodeInterface#beforeinsert
  116. */
  117. &quot;beforeinsert&quot;,
  118. <span id='Ext-data-Tree-event-expand'> /**
  119. </span> * @event expand
  120. * @inheritdoc Ext.data.NodeInterface#expand
  121. */
  122. &quot;expand&quot;,
  123. <span id='Ext-data-Tree-event-collapse'> /**
  124. </span> * @event collapse
  125. * @inheritdoc Ext.data.NodeInterface#collapse
  126. */
  127. &quot;collapse&quot;,
  128. <span id='Ext-data-Tree-event-beforeexpand'> /**
  129. </span> * @event beforeexpand
  130. * @inheritdoc Ext.data.NodeInterface#beforeexpand
  131. */
  132. &quot;beforeexpand&quot;,
  133. <span id='Ext-data-Tree-event-beforecollapse'> /**
  134. </span> * @event beforecollapse
  135. * @inheritdoc Ext.data.NodeInterface#beforecollapse
  136. */
  137. &quot;beforecollapse&quot; ,
  138. <span id='Ext-data-Tree-event-sort'> /**
  139. </span> * @event sort
  140. * @inheritdoc Ext.data.NodeInterface#event-sort
  141. */
  142. &quot;sort&quot;,
  143. <span id='Ext-data-Tree-event-rootchange'> /**
  144. </span> * @event rootchange
  145. * Fires whenever the root node is changed in the tree.
  146. * @param {Ext.data.Model} root The new root
  147. */
  148. &quot;rootchange&quot;
  149. ]);
  150. me.nodeHash = {};
  151. me.registerNode(node);
  152. me.fireEvent('append', null, node);
  153. me.fireEvent('rootchange', node);
  154. }
  155. return node;
  156. },
  157. <span id='Ext-data-Tree-method-flatten'> /**
  158. </span> * Flattens all the nodes in the tree into an array.
  159. * @private
  160. * @return {Ext.data.NodeInterface[]} The flattened nodes.
  161. */
  162. flatten: function(){
  163. return Ext.Object.getValues(this.nodeHash);
  164. },
  165. <span id='Ext-data-Tree-method-onNodeInsert'> /**
  166. </span> * Fired when a node is inserted into the root or one of it's children
  167. * @private
  168. * @param {Ext.data.NodeInterface} parent The parent node
  169. * @param {Ext.data.NodeInterface} node The inserted node
  170. */
  171. onNodeInsert: function(parent, node) {
  172. this.registerNode(node, true);
  173. },
  174. <span id='Ext-data-Tree-method-onNodeAppend'> /**
  175. </span> * Fired when a node is appended into the root or one of it's children
  176. * @private
  177. * @param {Ext.data.NodeInterface} parent The parent node
  178. * @param {Ext.data.NodeInterface} node The appended node
  179. */
  180. onNodeAppend: function(parent, node) {
  181. this.registerNode(node, true);
  182. },
  183. <span id='Ext-data-Tree-method-onNodeRemove'> /**
  184. </span> * Fired when a node is removed from the root or one of it's children
  185. * @private
  186. * @param {Ext.data.NodeInterface} parent The parent node
  187. * @param {Ext.data.NodeInterface} node The removed node
  188. */
  189. onNodeRemove: function(parent, node) {
  190. this.unregisterNode(node, true);
  191. },
  192. <span id='Ext-data-Tree-method-onNodeIdChanged'> /**
  193. </span> * Fired when a node's id changes. Updates the node's id in the node hash.
  194. * @private
  195. * @param {Ext.data.NodeInterface} node
  196. * @param {Number} oldId The old id
  197. * @param {Number} newId The new id
  198. */
  199. onNodeIdChanged: function(node, oldId, newId) {
  200. var nodeHash = this.nodeHash;
  201. nodeHash[newId] = node;
  202. delete nodeHash[oldId || node.internalId];
  203. },
  204. <span id='Ext-data-Tree-method-getNodeById'> /**
  205. </span> * Gets a node in this tree by its id.
  206. * @param {String} id
  207. * @return {Ext.data.NodeInterface} The match node.
  208. */
  209. getNodeById : function(id) {
  210. return this.nodeHash[id];
  211. },
  212. <span id='Ext-data-Tree-method-registerNode'> /**
  213. </span> * Registers a node with the tree
  214. * @private
  215. * @param {Ext.data.NodeInterface} The node to register
  216. * @param {Boolean} [includeChildren] True to unregister any child nodes
  217. */
  218. registerNode : function(node, includeChildren) {
  219. var me = this;
  220. me.nodeHash[node.getId() || node.internalId] = node;
  221. node.on('idchanged', me.onNodeIdChanged, me);
  222. if (includeChildren === true) {
  223. node.eachChild(function(child){
  224. me.registerNode(child, true);
  225. });
  226. }
  227. },
  228. <span id='Ext-data-Tree-method-unregisterNode'> /**
  229. </span> * Unregisters a node with the tree
  230. * @private
  231. * @param {Ext.data.NodeInterface} The node to unregister
  232. * @param {Boolean} [includeChildren] True to unregister any child nodes
  233. */
  234. unregisterNode : function(node, includeChildren) {
  235. delete this.nodeHash[node.getId() || node.internalId];
  236. if (includeChildren === true) {
  237. node.eachChild(function(child){
  238. this.unregisterNode(child, true);
  239. }, this);
  240. }
  241. },
  242. <span id='Ext-data-Tree-method-sort'> /**
  243. </span> * Sorts this tree
  244. * @private
  245. * @param {Function} sorterFn The function to use for sorting
  246. * @param {Boolean} recursive True to perform recursive sorting
  247. */
  248. sort: function(sorterFn, recursive) {
  249. this.getRootNode().sort(sorterFn, recursive);
  250. },
  251. <span id='Ext-data-Tree-method-filter'> /**
  252. </span> * Filters this tree
  253. * @private
  254. * @param {Function} sorterFn The function to use for filtering
  255. * @param {Boolean} recursive True to perform recursive filtering
  256. */
  257. filter: function(filters, recursive) {
  258. this.getRootNode().filter(filters, recursive);
  259. }
  260. });</pre>
  261. </body>
  262. </html>