projects / roojs1 / blob
? search:
summary | shortlog | log | commit | commitdiff | tree
history | raw | HEAD
Fix #6201 - Category select
[roojs1] / docs / src / Roo_menu_Menu.js.html
1 <html><head><title>Roo/menu/Menu.js</title><link rel="stylesheet" type="text/css" href="../../css/highlight-js.css"/></head><body class="highlightpage"><code class="jsdoc-pretty"><span class="jsdoc-comment">/*
2  * Based on:
3  * Ext JS Library 1.1.1
4  * Copyright(c) 2006-2007, Ext JS, LLC.
5  *
6  * Originally Released Under LGPL - original licence link has changed is not relivant.
7  *
8  * Fork - LGPL
9  * &lt;script type=&quot;text/javascript&quot;&gt;
10  */
11
12 /**
13  * @class Roo.menu.Menu
14  * @extends Roo.util.Observable
15  * A menu object.  This is the container to which you add all other menu items.  Menu can also serve a as a base class
16  * when you want a specialzed menu based off of another component (like {@link Roo.menu.DateMenu} for example).
17  * @constructor
18  * Creates a new Menu
19  * @param {Object} config Configuration options
20  */
21 </span><span class="jsdoc-var">Roo.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">){
22
23     </span><span class="jsdoc-var">Roo.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">);
24
25     </span><span class="jsdoc-var">this.id </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.id </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-var">Roo.id</span><span class="jsdoc-syntax">();
26     </span><span class="jsdoc-var">this.addEvents</span><span class="jsdoc-syntax">({
27         </span><span class="jsdoc-comment">/**
28          * @event beforeshow
29          * Fires before this menu is displayed
30          * @param {Roo.menu.Menu} this
31          */
32         </span><span class="jsdoc-var">beforeshow </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
33         </span><span class="jsdoc-comment">/**
34          * @event beforehide
35          * Fires before this menu is hidden
36          * @param {Roo.menu.Menu} this
37          */
38         </span><span class="jsdoc-var">beforehide </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
39         </span><span class="jsdoc-comment">/**
40          * @event show
41          * Fires after this menu is displayed
42          * @param {Roo.menu.Menu} this
43          */
44         </span><span class="jsdoc-var">show </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
45         </span><span class="jsdoc-comment">/**
46          * @event hide
47          * Fires after this menu is hidden
48          * @param {Roo.menu.Menu} this
49          */
50         </span><span class="jsdoc-var">hide </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
51         </span><span class="jsdoc-comment">/**
52          * @event click
53          * Fires when this menu is clicked (or when the enter key is pressed while it is active)
54          * @param {Roo.menu.Menu} this
55          * @param {Roo.menu.Item} menuItem The menu item that was clicked
56          * @param {Roo.EventObject} e
57          */
58         </span><span class="jsdoc-var">click </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
59         </span><span class="jsdoc-comment">/**
60          * @event mouseover
61          * Fires when the mouse is hovering over this menu
62          * @param {Roo.menu.Menu} this
63          * @param {Roo.EventObject} e
64          * @param {Roo.menu.Item} menuItem The menu item that was clicked
65          */
66         </span><span class="jsdoc-var">mouseover </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
67         </span><span class="jsdoc-comment">/**
68          * @event mouseout
69          * Fires when the mouse exits this menu
70          * @param {Roo.menu.Menu} this
71          * @param {Roo.EventObject} e
72          * @param {Roo.menu.Item} menuItem The menu item that was clicked
73          */
74         </span><span class="jsdoc-var">mouseout </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
75         </span><span class="jsdoc-comment">/**
76          * @event itemclick
77          * Fires when a menu item contained in this menu is clicked
78          * @param {Roo.menu.BaseItem} baseItem The BaseItem that was clicked
79          * @param {Roo.EventObject} e
80          */
81         </span><span class="jsdoc-var">itemclick</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true
82     </span><span class="jsdoc-syntax">});
83     </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.registerMenu</span><span class="jsdoc-syntax">) {
84         </span><span class="jsdoc-var">Roo.menu.MenuMgr.register</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
85     }
86
87     </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">mis </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.items</span><span class="jsdoc-syntax">;
88     </span><span class="jsdoc-var">this.items </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">new </span><span class="jsdoc-var">Roo.util.MixedCollection</span><span class="jsdoc-syntax">();
89     </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">mis</span><span class="jsdoc-syntax">){
90         </span><span class="jsdoc-var">this.add.apply</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">mis</span><span class="jsdoc-syntax">);
91     }
92 };
93
94 </span><span class="jsdoc-var">Roo.extend</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Roo.menu.Menu</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">Roo.util.Observable</span><span class="jsdoc-syntax">, {
95     </span><span class="jsdoc-comment">/**
96      * @cfg {Number} minWidth The minimum width of the menu in pixels (defaults to 120)
97      */
98     </span><span class="jsdoc-var">minWidth </span><span class="jsdoc-syntax">: 120,
99     </span><span class="jsdoc-comment">/**
100      * @cfg {Boolean/String} shadow True or &quot;sides&quot; for the default effect, &quot;frame&quot; for 4-way shadow, and &quot;drop&quot;
101      * for bottom-right shadow (defaults to &quot;sides&quot;)
102      */
103     </span><span class="jsdoc-var">shadow </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;sides&quot;</span><span class="jsdoc-syntax">,
104     </span><span class="jsdoc-comment">/**
105      * @cfg {String} subMenuAlign The {@link Roo.Element#alignTo} anchor position value to use for submenus of
106      * this menu (defaults to &quot;tl-tr?&quot;)
107      */
108     </span><span class="jsdoc-var">subMenuAlign </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;tl-tr?&quot;</span><span class="jsdoc-syntax">,
109     </span><span class="jsdoc-comment">/**
110      * @cfg {String} defaultAlign The default {@link Roo.Element#alignTo) anchor position value for this menu
111      * relative to its element of origin (defaults to &quot;tl-bl?&quot;)
112      */
113     </span><span class="jsdoc-var">defaultAlign </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;tl-bl?&quot;</span><span class="jsdoc-syntax">,
114     </span><span class="jsdoc-comment">/**
115      * @cfg {Boolean} allowOtherMenus True to allow multiple menus to be displayed at the same time (defaults to false)
116      */
117     </span><span class="jsdoc-var">allowOtherMenus </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
118     </span><span class="jsdoc-comment">/**
119      * @cfg {Boolean} registerMenu True (default) - means that clicking on screen etc. hides it.
120      */
121     </span><span class="jsdoc-var">registerMenu </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
122
123     </span><span class="jsdoc-var">hidden</span><span class="jsdoc-syntax">:</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
124
125     </span><span class="jsdoc-comment">// private
126     </span><span class="jsdoc-var">render </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
127         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.el</span><span class="jsdoc-syntax">){
128             </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
129         }
130         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">el </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.el </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">new </span><span class="jsdoc-var">Roo.Layer</span><span class="jsdoc-syntax">({
131             </span><span class="jsdoc-var">cls</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;x-menu&quot;</span><span class="jsdoc-syntax">,
132             </span><span class="jsdoc-var">shadow</span><span class="jsdoc-syntax">:</span><span class="jsdoc-var">this.shadow</span><span class="jsdoc-syntax">,
133             </span><span class="jsdoc-var">constrain</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
134             </span><span class="jsdoc-var">parentEl</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this.parentEl </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-var">document.body</span><span class="jsdoc-syntax">,
135             </span><span class="jsdoc-var">zindex</span><span class="jsdoc-syntax">:15000
136         });
137
138         </span><span class="jsdoc-var">this.keyNav </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">new </span><span class="jsdoc-var">Roo.menu.MenuNav</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
139
140         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.plain</span><span class="jsdoc-syntax">){
141             </span><span class="jsdoc-var">el.addClass</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;x-menu-plain&quot;</span><span class="jsdoc-syntax">);
142         }
143         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.cls</span><span class="jsdoc-syntax">){
144             </span><span class="jsdoc-var">el.addClass</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.cls</span><span class="jsdoc-syntax">);
145         }
146         </span><span class="jsdoc-comment">// generic focus element
147         </span><span class="jsdoc-var">this.focusEl </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">el.createChild</span><span class="jsdoc-syntax">({
148             </span><span class="jsdoc-var">tag</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;a&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">cls</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;x-menu-focus&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">href</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;#&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">onclick</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;return false;&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">tabIndex</span><span class="jsdoc-syntax">:</span><span class="jsdoc-string">&quot;-1&quot;
149         </span><span class="jsdoc-syntax">});
150         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">ul </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">el.createChild</span><span class="jsdoc-syntax">({</span><span class="jsdoc-var">tag</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;ul&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">cls</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;x-menu-list&quot;</span><span class="jsdoc-syntax">});
151         </span><span class="jsdoc-comment">//disabling touch- as it's causing issues ..
152         //ul.on(Roo.isTouch ? 'touchstart' : 'click'   , this.onClick, this);
153         </span><span class="jsdoc-var">ul.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">);
154
155
156         </span><span class="jsdoc-var">ul.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">);
157         </span><span class="jsdoc-var">ul.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">);
158         </span><span class="jsdoc-var">this.items.each</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">item</span><span class="jsdoc-syntax">){
159             </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">item.hidden</span><span class="jsdoc-syntax">) {
160                 </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
161             }
162
163             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">li </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">document.createElement</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;li&quot;</span><span class="jsdoc-syntax">);
164             </span><span class="jsdoc-var">li.className </span><span class="jsdoc-syntax">= </span><span class="jsdoc-string">&quot;x-menu-list-item&quot;</span><span class="jsdoc-syntax">;
165             </span><span class="jsdoc-var">ul.dom.appendChild</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">li</span><span class="jsdoc-syntax">);
166             </span><span class="jsdoc-var">item.render</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">li</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
167         }, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
168         </span><span class="jsdoc-var">this.ul </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">ul</span><span class="jsdoc-syntax">;
169         </span><span class="jsdoc-var">this.autoWidth</span><span class="jsdoc-syntax">();
170     },
171
172     </span><span class="jsdoc-comment">// private
173     </span><span class="jsdoc-var">autoWidth </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
174         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">el </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.el</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">ul </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.ul</span><span class="jsdoc-syntax">;
175         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">){
176             </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
177         }
178         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">w </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.width</span><span class="jsdoc-syntax">;
179         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">w</span><span class="jsdoc-syntax">){
180             </span><span class="jsdoc-var">el.setWidth</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">w</span><span class="jsdoc-syntax">);
181         }</span><span class="jsdoc-keyword">else if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Roo.isIE</span><span class="jsdoc-syntax">){
182             </span><span class="jsdoc-var">el.setWidth</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.minWidth</span><span class="jsdoc-syntax">);
183             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">t </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">el.dom.offsetWidth</span><span class="jsdoc-syntax">; </span><span class="jsdoc-comment">// force recalc
184             </span><span class="jsdoc-var">el.setWidth</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">ul.getWidth</span><span class="jsdoc-syntax">()+</span><span class="jsdoc-var">el.getFrameWidth</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;lr&quot;</span><span class="jsdoc-syntax">));
185         }
186     },
187
188     </span><span class="jsdoc-comment">// private
189     </span><span class="jsdoc-var">delayAutoWidth </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
190         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.rendered</span><span class="jsdoc-syntax">){
191             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">this.awTask</span><span class="jsdoc-syntax">){
192                 </span><span class="jsdoc-var">this.awTask </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">new </span><span class="jsdoc-var">Roo.util.DelayedTask</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.autoWidth</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
193             }
194             </span><span class="jsdoc-var">this.awTask.delay</span><span class="jsdoc-syntax">(20);
195         }
196     },
197
198     </span><span class="jsdoc-comment">// private
199     </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">){
200         </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;.x-menu-list-item&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.ul</span><span class="jsdoc-syntax">,  </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">);
201         </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.menuItemId</span><span class="jsdoc-syntax">){
202             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this.items.get</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">t.menuItemId</span><span class="jsdoc-syntax">);
203         }
204     },
205
206     </span><span class="jsdoc-comment">// private
207     </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">){
208         </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">);
209         </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">);
210         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">t</span><span class="jsdoc-syntax">){
211             </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
212         }
213         </span><span class="jsdoc-var">Roo.log</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">e</span><span class="jsdoc-syntax">);
214         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Roo.isTouch </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">e.type </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">'touchstart' </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">t.menu  </span><span class="jsdoc-syntax">&amp;&amp; !</span><span class="jsdoc-var">t.disabled</span><span class="jsdoc-syntax">) {
215             </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">this.activeItem </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">t.shouldDeactivate</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">e</span><span class="jsdoc-syntax">)){
216                 </span><span class="jsdoc-var">this.activeItem.deactivate</span><span class="jsdoc-syntax">();
217                 </span><span class="jsdoc-keyword">delete </span><span class="jsdoc-var">this.activeItem</span><span class="jsdoc-syntax">;
218                 </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
219             }
220             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">t.canActivate</span><span class="jsdoc-syntax">){
221                 </span><span class="jsdoc-var">this.setActiveItem</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">t</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">);
222             }
223             </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
224
225
226         }
227
228         </span><span class="jsdoc-var">t.onClick</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">e</span><span class="jsdoc-syntax">);
229         </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">);
230     },
231
232     </span><span class="jsdoc-comment">// private
233     </span><span class="jsdoc-var">setActiveItem </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">item</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">autoExpand</span><span class="jsdoc-syntax">){
234         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">item </span><span class="jsdoc-syntax">!= </span><span class="jsdoc-var">this.activeItem</span><span class="jsdoc-syntax">){
235             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.activeItem</span><span class="jsdoc-syntax">){
236                 </span><span class="jsdoc-var">this.activeItem.deactivate</span><span class="jsdoc-syntax">();
237             }
238             </span><span class="jsdoc-var">this.activeItem </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">item</span><span class="jsdoc-syntax">;
239             </span><span class="jsdoc-var">item.activate</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">autoExpand</span><span class="jsdoc-syntax">);
240         }</span><span class="jsdoc-keyword">else if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">autoExpand</span><span class="jsdoc-syntax">){
241             </span><span class="jsdoc-var">item.expandMenu</span><span class="jsdoc-syntax">();
242         }
243     },
244
245     </span><span class="jsdoc-comment">// private
246     </span><span class="jsdoc-var">tryActivate </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">start</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">step</span><span class="jsdoc-syntax">){
247         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">items </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.items</span><span class="jsdoc-syntax">;
248         </span><span class="jsdoc-keyword">for</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">i </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">start</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">len </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">items.length</span><span class="jsdoc-syntax">; </span><span class="jsdoc-var">i </span><span class="jsdoc-syntax">&gt;= 0 &amp;&amp; </span><span class="jsdoc-var">i </span><span class="jsdoc-syntax">&lt; </span><span class="jsdoc-var">len</span><span class="jsdoc-syntax">; </span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">+= </span><span class="jsdoc-var">step</span><span class="jsdoc-syntax">){
249             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">item </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">items.get</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">);
250             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">item.disabled </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">item.canActivate</span><span class="jsdoc-syntax">){
251                 </span><span class="jsdoc-var">this.setActiveItem</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">item</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">);
252                 </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">item</span><span class="jsdoc-syntax">;
253             }
254         }
255         </span><span class="jsdoc-keyword">return false</span><span class="jsdoc-syntax">;
256     },
257
258     </span><span class="jsdoc-comment">// private
259     </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">){
260         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">t</span><span class="jsdoc-syntax">;
261         </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">this.findTargetItem</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">e</span><span class="jsdoc-syntax">)){
262             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">t.canActivate </span><span class="jsdoc-syntax">&amp;&amp; !</span><span class="jsdoc-var">t.disabled</span><span class="jsdoc-syntax">){
263                 </span><span class="jsdoc-var">this.setActiveItem</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">t</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">);
264             }
265         }
266         </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">);
267     },
268
269     </span><span class="jsdoc-comment">// private
270     </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">){
271         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">t</span><span class="jsdoc-syntax">;
272         </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">this.findTargetItem</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">e</span><span class="jsdoc-syntax">)){
273             </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">this.activeItem </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">t.shouldDeactivate</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">e</span><span class="jsdoc-syntax">)){
274                 </span><span class="jsdoc-var">this.activeItem.deactivate</span><span class="jsdoc-syntax">();
275                 </span><span class="jsdoc-keyword">delete </span><span class="jsdoc-var">this.activeItem</span><span class="jsdoc-syntax">;
276             }
277         }
278         </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">);
279     },
280
281     </span><span class="jsdoc-comment">/**
282      * Read-only.  Returns true if the menu is currently displayed, else false.
283      * @type Boolean
284      */
285     </span><span class="jsdoc-var">isVisible </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
286         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this.el </span><span class="jsdoc-syntax">&amp;&amp; !</span><span class="jsdoc-var">this.hidden</span><span class="jsdoc-syntax">;
287     },
288
289     </span><span class="jsdoc-comment">/**
290      * Displays this menu relative to another element
291      * @param {String/HTMLElement/Roo.Element} element The element to align to
292      * @param {String} position (optional) The {@link Roo.Element#alignTo} anchor position to use in aligning to
293      * the element (defaults to this.defaultAlign)
294      * @param {Roo.menu.Menu} parentMenu (optional) This menu's parent menu, if applicable (defaults to undefined)
295      */
296     </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">){
297         </span><span class="jsdoc-var">this.parentMenu </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">parentMenu</span><span class="jsdoc-syntax">;
298         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">this.el</span><span class="jsdoc-syntax">){
299             </span><span class="jsdoc-var">this.render</span><span class="jsdoc-syntax">();
300         }
301         </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">);
302         </span><span class="jsdoc-var">this.showAt</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">|| </span><span class="jsdoc-var">this.defaultAlign</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">);
303     },
304
305     </span><span class="jsdoc-comment">/**
306      * Displays this menu at a specific xy position
307      * @param {Array} xyPosition Contains X &amp; Y [x, y] values for the position at which to show the menu (coordinates are page-based)
308      * @param {Roo.menu.Menu} parentMenu (optional) This menu's parent menu, if applicable (defaults to undefined)
309      */
310     </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">){
311         </span><span class="jsdoc-var">this.parentMenu </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">parentMenu</span><span class="jsdoc-syntax">;
312         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">this.el</span><span class="jsdoc-syntax">){
313             </span><span class="jsdoc-var">this.render</span><span class="jsdoc-syntax">();
314         }
315         </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">){
316             </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">);
317             </span><span class="jsdoc-var">xy </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.el.adjustForConstraints</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">xy</span><span class="jsdoc-syntax">);
318         }
319         </span><span class="jsdoc-var">this.el.setXY</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">xy</span><span class="jsdoc-syntax">);
320         </span><span class="jsdoc-var">this.el.show</span><span class="jsdoc-syntax">();
321         </span><span class="jsdoc-var">this.hidden </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">;
322         </span><span class="jsdoc-var">this.focus</span><span class="jsdoc-syntax">();
323         </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">);
324     },
325
326     </span><span class="jsdoc-var">focus </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
327         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">this.hidden</span><span class="jsdoc-syntax">){
328             </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">);
329         }
330     },
331
332     </span><span class="jsdoc-var">doFocus </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
333         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">this.hidden</span><span class="jsdoc-syntax">){
334             </span><span class="jsdoc-var">this.focusEl.focus</span><span class="jsdoc-syntax">();
335         }
336     },
337
338     </span><span class="jsdoc-comment">/**
339      * Hides this menu and optionally all parent menus
340      * @param {Boolean} deep (optional) True to hide all parent menus recursively, if any (defaults to false)
341      */
342     </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">){
343         </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">()){
344             </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">);
345             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.activeItem</span><span class="jsdoc-syntax">){
346                 </span><span class="jsdoc-var">this.activeItem.deactivate</span><span class="jsdoc-syntax">();
347                 </span><span class="jsdoc-var">this.activeItem </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">null</span><span class="jsdoc-syntax">;
348             }
349             </span><span class="jsdoc-var">this.el.hide</span><span class="jsdoc-syntax">();
350             </span><span class="jsdoc-var">this.hidden </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">;
351             </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">);
352         }
353         </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">){
354             </span><span class="jsdoc-var">this.parentMenu.hide</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">);
355         }
356     },
357
358     </span><span class="jsdoc-comment">/**
359      * Addds one or more items of any type supported by the Menu class, or that can be converted into menu items.
360      * Any of the following are valid:
361      * &lt;ul&gt;
362      * &lt;li&gt;Any menu item object based on {@link Roo.menu.Item}&lt;/li&gt;
363      * &lt;li&gt;An HTMLElement object which will be converted to a menu item&lt;/li&gt;
364      * &lt;li&gt;A menu item config object that will be created as a new menu item&lt;/li&gt;
365      * &lt;li&gt;A string, which can either be '-' or 'separator' to add a menu separator, otherwise
366      * it will be converted into a {@link Roo.menu.TextItem} and added&lt;/li&gt;
367      * &lt;/ul&gt;
368      * Usage:
369      * &lt;pre&gt;&lt;code&gt;
370 // Create the menu
371 var menu = new Roo.menu.Menu();
372
373 // Create a menu item to add by reference
374 var menuItem = new Roo.menu.Item({ text: 'New Item!' });
375
376 // Add a bunch of items at once using different methods.
377 // Only the last item added will be returned.
378 var item = menu.add(
379     menuItem,                // add existing item by ref
380     'Dynamic Item',          // new TextItem
381     '-',                     // new separator
382     { text: 'Config Item' }  // new item by config
383 );
384 &lt;/code&gt;&lt;/pre&gt;
385      * @param {Mixed} args One or more menu items, menu item configs or other objects that can be converted to menu items
386      * @return {Roo.menu.Item} The menu item that was added, or the last one if multiple items were added
387      */
388     </span><span class="jsdoc-var">add </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
389         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">a </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">arguments</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">l </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">a.length</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">item</span><span class="jsdoc-syntax">;
390         </span><span class="jsdoc-keyword">for</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">i </span><span class="jsdoc-syntax">= 0; </span><span class="jsdoc-var">i </span><span class="jsdoc-syntax">&lt; </span><span class="jsdoc-var">l</span><span class="jsdoc-syntax">; </span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">++){
391             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">el </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">a</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">];
392             </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">((</span><span class="jsdoc-keyword">typeof</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">) == </span><span class="jsdoc-string">&quot;object&quot;</span><span class="jsdoc-syntax">) &amp;&amp; </span><span class="jsdoc-var">el.xtype </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">el.xns</span><span class="jsdoc-syntax">) {
393                 </span><span class="jsdoc-var">el </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.factory</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">Roo.menu</span><span class="jsdoc-syntax">);
394             }
395
396             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el.render</span><span class="jsdoc-syntax">){ </span><span class="jsdoc-comment">// some kind of Item
397                 </span><span class="jsdoc-var">item </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.addItem</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">);
398             }</span><span class="jsdoc-keyword">else if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">typeof </span><span class="jsdoc-var">el </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">&quot;string&quot;</span><span class="jsdoc-syntax">){ </span><span class="jsdoc-comment">// string
399                 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">&quot;separator&quot; </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-var">el </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">&quot;-&quot;</span><span class="jsdoc-syntax">){
400                     </span><span class="jsdoc-var">item </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.addSeparator</span><span class="jsdoc-syntax">();
401                 }</span><span class="jsdoc-keyword">else</span><span class="jsdoc-syntax">{
402                     </span><span class="jsdoc-var">item </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.addText</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">);
403                 }
404             }</span><span class="jsdoc-keyword">else if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el.tagName </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-var">el.el</span><span class="jsdoc-syntax">){ </span><span class="jsdoc-comment">// element
405                 </span><span class="jsdoc-var">item </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.addElement</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">);
406             }</span><span class="jsdoc-keyword">else if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">typeof </span><span class="jsdoc-var">el </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">&quot;object&quot;</span><span class="jsdoc-syntax">){ </span><span class="jsdoc-comment">// must be menu item config?
407                 </span><span class="jsdoc-var">item </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.addMenuItem</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">);
408             }
409         }
410         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">item</span><span class="jsdoc-syntax">;
411     },
412
413     </span><span class="jsdoc-comment">/**
414      * Returns this menu's underlying {@link Roo.Element} object
415      * @return {Roo.Element} The element
416      */
417     </span><span class="jsdoc-var">getEl </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
418         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">this.el</span><span class="jsdoc-syntax">){
419             </span><span class="jsdoc-var">this.render</span><span class="jsdoc-syntax">();
420         }
421         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this.el</span><span class="jsdoc-syntax">;
422     },
423
424     </span><span class="jsdoc-comment">/**
425      * Adds a separator bar to the menu
426      * @return {Roo.menu.Item} The menu item that was added
427      */
428     </span><span class="jsdoc-var">addSeparator </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
429         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this.addItem</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">new </span><span class="jsdoc-var">Roo.menu.Separator</span><span class="jsdoc-syntax">());
430     },
431
432     </span><span class="jsdoc-comment">/**
433      * Adds an {@link Roo.Element} object to the menu
434      * @param {String/HTMLElement/Roo.Element} el The element or DOM node to add, or its id
435      * @return {Roo.menu.Item} The menu item that was added
436      */
437     </span><span class="jsdoc-var">addElement </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">){
438         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this.addItem</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">new </span><span class="jsdoc-var">Roo.menu.BaseItem</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">));
439     },
440
441     </span><span class="jsdoc-comment">/**
442      * Adds an existing object based on {@link Roo.menu.Item} to the menu
443      * @param {Roo.menu.Item} item The menu item to add
444      * @return {Roo.menu.Item} The menu item that was added
445      */
446     </span><span class="jsdoc-var">addItem </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">item</span><span class="jsdoc-syntax">){
447         </span><span class="jsdoc-var">this.items.add</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">item</span><span class="jsdoc-syntax">);
448         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.ul</span><span class="jsdoc-syntax">){
449             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">li </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">document.createElement</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;li&quot;</span><span class="jsdoc-syntax">);
450             </span><span class="jsdoc-var">li.className </span><span class="jsdoc-syntax">= </span><span class="jsdoc-string">&quot;x-menu-list-item&quot;</span><span class="jsdoc-syntax">;
451             </span><span class="jsdoc-var">this.ul.dom.appendChild</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">li</span><span class="jsdoc-syntax">);
452             </span><span class="jsdoc-var">item.render</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">li</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
453             </span><span class="jsdoc-var">this.delayAutoWidth</span><span class="jsdoc-syntax">();
454         }
455         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">item</span><span class="jsdoc-syntax">;
456     },
457
458     </span><span class="jsdoc-comment">/**
459      * Creates a new {@link Roo.menu.Item} based an the supplied config object and adds it to the menu
460      * @param {Object} config A MenuItem config object
461      * @return {Roo.menu.Item} The menu item that was added
462      */
463     </span><span class="jsdoc-var">addMenuItem </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">){
464         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!(</span><span class="jsdoc-var">config </span><span class="jsdoc-keyword">instanceof </span><span class="jsdoc-var">Roo.menu.Item</span><span class="jsdoc-syntax">)){
465             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">typeof </span><span class="jsdoc-var">config.checked </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">&quot;boolean&quot;</span><span class="jsdoc-syntax">){ </span><span class="jsdoc-comment">// must be check menu item config?
466                 </span><span class="jsdoc-var">config </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">new </span><span class="jsdoc-var">Roo.menu.CheckItem</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">config</span><span class="jsdoc-syntax">);
467             }</span><span class="jsdoc-keyword">else</span><span class="jsdoc-syntax">{
468                 </span><span class="jsdoc-var">config </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">new </span><span class="jsdoc-var">Roo.menu.Item</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">config</span><span class="jsdoc-syntax">);
469             }
470         }
471         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this.addItem</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">config</span><span class="jsdoc-syntax">);
472     },
473
474     </span><span class="jsdoc-comment">/**
475      * Creates a new {@link Roo.menu.TextItem} with the supplied text and adds it to the menu
476      * @param {String} text The text to display in the menu item
477      * @return {Roo.menu.Item} The menu item that was added
478      */
479     </span><span class="jsdoc-var">addText </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">text</span><span class="jsdoc-syntax">){
480         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this.addItem</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">new </span><span class="jsdoc-var">Roo.menu.TextItem</span><span class="jsdoc-syntax">({ </span><span class="jsdoc-var">text </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">text </span><span class="jsdoc-syntax">}));
481     },
482
483     </span><span class="jsdoc-comment">/**
484      * Inserts an existing object based on {@link Roo.menu.Item} to the menu at a specified index
485      * @param {Number} index The index in the menu's list of current items where the new item should be inserted
486      * @param {Roo.menu.Item} item The menu item to add
487      * @return {Roo.menu.Item} The menu item that was added
488      */
489     </span><span class="jsdoc-var">insert </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">index</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">item</span><span class="jsdoc-syntax">){
490         </span><span class="jsdoc-var">this.items.insert</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">index</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">item</span><span class="jsdoc-syntax">);
491         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.ul</span><span class="jsdoc-syntax">){
492             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">li </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">document.createElement</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;li&quot;</span><span class="jsdoc-syntax">);
493             </span><span class="jsdoc-var">li.className </span><span class="jsdoc-syntax">= </span><span class="jsdoc-string">&quot;x-menu-list-item&quot;</span><span class="jsdoc-syntax">;
494             </span><span class="jsdoc-var">this.ul.dom.insertBefore</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">li</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.ul.dom.childNodes</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">index</span><span class="jsdoc-syntax">]);
495             </span><span class="jsdoc-var">item.render</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">li</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
496             </span><span class="jsdoc-var">this.delayAutoWidth</span><span class="jsdoc-syntax">();
497         }
498         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">item</span><span class="jsdoc-syntax">;
499     },
500
501     </span><span class="jsdoc-comment">/**
502      * Removes an {@link Roo.menu.Item} from the menu and destroys the object
503      * @param {Roo.menu.Item} item The menu item to remove
504      */
505     </span><span class="jsdoc-var">remove </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">item</span><span class="jsdoc-syntax">){
506         </span><span class="jsdoc-var">this.items.removeKey</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">item.id</span><span class="jsdoc-syntax">);
507         </span><span class="jsdoc-var">item.destroy</span><span class="jsdoc-syntax">();
508     },
509
510     </span><span class="jsdoc-comment">/**
511      * Removes and destroys all items in the menu
512      */
513     </span><span class="jsdoc-var">removeAll </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
514         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">f</span><span class="jsdoc-syntax">;
515         </span><span class="jsdoc-keyword">while</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">f </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.items.first</span><span class="jsdoc-syntax">()){
516             </span><span class="jsdoc-var">this.remove</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">f</span><span class="jsdoc-syntax">);
517         }
518     }
519 });
520
521 </span><span class="jsdoc-comment">// MenuNav is a private utility class used internally by the Menu
522 </span><span class="jsdoc-var">Roo.menu.MenuNav </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">menu</span><span class="jsdoc-syntax">){
523     </span><span class="jsdoc-var">Roo.menu.MenuNav.superclass.constructor.call</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">menu.el</span><span class="jsdoc-syntax">);
524     </span><span class="jsdoc-var">this.scope </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.menu </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">menu</span><span class="jsdoc-syntax">;
525 };
526
527 </span><span class="jsdoc-var">Roo.extend</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Roo.menu.MenuNav</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">Roo.KeyNav</span><span class="jsdoc-syntax">, {
528     </span><span class="jsdoc-var">doRelay </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">, </span><span class="jsdoc-var">h</span><span class="jsdoc-syntax">){
529         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">k </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">e.getKey</span><span class="jsdoc-syntax">();
530         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">this.menu.activeItem </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">e.isNavKeyPress</span><span class="jsdoc-syntax">() &amp;&amp; </span><span class="jsdoc-var">k </span><span class="jsdoc-syntax">!= </span><span class="jsdoc-var">e.SPACE </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">k </span><span class="jsdoc-syntax">!= </span><span class="jsdoc-var">e.RETURN</span><span class="jsdoc-syntax">){
531             </span><span class="jsdoc-var">this.menu.tryActivate</span><span class="jsdoc-syntax">(0, 1);
532             </span><span class="jsdoc-keyword">return false</span><span class="jsdoc-syntax">;
533         }
534         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">h.call</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.scope </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">this.menu</span><span class="jsdoc-syntax">);
535     },
536
537     </span><span class="jsdoc-var">up </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">, </span><span class="jsdoc-var">m</span><span class="jsdoc-syntax">){
538         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">m.tryActivate</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">m.items.indexOf</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">m.activeItem</span><span class="jsdoc-syntax">)-1, -1)){
539             </span><span class="jsdoc-var">m.tryActivate</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">m.items.length</span><span class="jsdoc-syntax">-1, -1);
540         }
541     },
542
543     </span><span class="jsdoc-var">down </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">, </span><span class="jsdoc-var">m</span><span class="jsdoc-syntax">){
544         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">m.tryActivate</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">m.items.indexOf</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">m.activeItem</span><span class="jsdoc-syntax">)+1, 1)){
545             </span><span class="jsdoc-var">m.tryActivate</span><span class="jsdoc-syntax">(0, 1);
546         }
547     },
548
549     </span><span class="jsdoc-var">right </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">, </span><span class="jsdoc-var">m</span><span class="jsdoc-syntax">){
550         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">m.activeItem</span><span class="jsdoc-syntax">){
551             </span><span class="jsdoc-var">m.activeItem.expandMenu</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">);
552         }
553     },
554
555     </span><span class="jsdoc-var">left </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">, </span><span class="jsdoc-var">m</span><span class="jsdoc-syntax">){
556         </span><span class="jsdoc-var">m.hide</span><span class="jsdoc-syntax">();
557         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">m.parentMenu </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">m.parentMenu.activeItem</span><span class="jsdoc-syntax">){
558             </span><span class="jsdoc-var">m.parentMenu.activeItem.activate</span><span class="jsdoc-syntax">();
559         }
560     },
561
562     </span><span class="jsdoc-var">enter </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">, </span><span class="jsdoc-var">m</span><span class="jsdoc-syntax">){
563         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">m.activeItem</span><span class="jsdoc-syntax">){
564             </span><span class="jsdoc-var">e.stopPropagation</span><span class="jsdoc-syntax">();
565             </span><span class="jsdoc-var">m.activeItem.onClick</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">e</span><span class="jsdoc-syntax">);
566             </span><span class="jsdoc-var">m.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">m.activeItem</span><span class="jsdoc-syntax">);
567             </span><span class="jsdoc-keyword">return true</span><span class="jsdoc-syntax">;
568         }
569     }
570 });</span></code></body></html>
RooJS - Version 1