projects / roojs1 / blob
? search:


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