31ac804a6662f1c42910f7a6bbb841aea8ea98ef
[roojs1] / docs / src / Roo_bootstrap_menu_Menu.js.html
1 <html><head><title>Roo/bootstrap/menu/Menu.js</title><link rel="stylesheet" type="text/css" href="../../css/highlight-js.css"/></head><body class="highlightpage"><code class="jsdoc-pretty">
2 <span class="jsdoc-comment">/**
3  * @class Roo.bootstrap.menu.Menu
4  * @extends Roo.bootstrap.Component
5  * @licence LGPL
6  * @children Roo.bootstrap.menu.Item
7  * Bootstrap Menu class - container for MenuItems
8  * 
9  * @cfg {String} type (dropdown|treeview|submenu) type of menu
10  * @cfg {bool} hidden  if the menu should be hidden when rendered.
11  * @cfg {bool} stopEvent (true|false)  Stop event after trigger press (default true)
12  * @cfg {bool} isLink (true|false)  the menu has link disable auto expand and collaspe (default false)
13   * @cfg {bool} hideTrigger (true|false)  default false - hide the carret for trigger.
14   * @cfg {String} align  default tl-bl? == below  - how the menu should be aligned. 
15  
16  * @constructor
17  * Create a new Menu
18  * @param {Object} config The config objectQ
19  */
20
21
22 </span><span class="jsdoc-var">Roo.bootstrap.menu.Menu </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">config</span><span class="jsdoc-syntax">){
23
24     </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">config.type </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">'treeview'</span><span class="jsdoc-syntax">) {
25         </span><span class="jsdoc-comment">// normally menu's are drawn attached to the document to handle layering etc..
26         // however treeview (used by the docs menu is drawn into the parent element)
27         </span><span class="jsdoc-var">this.container_method </span><span class="jsdoc-syntax">= </span><span class="jsdoc-string">'getChildContainer'</span><span class="jsdoc-syntax">;
28     }
29
30     </span><span class="jsdoc-var">Roo.bootstrap.menu.Menu.superclass.constructor.call</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">config</span><span class="jsdoc-syntax">);
31     </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.registerMenu </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">this.type </span><span class="jsdoc-syntax">!= </span><span class="jsdoc-string">'treeview'</span><span class="jsdoc-syntax">)  {
32         </span><span class="jsdoc-var">Roo.bootstrap.menu.Manager.register</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
33     }
34
35
36     </span><span class="jsdoc-var">this.addEvents</span><span class="jsdoc-syntax">({
37         </span><span class="jsdoc-comment">/**
38          * @event beforeshow
39          * Fires before this menu is displayed (return false to block)
40          * @param {Roo.menu.Menu} this
41          */
42         </span><span class="jsdoc-var">beforeshow </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
43         </span><span class="jsdoc-comment">/**
44          * @event beforehide
45          * Fires before this menu is hidden (return false to block)
46          * @param {Roo.menu.Menu} this
47          */
48         </span><span class="jsdoc-var">beforehide </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
49         </span><span class="jsdoc-comment">/**
50          * @event show
51          * Fires after this menu is displayed
52          * @param {Roo.menu.Menu} this
53          */
54         </span><span class="jsdoc-var">show </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
55         </span><span class="jsdoc-comment">/**
56          * @event hide
57          * Fires after this menu is hidden
58          * @param {Roo.menu.Menu} this
59          */
60         </span><span class="jsdoc-var">hide </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
61         </span><span class="jsdoc-comment">/**
62          * @event click
63          * Fires when this menu is clicked (or when the enter key is pressed while it is active)
64          * @param {Roo.menu.Menu} this
65          * @param {Roo.menu.Item} menuItem The menu item that was clicked
66          * @param {Roo.EventObject} e
67          */
68         </span><span class="jsdoc-var">click </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
69         </span><span class="jsdoc-comment">/**
70          * @event mouseover
71          * Fires when the mouse is hovering over this menu
72          * @param {Roo.menu.Menu} this
73          * @param {Roo.EventObject} e
74          * @param {Roo.menu.Item} menuItem The menu item that was clicked
75          */
76         </span><span class="jsdoc-var">mouseover </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
77         </span><span class="jsdoc-comment">/**
78          * @event mouseout
79          * Fires when the mouse exits this menu
80          * @param {Roo.menu.Menu} this
81          * @param {Roo.EventObject} e
82          * @param {Roo.menu.Item} menuItem The menu item that was clicked
83          */
84         </span><span class="jsdoc-var">mouseout </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
85         </span><span class="jsdoc-comment">/**
86          * @event itemclick
87          * Fires when a menu item contained in this menu is clicked
88          * @param {Roo.menu.BaseItem} baseItem The BaseItem that was clicked
89          * @param {Roo.EventObject} e
90          */
91         </span><span class="jsdoc-var">itemclick</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true
92     </span><span class="jsdoc-syntax">});
93     </span><span class="jsdoc-var">this.menuitems </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">new </span><span class="jsdoc-var">Roo.util.MixedCollection</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">o</span><span class="jsdoc-syntax">) { </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">o.el.id</span><span class="jsdoc-syntax">; });
94 };
95
96 </span><span class="jsdoc-var">Roo.extend</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Roo.bootstrap.menu.Menu</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">Roo.bootstrap.Component</span><span class="jsdoc-syntax">,  {
97
98    </span><span class="jsdoc-comment">/// html : false,
99
100     </span><span class="jsdoc-var">triggerEl </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,  </span><span class="jsdoc-comment">// is this set by component builder? -- it should really be fetched from parent()???
101     </span><span class="jsdoc-var">type</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
102     </span><span class="jsdoc-comment">/**
103      * @cfg {Boolean} registerMenu True (default) - means that clicking on screen etc. hides it.
104      */
105     </span><span class="jsdoc-var">registerMenu </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
106
107     </span><span class="jsdoc-var">menuItems </span><span class="jsdoc-syntax">:</span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">, </span><span class="jsdoc-comment">// stores the menu items..
108
109     </span><span class="jsdoc-var">hidden</span><span class="jsdoc-syntax">:</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
110
111     </span><span class="jsdoc-var">parentMenu </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
112
113     </span><span class="jsdoc-var">stopEvent </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
114
115     </span><span class="jsdoc-var">isLink </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
116
117     </span><span class="jsdoc-var">container_method </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'getDocumentBody'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-comment">// so the menu is rendered on the body and zIndex works.
118
119     </span><span class="jsdoc-var">hideTrigger </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
120
121     </span><span class="jsdoc-var">align </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'tl-bl?'</span><span class="jsdoc-syntax">,
122
123
124     </span><span class="jsdoc-var">getChildContainer </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">() {
125         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this.el</span><span class="jsdoc-syntax">;
126     },
127
128     </span><span class="jsdoc-var">getAutoCreate </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
129
130         </span><span class="jsdoc-comment">//if (['right'].indexOf(this.align)!==-1) {
131         //    cfg.cn[1].cls += ' pull-right'
132         //}
133
134         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">cfg </span><span class="jsdoc-syntax">= {
135             </span><span class="jsdoc-var">tag </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'ul'</span><span class="jsdoc-syntax">,
136             </span><span class="jsdoc-var">cls </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'dropdown-menu shadow' </span><span class="jsdoc-syntax">,
137             </span><span class="jsdoc-var">style </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'z-index:1000'
138
139         </span><span class="jsdoc-syntax">};
140
141         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.type </span><span class="jsdoc-syntax">=== </span><span class="jsdoc-string">'submenu'</span><span class="jsdoc-syntax">) {
142             </span><span class="jsdoc-var">cfg.cls </span><span class="jsdoc-syntax">= </span><span class="jsdoc-string">'submenu active'</span><span class="jsdoc-syntax">;
143         }
144         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.type </span><span class="jsdoc-syntax">=== </span><span class="jsdoc-string">'treeview'</span><span class="jsdoc-syntax">) {
145             </span><span class="jsdoc-var">cfg.cls </span><span class="jsdoc-syntax">= </span><span class="jsdoc-string">'treeview-menu'</span><span class="jsdoc-syntax">;
146         }
147
148         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">cfg</span><span class="jsdoc-syntax">;
149     },
150     </span><span class="jsdoc-var">initEvents </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">() {
151
152        </span><span class="jsdoc-comment">// Roo.log(&quot;ADD event&quot;);
153        // Roo.log(this.triggerEl.dom);
154         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.triggerEl</span><span class="jsdoc-syntax">) {
155
156             </span><span class="jsdoc-var">this.triggerEl.on</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'click'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.onTriggerClick</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
157
158             </span><span class="jsdoc-var">this.triggerEl.on</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Roo.isTouch </span><span class="jsdoc-syntax">? </span><span class="jsdoc-string">'touchstart' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'mouseup'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.onTriggerPress</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
159
160             </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">this.hideTrigger</span><span class="jsdoc-syntax">) {
161                 </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.triggerEl.hasClass</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'nav-item'</span><span class="jsdoc-syntax">) &amp;&amp; </span><span class="jsdoc-var">this.triggerEl.select</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'.nav-link'</span><span class="jsdoc-syntax">,</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.length</span><span class="jsdoc-syntax">) {
162                     </span><span class="jsdoc-comment">// dropdown toggle on the 'a' in BS4?
163                     </span><span class="jsdoc-var">this.triggerEl.select</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'.nav-link'</span><span class="jsdoc-syntax">,</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.first</span><span class="jsdoc-syntax">()</span><span class="jsdoc-var">.addClass</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'dropdown-toggle'</span><span class="jsdoc-syntax">);
164                 } </span><span class="jsdoc-keyword">else </span><span class="jsdoc-syntax">{
165                     </span><span class="jsdoc-var">this.triggerEl.addClass</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'dropdown-toggle'</span><span class="jsdoc-syntax">);
166                 }
167             }
168         }
169
170         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Roo.isTouch</span><span class="jsdoc-syntax">) {
171             </span><span class="jsdoc-var">this.el.on</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'touchstart'  </span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.onTouch</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
172         }
173         </span><span class="jsdoc-var">this.el.on</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'click' </span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.onClick</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
174
175         </span><span class="jsdoc-var">this.el.on</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;mouseover&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.onMouseOver</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
176         </span><span class="jsdoc-var">this.el.on</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;mouseout&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.onMouseOut</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
177
178     },
179
180     </span><span class="jsdoc-var">findTargetItem </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">e</span><span class="jsdoc-syntax">)
181     {
182         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">t </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">e.getTarget</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;.dropdown-menu-item&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.el</span><span class="jsdoc-syntax">,  </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">);
183         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">t</span><span class="jsdoc-syntax">){
184             </span><span class="jsdoc-keyword">return false</span><span class="jsdoc-syntax">;
185         }
186         </span><span class="jsdoc-comment">//Roo.log(t);         Roo.log(t.id);
187         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">t </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">t.id</span><span class="jsdoc-syntax">){
188             </span><span class="jsdoc-comment">//Roo.log(this.menuitems);
189             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this.menuitems.get</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">t.id</span><span class="jsdoc-syntax">);
190
191             </span><span class="jsdoc-comment">//return this.items.get(t.menuItemId);
192         </span><span class="jsdoc-syntax">}
193
194         </span><span class="jsdoc-keyword">return false</span><span class="jsdoc-syntax">;
195     },
196
197     </span><span class="jsdoc-var">onTouch </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">e</span><span class="jsdoc-syntax">)
198     {
199         </span><span class="jsdoc-var">Roo.log</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;menu.onTouch&quot;</span><span class="jsdoc-syntax">);
200         </span><span class="jsdoc-comment">//e.stopEvent(); this make the user popdown broken
201         </span><span class="jsdoc-var">this.onClick</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">e</span><span class="jsdoc-syntax">);
202     },
203
204     </span><span class="jsdoc-var">onClick </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">e</span><span class="jsdoc-syntax">)
205     {
206         </span><span class="jsdoc-var">Roo.log</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;menu.onClick&quot;</span><span class="jsdoc-syntax">);
207
208         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">t </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.findTargetItem</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">e</span><span class="jsdoc-syntax">);
209         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">t </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-var">t.isContainer</span><span class="jsdoc-syntax">){
210             </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
211         }
212         </span><span class="jsdoc-var">Roo.log</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">e</span><span class="jsdoc-syntax">);
213         </span><span class="jsdoc-comment">/*
214         if (Roo.isTouch &amp;&amp; e.type == 'touchstart' &amp;&amp; t.menu  &amp;&amp; !t.disabled) {
215             if(t == this.activeItem &amp;&amp; t.shouldDeactivate(e)){
216                 this.activeItem.deactivate();
217                 delete this.activeItem;
218                 return;
219             }
220             if(t.canActivate){
221                 this.setActiveItem(t, true);
222             }
223             return;
224             
225             
226         }
227         */
228
229         </span><span class="jsdoc-var">Roo.log</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'pass click event'</span><span class="jsdoc-syntax">);
230
231         </span><span class="jsdoc-var">t.onClick</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">e</span><span class="jsdoc-syntax">);
232
233         </span><span class="jsdoc-var">this.fireEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;click&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">t</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">e</span><span class="jsdoc-syntax">);
234
235         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">_this </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">;
236
237         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">t.href.length </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-var">t.href </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">'#'</span><span class="jsdoc-syntax">){
238             (</span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">() { </span><span class="jsdoc-var">_this.hide</span><span class="jsdoc-syntax">(); })</span><span class="jsdoc-var">.defer</span><span class="jsdoc-syntax">(100);
239         }
240
241     },
242
243     </span><span class="jsdoc-var">onMouseOver </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">e</span><span class="jsdoc-syntax">){
244         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">t  </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.findTargetItem</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">e</span><span class="jsdoc-syntax">);
245         </span><span class="jsdoc-comment">//Roo.log(t);
246         //if(t){
247         //    if(t.canActivate &amp;&amp; !t.disabled){
248         //        this.setActiveItem(t, true);
249         //    }
250         //}
251
252         </span><span class="jsdoc-var">this.fireEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;mouseover&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">e</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">t</span><span class="jsdoc-syntax">);
253     },
254     </span><span class="jsdoc-var">isVisible </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
255         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-syntax">!</span><span class="jsdoc-var">this.hidden</span><span class="jsdoc-syntax">;
256     },
257     </span><span class="jsdoc-var">onMouseOut </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">e</span><span class="jsdoc-syntax">){
258         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">t  </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.findTargetItem</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">e</span><span class="jsdoc-syntax">);
259
260         </span><span class="jsdoc-comment">//if(t ){
261         //    if(t == this.activeItem &amp;&amp; t.shouldDeactivate(e)){
262         //        this.activeItem.deactivate();
263         //        delete this.activeItem;
264         //    }
265         //}
266         </span><span class="jsdoc-var">this.fireEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;mouseout&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">e</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">t</span><span class="jsdoc-syntax">);
267     },
268
269
270     </span><span class="jsdoc-comment">/**
271      * Displays this menu relative to another element
272      * @param {String/HTMLElement/Roo.Element} element The element to align to
273      * @param {String} position (optional) The {@link Roo.Element#alignTo} anchor position to use in aligning to
274      * the element (defaults to this.defaultAlign)
275      * @param {Roo.menu.Menu} parentMenu (optional) This menu's parent menu, if applicable (defaults to undefined)
276      */
277     </span><span class="jsdoc-var">show </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">pos</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">parentMenu</span><span class="jsdoc-syntax">)
278     {
279         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">false </span><span class="jsdoc-syntax">=== </span><span class="jsdoc-var">this.fireEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;beforeshow&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">)) {
280             </span><span class="jsdoc-var">Roo.log</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;show canceled&quot;</span><span class="jsdoc-syntax">);
281             </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
282         }
283         </span><span class="jsdoc-var">this.parentMenu </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">parentMenu</span><span class="jsdoc-syntax">;
284         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">this.el</span><span class="jsdoc-syntax">){
285             </span><span class="jsdoc-var">this.render</span><span class="jsdoc-syntax">();
286         }
287         </span><span class="jsdoc-var">this.el.addClass</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'show'</span><span class="jsdoc-syntax">); </span><span class="jsdoc-comment">// show otherwise we do not know how big we are..
288
289         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">xy </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.el.getAlignToXY</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">pos</span><span class="jsdoc-syntax">);
290
291         </span><span class="jsdoc-comment">// bl-tl &lt;&lt; left align  below
292         // tl-bl &lt;&lt; left align 
293
294         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.el.getWidth</span><span class="jsdoc-syntax">() + </span><span class="jsdoc-var">xy</span><span class="jsdoc-syntax">[0] &gt;= </span><span class="jsdoc-var">Roo.lib.Dom.getViewWidth</span><span class="jsdoc-syntax">()){
295             </span><span class="jsdoc-comment">// if it goes to far to the right.. -&gt; align left.
296             </span><span class="jsdoc-var">xy </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.el.getAlignToXY</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.align.replace</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'/l/g'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-string">'r'</span><span class="jsdoc-syntax">))
297         }
298         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">xy</span><span class="jsdoc-syntax">[0] &lt; 0){
299             </span><span class="jsdoc-comment">// was left align - go right?
300             </span><span class="jsdoc-var">xy </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.el.getAlignToXY</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.align.replace</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'/r/g'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-string">'l'</span><span class="jsdoc-syntax">))
301         }
302
303         </span><span class="jsdoc-comment">// goes down the bottom
304         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.el.getHeight</span><span class="jsdoc-syntax">() + </span><span class="jsdoc-var">xy</span><span class="jsdoc-syntax">[1] &gt;= </span><span class="jsdoc-var">Roo.lib.Dom.getViewHeight</span><span class="jsdoc-syntax">() ||
305            </span><span class="jsdoc-var">xy</span><span class="jsdoc-syntax">[1]  &lt; 0 ){
306             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">a </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.align.replace</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'?'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-string">''</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.split</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'-'</span><span class="jsdoc-syntax">);
307             </span><span class="jsdoc-var">xy </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.el.getAlignToXY</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">a</span><span class="jsdoc-syntax">[1]  + </span><span class="jsdoc-string">'-' </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">a</span><span class="jsdoc-syntax">[0] + </span><span class="jsdoc-string">'?'</span><span class="jsdoc-syntax">)
308
309         }
310
311         </span><span class="jsdoc-var">this.showAt</span><span class="jsdoc-syntax">(  </span><span class="jsdoc-var">xy </span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">parentMenu</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">);
312     },
313      </span><span class="jsdoc-comment">/**
314      * Displays this menu at a specific xy position
315      * @param {Array} xyPosition Contains X &amp; Y [x, y] values for the position at which to show the menu (coordinates are page-based)
316      * @param {Roo.menu.Menu} parentMenu (optional) This menu's parent menu, if applicable (defaults to undefined)
317      */
318     </span><span class="jsdoc-var">showAt </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">xy</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">parentMenu</span><span class="jsdoc-syntax">, </span><span class="jsdoc-comment">/* private: */</span><span class="jsdoc-var">_e</span><span class="jsdoc-syntax">){
319         </span><span class="jsdoc-var">this.parentMenu </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">parentMenu</span><span class="jsdoc-syntax">;
320         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">this.el</span><span class="jsdoc-syntax">){
321             </span><span class="jsdoc-var">this.render</span><span class="jsdoc-syntax">();
322         }
323         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">_e </span><span class="jsdoc-syntax">!== </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">){
324             </span><span class="jsdoc-var">this.fireEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;beforeshow&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
325             </span><span class="jsdoc-comment">//xy = this.el.adjustForConstraints(xy);
326         </span><span class="jsdoc-syntax">}
327
328         </span><span class="jsdoc-comment">//this.el.show();
329         </span><span class="jsdoc-var">this.hideMenuItems</span><span class="jsdoc-syntax">();
330         </span><span class="jsdoc-var">this.hidden </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">;
331         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.triggerEl</span><span class="jsdoc-syntax">) {
332             </span><span class="jsdoc-var">this.triggerEl.addClass</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'open'</span><span class="jsdoc-syntax">);
333         }
334
335         </span><span class="jsdoc-var">this.el.addClass</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'show'</span><span class="jsdoc-syntax">);
336
337
338
339         </span><span class="jsdoc-comment">// reassign x when hitting right
340
341         // reassign y when hitting bottom
342
343         // but the list may align on trigger left or trigger top... should it be a properity?
344
345         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.el.getStyle</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'top'</span><span class="jsdoc-syntax">) != </span><span class="jsdoc-string">'auto' </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">this.el.getStyle</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'top'</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.slice</span><span class="jsdoc-syntax">(-1) != </span><span class="jsdoc-string">&quot;%&quot;</span><span class="jsdoc-syntax">){
346             </span><span class="jsdoc-var">this.el.setXY</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">xy</span><span class="jsdoc-syntax">);
347         }
348
349         </span><span class="jsdoc-var">this.focus</span><span class="jsdoc-syntax">();
350         </span><span class="jsdoc-var">this.fireEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;show&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
351     },
352
353     </span><span class="jsdoc-var">focus </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
354         </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
355         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">this.hidden</span><span class="jsdoc-syntax">){
356             </span><span class="jsdoc-var">this.doFocus.defer</span><span class="jsdoc-syntax">(50, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
357         }
358     },
359
360     </span><span class="jsdoc-var">doFocus </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
361         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">this.hidden</span><span class="jsdoc-syntax">){
362             </span><span class="jsdoc-var">this.focusEl.focus</span><span class="jsdoc-syntax">();
363         }
364     },
365
366     </span><span class="jsdoc-comment">/**
367      * Hides this menu and optionally all parent menus
368      * @param {Boolean} deep (optional) True to hide all parent menus recursively, if any (defaults to false)
369      */
370     </span><span class="jsdoc-var">hide </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">deep</span><span class="jsdoc-syntax">)
371     {
372         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">false </span><span class="jsdoc-syntax">=== </span><span class="jsdoc-var">this.fireEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;beforehide&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">)) {
373             </span><span class="jsdoc-var">Roo.log</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;hide canceled&quot;</span><span class="jsdoc-syntax">);
374             </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
375         }
376         </span><span class="jsdoc-var">this.hideMenuItems</span><span class="jsdoc-syntax">();
377         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.el </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">this.isVisible</span><span class="jsdoc-syntax">()){
378
379             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.activeItem</span><span class="jsdoc-syntax">){
380                 </span><span class="jsdoc-var">this.activeItem.deactivate</span><span class="jsdoc-syntax">();
381                 </span><span class="jsdoc-var">this.activeItem </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">null</span><span class="jsdoc-syntax">;
382             }
383             </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.triggerEl</span><span class="jsdoc-syntax">) {
384                 </span><span class="jsdoc-var">this.triggerEl.removeClass</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'open'</span><span class="jsdoc-syntax">);
385             }
386
387             </span><span class="jsdoc-var">this.el.removeClass</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'show'</span><span class="jsdoc-syntax">);
388             </span><span class="jsdoc-var">this.hidden </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">;
389             </span><span class="jsdoc-var">this.fireEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;hide&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
390         }
391         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">deep </span><span class="jsdoc-syntax">=== </span><span class="jsdoc-keyword">true </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">this.parentMenu</span><span class="jsdoc-syntax">){
392             </span><span class="jsdoc-var">this.parentMenu.hide</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">);
393         }
394     },
395
396     </span><span class="jsdoc-var">onTriggerClick </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">e</span><span class="jsdoc-syntax">)
397     {
398         </span><span class="jsdoc-var">Roo.log</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'trigger click'</span><span class="jsdoc-syntax">);
399
400         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">target </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">e.getTarget</span><span class="jsdoc-syntax">();
401
402         </span><span class="jsdoc-var">Roo.log</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">target.nodeName.toLowerCase</span><span class="jsdoc-syntax">());
403
404         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">target.nodeName.toLowerCase</span><span class="jsdoc-syntax">() === </span><span class="jsdoc-string">'i'</span><span class="jsdoc-syntax">){
405             </span><span class="jsdoc-var">e.preventDefault</span><span class="jsdoc-syntax">();
406         }
407
408     },
409
410     </span><span class="jsdoc-var">onTriggerPress  </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">e</span><span class="jsdoc-syntax">)
411     {
412         </span><span class="jsdoc-var">Roo.log</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'trigger press'</span><span class="jsdoc-syntax">);
413         </span><span class="jsdoc-comment">//Roo.log(e.getTarget());
414        // Roo.log(this.triggerEl.dom);
415
416         // trigger only occurs on normal menu's -- if it's a treeview or dropdown... do not hide/show..
417         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">pel </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.get</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">e.getTarget</span><span class="jsdoc-syntax">());
418         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">pel.findParent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'.dropdown-menu'</span><span class="jsdoc-syntax">) || </span><span class="jsdoc-var">pel.findParent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'.treeview-menu'</span><span class="jsdoc-syntax">) ) {
419             </span><span class="jsdoc-var">Roo.log</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'is treeview or dropdown?'</span><span class="jsdoc-syntax">);
420             </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
421         }
422
423         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">e.getTarget</span><span class="jsdoc-syntax">()</span><span class="jsdoc-var">.nodeName.toLowerCase</span><span class="jsdoc-syntax">() !== </span><span class="jsdoc-string">'i' </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">this.isLink</span><span class="jsdoc-syntax">){
424             </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
425         }
426
427         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.isVisible</span><span class="jsdoc-syntax">()) {
428             </span><span class="jsdoc-var">Roo.log</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'hide'</span><span class="jsdoc-syntax">);
429             </span><span class="jsdoc-var">this.hide</span><span class="jsdoc-syntax">();
430         } </span><span class="jsdoc-keyword">else </span><span class="jsdoc-syntax">{
431             </span><span class="jsdoc-var">Roo.log</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'show'</span><span class="jsdoc-syntax">);
432
433             </span><span class="jsdoc-var">this.show</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.triggerEl</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.align</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">);
434         }
435
436         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.stopEvent </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-var">e.getTarget</span><span class="jsdoc-syntax">()</span><span class="jsdoc-var">.nodeName.toLowerCase</span><span class="jsdoc-syntax">() === </span><span class="jsdoc-string">'i'</span><span class="jsdoc-syntax">){
437             </span><span class="jsdoc-var">e.stopEvent</span><span class="jsdoc-syntax">();
438         }
439
440     },
441
442
443     </span><span class="jsdoc-var">hideMenuItems </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
444     {
445         </span><span class="jsdoc-var">Roo.log</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;hide Menu Items&quot;</span><span class="jsdoc-syntax">);
446         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">this.el</span><span class="jsdoc-syntax">) {
447             </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
448         }
449
450         </span><span class="jsdoc-var">this.el.select</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'.open'</span><span class="jsdoc-syntax">,</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.each</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">aa</span><span class="jsdoc-syntax">) {
451
452             </span><span class="jsdoc-var">aa.removeClass</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'open'</span><span class="jsdoc-syntax">);
453
454         });
455     },
456     </span><span class="jsdoc-var">addxtypeChild </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">tree</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">cntr</span><span class="jsdoc-syntax">) {
457         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">comp</span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.bootstrap.menu.Menu.superclass.addxtypeChild.call</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">tree</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">cntr</span><span class="jsdoc-syntax">);
458
459         </span><span class="jsdoc-var">this.menuitems.add</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">comp</span><span class="jsdoc-syntax">);
460         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">comp</span><span class="jsdoc-syntax">;
461
462     },
463     </span><span class="jsdoc-var">getEl </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
464     {
465         </span><span class="jsdoc-var">Roo.log</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.el</span><span class="jsdoc-syntax">);
466         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this.el</span><span class="jsdoc-syntax">;
467     },
468
469     </span><span class="jsdoc-var">clear </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
470     {
471         </span><span class="jsdoc-var">this.getEl</span><span class="jsdoc-syntax">()</span><span class="jsdoc-var">.dom.innerHTML </span><span class="jsdoc-syntax">= </span><span class="jsdoc-string">''</span><span class="jsdoc-syntax">;
472         </span><span class="jsdoc-var">this.menuitems.clear</span><span class="jsdoc-syntax">();
473     }
474 });
475
476
477  </span></code></body></html>