1 | /*! |
---|
2 | * Ext JS Library 3.0.0 |
---|
3 | * Copyright(c) 2006-2009 Ext JS, LLC |
---|
4 | * licensing@extjs.com |
---|
5 | * http://www.extjs.com/license |
---|
6 | */ |
---|
7 | /** |
---|
8 | * @class Ext.layout.MenuLayout |
---|
9 | * @extends Ext.layout.ContainerLayout |
---|
10 | * <p>Layout manager used by {@link Ext.menu.Menu}. Generally this class should not need to be used directly.</p> |
---|
11 | */ |
---|
12 | Ext.layout.MenuLayout = Ext.extend(Ext.layout.ContainerLayout, { |
---|
13 | monitorResize: true, |
---|
14 | |
---|
15 | setContainer : function(ct){ |
---|
16 | this.monitorResize = !ct.floating; |
---|
17 | Ext.layout.MenuLayout.superclass.setContainer.call(this, ct); |
---|
18 | }, |
---|
19 | |
---|
20 | renderItem : function(c, position, target){ |
---|
21 | if (!this.itemTpl) { |
---|
22 | this.itemTpl = Ext.layout.MenuLayout.prototype.itemTpl = new Ext.XTemplate( |
---|
23 | '<li id="{itemId}" class="{itemCls}">', |
---|
24 | '<tpl if="needsIcon">', |
---|
25 | '<img src="{icon}" class="{iconCls}"/>', |
---|
26 | '</tpl>', |
---|
27 | '</li>' |
---|
28 | ); |
---|
29 | } |
---|
30 | |
---|
31 | if(c && !c.rendered){ |
---|
32 | if(Ext.isNumber(position)){ |
---|
33 | position = target.dom.childNodes[position]; |
---|
34 | } |
---|
35 | var a = this.getItemArgs(c); |
---|
36 | |
---|
37 | // The Component's positionEl is the <li> it is rendered into |
---|
38 | c.render(c.positionEl = position ? |
---|
39 | this.itemTpl.insertBefore(position, a, true) : |
---|
40 | this.itemTpl.append(target, a, true)); |
---|
41 | |
---|
42 | // Link the containing <li> to the item. |
---|
43 | c.positionEl.menuItemId = c.itemId || c.id; |
---|
44 | |
---|
45 | // If rendering a regular Component, and it needs an icon, |
---|
46 | // move the Component rightwards. |
---|
47 | if (!a.isMenuItem && a.needsIcon) { |
---|
48 | c.positionEl.addClass('x-menu-list-item-indent'); |
---|
49 | } |
---|
50 | }else if(c && !this.isValidParent(c, target)){ |
---|
51 | if(Ext.isNumber(position)){ |
---|
52 | position = target.dom.childNodes[position]; |
---|
53 | } |
---|
54 | target.dom.insertBefore(c.getActionEl().dom, position || null); |
---|
55 | } |
---|
56 | }, |
---|
57 | |
---|
58 | getItemArgs: function(c) { |
---|
59 | var isMenuItem = c instanceof Ext.menu.Item; |
---|
60 | return { |
---|
61 | isMenuItem: isMenuItem, |
---|
62 | needsIcon: !isMenuItem && (c.icon || c.iconCls), |
---|
63 | icon: c.icon || Ext.BLANK_IMAGE_URL, |
---|
64 | iconCls: 'x-menu-item-icon ' + (c.iconCls || ''), |
---|
65 | itemId: 'x-menu-el-' + c.id, |
---|
66 | itemCls: 'x-menu-list-item ' + (this.extraCls || '') |
---|
67 | }; |
---|
68 | }, |
---|
69 | |
---|
70 | // Valid if the Component is in a <li> which is part of our target <ul> |
---|
71 | isValidParent: function(c, target) { |
---|
72 | return c.el.up('li.x-menu-list-item', 5).dom.parentNode === (target.dom || target); |
---|
73 | }, |
---|
74 | |
---|
75 | onLayout : function(ct, target){ |
---|
76 | this.renderAll(ct, target); |
---|
77 | this.doAutoSize(); |
---|
78 | }, |
---|
79 | |
---|
80 | doAutoSize : function(){ |
---|
81 | var ct = this.container, w = ct.width; |
---|
82 | if(ct.floating){ |
---|
83 | if(w){ |
---|
84 | ct.setWidth(w); |
---|
85 | }else if(Ext.isIE){ |
---|
86 | ct.setWidth(Ext.isStrict && (Ext.isIE7 || Ext.isIE8) ? 'auto' : ct.minWidth); |
---|
87 | var el = ct.getEl(), t = el.dom.offsetWidth; // force recalc |
---|
88 | ct.setWidth(ct.getLayoutTarget().getWidth() + el.getFrameWidth('lr')); |
---|
89 | } |
---|
90 | } |
---|
91 | } |
---|
92 | }); |
---|
93 | Ext.Container.LAYOUTS['menu'] = Ext.layout.MenuLayout; |
---|
94 | |
---|
95 | /** |
---|
96 | * @class Ext.menu.Menu |
---|
97 | * @extends Ext.Container |
---|
98 | * <p>A menu object. This is the container to which you may add menu items. Menu can also serve as a base class |
---|
99 | * when you want a specialized menu based off of another component (like {@link Ext.menu.DateMenu} for example).</p> |
---|
100 | * <p>Menus may contain either {@link Ext.menu.Item menu items}, or general {@link Ext.Component Component}s.</p> |
---|
101 | * <p>To make a contained general {@link Ext.Component Component} line up with other {@link Ext.menu.Item menu items} |
---|
102 | * specify <tt>iconCls: 'no-icon'</tt>. This reserves a space for an icon, and indents the Component in line |
---|
103 | * with the other menu items. See {@link Ext.form.ComboBox}.{@link Ext.form.ComboBox#getListParent getListParent} |
---|
104 | * for an example.</p> |
---|
105 | * <p>By default, Menus are absolutely positioned, floating Components. By configuring a Menu with |
---|
106 | * <b><tt>{@link #floating}:false</tt></b>, a Menu may be used as child of a Container.</p> |
---|
107 | * |
---|
108 | * @xtype menu |
---|
109 | */ |
---|
110 | Ext.menu.Menu = Ext.extend(Ext.Container, { |
---|
111 | /** |
---|
112 | * @cfg {Object} defaults |
---|
113 | * A config object that will be applied to all items added to this container either via the {@link #items} |
---|
114 | * config or via the {@link #add} method. The defaults config can contain any number of |
---|
115 | * name/value property pairs to be added to each item, and should be valid for the types of items |
---|
116 | * being added to the menu. |
---|
117 | */ |
---|
118 | /** |
---|
119 | * @cfg {Mixed} items |
---|
120 | * An array of items to be added to this menu. Menus may contain either {@link Ext.menu.Item menu items}, |
---|
121 | * or general {@link Ext.Component Component}s. |
---|
122 | */ |
---|
123 | /** |
---|
124 | * @cfg {Number} minWidth The minimum width of the menu in pixels (defaults to 120) |
---|
125 | */ |
---|
126 | minWidth : 120, |
---|
127 | /** |
---|
128 | * @cfg {Boolean/String} shadow True or "sides" for the default effect, "frame" for 4-way shadow, and "drop" |
---|
129 | * for bottom-right shadow (defaults to "sides") |
---|
130 | */ |
---|
131 | shadow : "sides", |
---|
132 | /** |
---|
133 | * @cfg {String} subMenuAlign The {@link Ext.Element#alignTo} anchor position value to use for submenus of |
---|
134 | * this menu (defaults to "tl-tr?") |
---|
135 | */ |
---|
136 | subMenuAlign : "tl-tr?", |
---|
137 | /** |
---|
138 | * @cfg {String} defaultAlign The default {@link Ext.Element#alignTo} anchor position value for this menu |
---|
139 | * relative to its element of origin (defaults to "tl-bl?") |
---|
140 | */ |
---|
141 | defaultAlign : "tl-bl?", |
---|
142 | /** |
---|
143 | * @cfg {Boolean} allowOtherMenus True to allow multiple menus to be displayed at the same time (defaults to false) |
---|
144 | */ |
---|
145 | allowOtherMenus : false, |
---|
146 | /** |
---|
147 | * @cfg {Boolean} ignoreParentClicks True to ignore clicks on any item in this menu that is a parent item (displays |
---|
148 | * a submenu) so that the submenu is not dismissed when clicking the parent item (defaults to false). |
---|
149 | */ |
---|
150 | ignoreParentClicks : false, |
---|
151 | /** |
---|
152 | * @cfg {Boolean} enableScrolling True to allow the menu container to have scroller controls if the menu is too long (defaults to true). |
---|
153 | */ |
---|
154 | enableScrolling: true, |
---|
155 | /** |
---|
156 | * @cfg {Number} maxHeight The maximum height of the menu. Only applies when enableScrolling is set to True (defaults to null). |
---|
157 | */ |
---|
158 | maxHeight: null, |
---|
159 | /** |
---|
160 | * @cfg {Number} scrollIncrement The amount to scroll the menu. Only applies when enableScrolling is set to True (defaults to 24). |
---|
161 | */ |
---|
162 | scrollIncrement: 24, |
---|
163 | /** |
---|
164 | * @cfg {Boolean} showSeparator True to show the icon separator. (defaults to true). |
---|
165 | */ |
---|
166 | showSeparator: true, |
---|
167 | /** |
---|
168 | * @cfg {Array} defaultOffsets An array specifying the [x, y] offset in pixels by which to |
---|
169 | * change the default Menu popup position after aligning according to the {@link #defaultAlign} |
---|
170 | * configuration. Defaults to <tt>[0, 0]</tt>. |
---|
171 | */ |
---|
172 | defaultOffsets : [0, 0], |
---|
173 | |
---|
174 | |
---|
175 | /** |
---|
176 | * @cfg {Boolean} floating |
---|
177 | * May be specified as false to create a Menu which may be used as a child item of another Container |
---|
178 | * instead of a free-floating {@link Ext.Layer Layer}. (defaults to true). |
---|
179 | */ |
---|
180 | floating: true, // Render as a Layer by default |
---|
181 | |
---|
182 | // private |
---|
183 | hidden: true, |
---|
184 | layout: 'menu', |
---|
185 | hideMode: 'offsets', // Important for laying out Components |
---|
186 | scrollerHeight: 8, |
---|
187 | autoLayout: true, // Provided for backwards compat |
---|
188 | defaultType: 'menuitem', |
---|
189 | |
---|
190 | initComponent: function(){ |
---|
191 | if(Ext.isArray(this.initialConfig)){ |
---|
192 | Ext.apply(this, {items:this.initialConfig}); |
---|
193 | } |
---|
194 | this.addEvents( |
---|
195 | /** |
---|
196 | * @event click |
---|
197 | * Fires when this menu is clicked (or when the enter key is pressed while it is active) |
---|
198 | * @param {Ext.menu.Menu} this |
---|
199 | * @param {Ext.menu.Item} menuItem The menu item that was clicked |
---|
200 | * @param {Ext.EventObject} e |
---|
201 | */ |
---|
202 | 'click', |
---|
203 | /** |
---|
204 | * @event mouseover |
---|
205 | * Fires when the mouse is hovering over this menu |
---|
206 | * @param {Ext.menu.Menu} this |
---|
207 | * @param {Ext.EventObject} e |
---|
208 | * @param {Ext.menu.Item} menuItem The menu item that was clicked |
---|
209 | */ |
---|
210 | 'mouseover', |
---|
211 | /** |
---|
212 | * @event mouseout |
---|
213 | * Fires when the mouse exits this menu |
---|
214 | * @param {Ext.menu.Menu} this |
---|
215 | * @param {Ext.EventObject} e |
---|
216 | * @param {Ext.menu.Item} menuItem The menu item that was clicked |
---|
217 | */ |
---|
218 | 'mouseout', |
---|
219 | /** |
---|
220 | * @event itemclick |
---|
221 | * Fires when a menu item contained in this menu is clicked |
---|
222 | * @param {Ext.menu.BaseItem} baseItem The BaseItem that was clicked |
---|
223 | * @param {Ext.EventObject} e |
---|
224 | */ |
---|
225 | 'itemclick' |
---|
226 | ); |
---|
227 | Ext.menu.MenuMgr.register(this); |
---|
228 | if(this.floating){ |
---|
229 | Ext.EventManager.onWindowResize(this.hide, this); |
---|
230 | }else{ |
---|
231 | if(this.initialConfig.hidden !== false){ |
---|
232 | this.hidden = false; |
---|
233 | } |
---|
234 | this.internalDefaults = {hideOnClick: false}; |
---|
235 | } |
---|
236 | Ext.menu.Menu.superclass.initComponent.call(this); |
---|
237 | if(this.autoLayout){ |
---|
238 | this.on({ |
---|
239 | add: this.doLayout, |
---|
240 | remove: this.doLayout, |
---|
241 | scope: this |
---|
242 | }); |
---|
243 | } |
---|
244 | }, |
---|
245 | |
---|
246 | //private |
---|
247 | getLayoutTarget : function() { |
---|
248 | return this.ul; |
---|
249 | }, |
---|
250 | |
---|
251 | // private |
---|
252 | onRender : function(ct, position){ |
---|
253 | if(!ct){ |
---|
254 | ct = Ext.getBody(); |
---|
255 | } |
---|
256 | |
---|
257 | var dh = { |
---|
258 | id: this.getId(), |
---|
259 | cls: 'x-menu ' + ((this.floating) ? 'x-menu-floating x-layer ' : '') + (this.cls || '') + (this.plain ? ' x-menu-plain' : '') + (this.showSeparator ? '' : ' x-menu-nosep'), |
---|
260 | style: this.style, |
---|
261 | cn: [ |
---|
262 | {tag: 'a', cls: 'x-menu-focus', href: '#', onclick: 'return false;', tabIndex: '-1'}, |
---|
263 | {tag: 'ul', cls: 'x-menu-list'} |
---|
264 | ] |
---|
265 | }; |
---|
266 | if(this.floating){ |
---|
267 | this.el = new Ext.Layer({ |
---|
268 | shadow: this.shadow, |
---|
269 | dh: dh, |
---|
270 | constrain: false, |
---|
271 | parentEl: ct, |
---|
272 | zindex:15000 |
---|
273 | }); |
---|
274 | }else{ |
---|
275 | this.el = ct.createChild(dh); |
---|
276 | } |
---|
277 | Ext.menu.Menu.superclass.onRender.call(this, ct, position); |
---|
278 | |
---|
279 | if(!this.keyNav){ |
---|
280 | this.keyNav = new Ext.menu.MenuNav(this); |
---|
281 | } |
---|
282 | // generic focus element |
---|
283 | this.focusEl = this.el.child('a.x-menu-focus'); |
---|
284 | this.ul = this.el.child('ul.x-menu-list'); |
---|
285 | this.mon(this.ul, { |
---|
286 | scope: this, |
---|
287 | click: this.onClick, |
---|
288 | mouseover: this.onMouseOver, |
---|
289 | mouseout: this.onMouseOut |
---|
290 | }); |
---|
291 | if(this.enableScrolling){ |
---|
292 | this.mon(this.el, { |
---|
293 | scope: this, |
---|
294 | delegate: '.x-menu-scroller', |
---|
295 | click: this.onScroll, |
---|
296 | mouseover: this.deactivateActive |
---|
297 | }); |
---|
298 | } |
---|
299 | }, |
---|
300 | |
---|
301 | // private |
---|
302 | findTargetItem : function(e){ |
---|
303 | var t = e.getTarget(".x-menu-list-item", this.ul, true); |
---|
304 | if(t && t.menuItemId){ |
---|
305 | return this.items.get(t.menuItemId); |
---|
306 | } |
---|
307 | }, |
---|
308 | |
---|
309 | // private |
---|
310 | onClick : function(e){ |
---|
311 | var t = this.findTargetItem(e); |
---|
312 | if(t){ |
---|
313 | if(t.isFormField){ |
---|
314 | this.setActiveItem(t); |
---|
315 | }else{ |
---|
316 | if(t.menu && this.ignoreParentClicks){ |
---|
317 | t.expandMenu(); |
---|
318 | e.preventDefault(); |
---|
319 | }else if(t.onClick){ |
---|
320 | t.onClick(e); |
---|
321 | this.fireEvent("click", this, t, e); |
---|
322 | } |
---|
323 | } |
---|
324 | } |
---|
325 | }, |
---|
326 | |
---|
327 | // private |
---|
328 | setActiveItem : function(item, autoExpand){ |
---|
329 | if(item != this.activeItem){ |
---|
330 | this.deactivateActive(); |
---|
331 | if((this.activeItem = item).isFormField){ |
---|
332 | item.focus(); |
---|
333 | }else{ |
---|
334 | item.activate(autoExpand); |
---|
335 | } |
---|
336 | }else if(autoExpand){ |
---|
337 | item.expandMenu(); |
---|
338 | } |
---|
339 | }, |
---|
340 | |
---|
341 | deactivateActive: function(){ |
---|
342 | var a = this.activeItem; |
---|
343 | if(a){ |
---|
344 | if(a.isFormField){ |
---|
345 | //Fields cannot deactivate, but Combos must collapse |
---|
346 | if(a.collapse){ |
---|
347 | a.collapse(); |
---|
348 | } |
---|
349 | }else{ |
---|
350 | a.deactivate(); |
---|
351 | } |
---|
352 | delete this.activeItem; |
---|
353 | } |
---|
354 | }, |
---|
355 | |
---|
356 | // private |
---|
357 | tryActivate : function(start, step){ |
---|
358 | var items = this.items; |
---|
359 | for(var i = start, len = items.length; i >= 0 && i < len; i+= step){ |
---|
360 | var item = items.get(i); |
---|
361 | if(!item.disabled && (item.canActivate || item.isFormField)){ |
---|
362 | this.setActiveItem(item, false); |
---|
363 | return item; |
---|
364 | } |
---|
365 | } |
---|
366 | return false; |
---|
367 | }, |
---|
368 | |
---|
369 | // private |
---|
370 | onMouseOver : function(e){ |
---|
371 | var t = this.findTargetItem(e); |
---|
372 | if(t){ |
---|
373 | if(t.canActivate && !t.disabled){ |
---|
374 | this.setActiveItem(t, true); |
---|
375 | } |
---|
376 | } |
---|
377 | this.over = true; |
---|
378 | this.fireEvent("mouseover", this, e, t); |
---|
379 | }, |
---|
380 | |
---|
381 | // private |
---|
382 | onMouseOut : function(e){ |
---|
383 | var t = this.findTargetItem(e); |
---|
384 | if(t){ |
---|
385 | if(t == this.activeItem && t.shouldDeactivate && t.shouldDeactivate(e)){ |
---|
386 | this.activeItem.deactivate(); |
---|
387 | delete this.activeItem; |
---|
388 | } |
---|
389 | } |
---|
390 | this.over = false; |
---|
391 | this.fireEvent("mouseout", this, e, t); |
---|
392 | }, |
---|
393 | |
---|
394 | // private |
---|
395 | onScroll: function(e, t){ |
---|
396 | if(e){ |
---|
397 | e.stopEvent(); |
---|
398 | } |
---|
399 | var ul = this.ul.dom, top = Ext.fly(t).is('.x-menu-scroller-top'); |
---|
400 | ul.scrollTop += this.scrollIncrement * (top ? -1 : 1); |
---|
401 | if(top ? ul.scrollTop <= 0 : ul.scrollTop + this.activeMax >= ul.scrollHeight){ |
---|
402 | this.onScrollerOut(null, t); |
---|
403 | } |
---|
404 | }, |
---|
405 | |
---|
406 | // private |
---|
407 | onScrollerIn: function(e, t){ |
---|
408 | var ul = this.ul.dom, top = Ext.fly(t).is('.x-menu-scroller-top'); |
---|
409 | if(top ? ul.scrollTop > 0 : ul.scrollTop + this.activeMax < ul.scrollHeight){ |
---|
410 | Ext.fly(t).addClass(['x-menu-item-active', 'x-menu-scroller-active']); |
---|
411 | } |
---|
412 | }, |
---|
413 | |
---|
414 | // private |
---|
415 | onScrollerOut: function(e, t){ |
---|
416 | Ext.fly(t).removeClass(['x-menu-item-active', 'x-menu-scroller-active']); |
---|
417 | }, |
---|
418 | |
---|
419 | /** |
---|
420 | * Displays this menu relative to another element |
---|
421 | * @param {Mixed} element The element to align to |
---|
422 | * @param {String} position (optional) The {@link Ext.Element#alignTo} anchor position to use in aligning to |
---|
423 | * the element (defaults to this.defaultAlign) |
---|
424 | * @param {Ext.menu.Menu} parentMenu (optional) This menu's parent menu, if applicable (defaults to undefined) |
---|
425 | */ |
---|
426 | show : function(el, pos, parentMenu){ |
---|
427 | if(this.floating){ |
---|
428 | this.parentMenu = parentMenu; |
---|
429 | if(!this.el){ |
---|
430 | this.render(); |
---|
431 | this.doLayout(false, true); |
---|
432 | } |
---|
433 | if(this.fireEvent('beforeshow', this) !== false){ |
---|
434 | this.showAt(this.el.getAlignToXY(el, pos || this.defaultAlign, this.defaultOffsets), parentMenu, false); |
---|
435 | } |
---|
436 | }else{ |
---|
437 | Ext.menu.Menu.superclass.show.call(this); |
---|
438 | } |
---|
439 | }, |
---|
440 | |
---|
441 | /** |
---|
442 | * Displays this menu at a specific xy position |
---|
443 | * @param {Array} xyPosition Contains X & Y [x, y] values for the position at which to show the menu (coordinates are page-based) |
---|
444 | * @param {Ext.menu.Menu} parentMenu (optional) This menu's parent menu, if applicable (defaults to undefined) |
---|
445 | */ |
---|
446 | showAt : function(xy, parentMenu, /* private: */_e){ |
---|
447 | this.parentMenu = parentMenu; |
---|
448 | if(!this.el){ |
---|
449 | this.render(); |
---|
450 | } |
---|
451 | this.el.setXY(xy); |
---|
452 | if(this.enableScrolling){ |
---|
453 | this.constrainScroll(xy[1]); |
---|
454 | } |
---|
455 | this.el.show(); |
---|
456 | Ext.menu.Menu.superclass.onShow.call(this); |
---|
457 | if(Ext.isIE){ |
---|
458 | this.layout.doAutoSize(); |
---|
459 | if(!Ext.isIE8){ |
---|
460 | this.el.repaint(); |
---|
461 | } |
---|
462 | } |
---|
463 | this.hidden = false; |
---|
464 | this.focus(); |
---|
465 | this.fireEvent("show", this); |
---|
466 | }, |
---|
467 | |
---|
468 | constrainScroll: function(y){ |
---|
469 | var max, full = this.ul.setHeight('auto').getHeight(); |
---|
470 | if(this.floating){ |
---|
471 | max = this.maxHeight ? this.maxHeight : Ext.fly(this.el.dom.parentNode).getViewSize().height - y; |
---|
472 | }else{ |
---|
473 | max = this.getHeight(); |
---|
474 | } |
---|
475 | if(full > max && max > 0){ |
---|
476 | this.activeMax = max - this.scrollerHeight * 2 - this.el.getFrameWidth('tb') - Ext.num(this.el.shadowOffset, 0); |
---|
477 | this.ul.setHeight(this.activeMax); |
---|
478 | this.createScrollers(); |
---|
479 | this.el.select('.x-menu-scroller').setDisplayed(''); |
---|
480 | }else{ |
---|
481 | this.ul.setHeight(full); |
---|
482 | this.el.select('.x-menu-scroller').setDisplayed('none'); |
---|
483 | } |
---|
484 | this.ul.dom.scrollTop = 0; |
---|
485 | }, |
---|
486 | |
---|
487 | createScrollers: function(){ |
---|
488 | if(!this.scroller){ |
---|
489 | this.scroller = { |
---|
490 | pos: 0, |
---|
491 | top: this.el.insertFirst({ |
---|
492 | tag: 'div', |
---|
493 | cls: 'x-menu-scroller x-menu-scroller-top', |
---|
494 | html: ' ' |
---|
495 | }), |
---|
496 | bottom: this.el.createChild({ |
---|
497 | tag: 'div', |
---|
498 | cls: 'x-menu-scroller x-menu-scroller-bottom', |
---|
499 | html: ' ' |
---|
500 | }) |
---|
501 | }; |
---|
502 | this.scroller.top.hover(this.onScrollerIn, this.onScrollerOut, this); |
---|
503 | this.scroller.topRepeater = new Ext.util.ClickRepeater(this.scroller.top, { |
---|
504 | listeners: { |
---|
505 | click: this.onScroll.createDelegate(this, [null, this.scroller.top], false) |
---|
506 | } |
---|
507 | }); |
---|
508 | this.scroller.bottom.hover(this.onScrollerIn, this.onScrollerOut, this); |
---|
509 | this.scroller.bottomRepeater = new Ext.util.ClickRepeater(this.scroller.bottom, { |
---|
510 | listeners: { |
---|
511 | click: this.onScroll.createDelegate(this, [null, this.scroller.bottom], false) |
---|
512 | } |
---|
513 | }); |
---|
514 | } |
---|
515 | }, |
---|
516 | |
---|
517 | onLayout: function(){ |
---|
518 | if(this.isVisible()){ |
---|
519 | if(this.enableScrolling){ |
---|
520 | this.constrainScroll(this.el.getTop()); |
---|
521 | } |
---|
522 | if(this.floating){ |
---|
523 | this.el.sync(); |
---|
524 | } |
---|
525 | } |
---|
526 | }, |
---|
527 | |
---|
528 | focus : function(){ |
---|
529 | if(!this.hidden){ |
---|
530 | this.doFocus.defer(50, this); |
---|
531 | } |
---|
532 | }, |
---|
533 | |
---|
534 | doFocus : function(){ |
---|
535 | if(!this.hidden){ |
---|
536 | this.focusEl.focus(); |
---|
537 | } |
---|
538 | }, |
---|
539 | |
---|
540 | /** |
---|
541 | * Hides this menu and optionally all parent menus |
---|
542 | * @param {Boolean} deep (optional) True to hide all parent menus recursively, if any (defaults to false) |
---|
543 | */ |
---|
544 | hide : function(deep){ |
---|
545 | this.deepHide = deep; |
---|
546 | Ext.menu.Menu.superclass.hide.call(this); |
---|
547 | delete this.deepHide; |
---|
548 | }, |
---|
549 | |
---|
550 | // private |
---|
551 | onHide: function(){ |
---|
552 | Ext.menu.Menu.superclass.onHide.call(this); |
---|
553 | this.deactivateActive(); |
---|
554 | if(this.el && this.floating){ |
---|
555 | this.el.hide(); |
---|
556 | } |
---|
557 | if(this.deepHide === true && this.parentMenu){ |
---|
558 | this.parentMenu.hide(true); |
---|
559 | } |
---|
560 | }, |
---|
561 | |
---|
562 | // private |
---|
563 | lookupComponent: function(c){ |
---|
564 | if(Ext.isString(c)){ |
---|
565 | c = (c == 'separator' || c == '-') ? new Ext.menu.Separator() : new Ext.menu.TextItem(c); |
---|
566 | this.applyDefaults(c); |
---|
567 | }else{ |
---|
568 | if(Ext.isObject(c)){ |
---|
569 | c = this.getMenuItem(c); |
---|
570 | }else if(c.tagName || c.el){ // element. Wrap it. |
---|
571 | c = new Ext.BoxComponent({ |
---|
572 | el: c |
---|
573 | }); |
---|
574 | } |
---|
575 | } |
---|
576 | return c; |
---|
577 | }, |
---|
578 | |
---|
579 | applyDefaults : function(c){ |
---|
580 | if(!Ext.isString(c)){ |
---|
581 | c = Ext.menu.Menu.superclass.applyDefaults.call(this, c); |
---|
582 | var d = this.internalDefaults; |
---|
583 | if(d){ |
---|
584 | if(c.events){ |
---|
585 | Ext.applyIf(c.initialConfig, d); |
---|
586 | Ext.apply(c, d); |
---|
587 | }else{ |
---|
588 | Ext.applyIf(c, d); |
---|
589 | } |
---|
590 | } |
---|
591 | } |
---|
592 | return c; |
---|
593 | }, |
---|
594 | |
---|
595 | // private |
---|
596 | getMenuItem: function(config){ |
---|
597 | if(!config.isXType){ |
---|
598 | if(!config.xtype && Ext.isBoolean(config.checked)){ |
---|
599 | return new Ext.menu.CheckItem(config) |
---|
600 | } |
---|
601 | return Ext.create(config, this.defaultType); |
---|
602 | } |
---|
603 | return config; |
---|
604 | }, |
---|
605 | |
---|
606 | /** |
---|
607 | * Adds a separator bar to the menu |
---|
608 | * @return {Ext.menu.Item} The menu item that was added |
---|
609 | */ |
---|
610 | addSeparator : function(){ |
---|
611 | return this.add(new Ext.menu.Separator()); |
---|
612 | }, |
---|
613 | |
---|
614 | /** |
---|
615 | * Adds an {@link Ext.Element} object to the menu |
---|
616 | * @param {Mixed} el The element or DOM node to add, or its id |
---|
617 | * @return {Ext.menu.Item} The menu item that was added |
---|
618 | */ |
---|
619 | addElement : function(el){ |
---|
620 | return this.add(new Ext.menu.BaseItem(el)); |
---|
621 | }, |
---|
622 | |
---|
623 | /** |
---|
624 | * Adds an existing object based on {@link Ext.menu.BaseItem} to the menu |
---|
625 | * @param {Ext.menu.Item} item The menu item to add |
---|
626 | * @return {Ext.menu.Item} The menu item that was added |
---|
627 | */ |
---|
628 | addItem : function(item){ |
---|
629 | return this.add(item); |
---|
630 | }, |
---|
631 | |
---|
632 | /** |
---|
633 | * Creates a new {@link Ext.menu.Item} based an the supplied config object and adds it to the menu |
---|
634 | * @param {Object} config A MenuItem config object |
---|
635 | * @return {Ext.menu.Item} The menu item that was added |
---|
636 | */ |
---|
637 | addMenuItem : function(config){ |
---|
638 | return this.add(this.getMenuItem(config)); |
---|
639 | }, |
---|
640 | |
---|
641 | /** |
---|
642 | * Creates a new {@link Ext.menu.TextItem} with the supplied text and adds it to the menu |
---|
643 | * @param {String} text The text to display in the menu item |
---|
644 | * @return {Ext.menu.Item} The menu item that was added |
---|
645 | */ |
---|
646 | addText : function(text){ |
---|
647 | return this.add(new Ext.menu.TextItem(text)); |
---|
648 | }, |
---|
649 | |
---|
650 | //private |
---|
651 | onDestroy : function(){ |
---|
652 | Ext.menu.Menu.superclass.onDestroy.call(this); |
---|
653 | Ext.menu.MenuMgr.unregister(this); |
---|
654 | Ext.EventManager.removeResizeListener(this.hide, this); |
---|
655 | if(this.keyNav) { |
---|
656 | this.keyNav.disable(); |
---|
657 | } |
---|
658 | var s = this.scroller; |
---|
659 | if(s){ |
---|
660 | Ext.destroy(s.topRepeater, s.bottomRepeater, s.top, s.bottom); |
---|
661 | } |
---|
662 | } |
---|
663 | }); |
---|
664 | |
---|
665 | Ext.reg('menu', Ext.menu.Menu); |
---|
666 | |
---|
667 | // MenuNav is a private utility class used internally by the Menu |
---|
668 | Ext.menu.MenuNav = Ext.extend(Ext.KeyNav, function(){ |
---|
669 | function up(e, m){ |
---|
670 | if(!m.tryActivate(m.items.indexOf(m.activeItem)-1, -1)){ |
---|
671 | m.tryActivate(m.items.length-1, -1); |
---|
672 | } |
---|
673 | } |
---|
674 | function down(e, m){ |
---|
675 | if(!m.tryActivate(m.items.indexOf(m.activeItem)+1, 1)){ |
---|
676 | m.tryActivate(0, 1); |
---|
677 | } |
---|
678 | } |
---|
679 | return { |
---|
680 | constructor: function(menu){ |
---|
681 | Ext.menu.MenuNav.superclass.constructor.call(this, menu.el); |
---|
682 | this.scope = this.menu = menu; |
---|
683 | }, |
---|
684 | |
---|
685 | doRelay : function(e, h){ |
---|
686 | var k = e.getKey(); |
---|
687 | // Keystrokes within a form Field (e.g.: down in a Combo) do not navigate. Allow only TAB |
---|
688 | if (this.menu.activeItem && this.menu.activeItem.isFormField && k != e.TAB) { |
---|
689 | return false; |
---|
690 | } |
---|
691 | if(!this.menu.activeItem && e.isNavKeyPress() && k != e.SPACE && k != e.RETURN){ |
---|
692 | this.menu.tryActivate(0, 1); |
---|
693 | return false; |
---|
694 | } |
---|
695 | return h.call(this.scope || this, e, this.menu); |
---|
696 | }, |
---|
697 | |
---|
698 | tab: function(e, m) { |
---|
699 | e.stopEvent(); |
---|
700 | if (e.shiftKey) { |
---|
701 | up(e, m); |
---|
702 | } else { |
---|
703 | down(e, m); |
---|
704 | } |
---|
705 | }, |
---|
706 | |
---|
707 | up : up, |
---|
708 | |
---|
709 | down : down, |
---|
710 | |
---|
711 | right : function(e, m){ |
---|
712 | if(m.activeItem){ |
---|
713 | m.activeItem.expandMenu(true); |
---|
714 | } |
---|
715 | }, |
---|
716 | |
---|
717 | left : function(e, m){ |
---|
718 | m.hide(); |
---|
719 | if(m.parentMenu && m.parentMenu.activeItem){ |
---|
720 | m.parentMenu.activeItem.activate(); |
---|
721 | } |
---|
722 | }, |
---|
723 | |
---|
724 | enter : function(e, m){ |
---|
725 | if(m.activeItem){ |
---|
726 | e.stopPropagation(); |
---|
727 | m.activeItem.onClick(e); |
---|
728 | m.fireEvent("click", this, m.activeItem); |
---|
729 | return true; |
---|
730 | } |
---|
731 | } |
---|
732 | }; |
---|
733 | }());/** |
---|
734 | * @class Ext.menu.MenuMgr |
---|
735 | * Provides a common registry of all menu items on a page so that they can be easily accessed by id. |
---|
736 | * @singleton |
---|
737 | */ |
---|
738 | Ext.menu.MenuMgr = function(){ |
---|
739 | var menus, active, groups = {}, attached = false, lastShow = new Date(); |
---|
740 | |
---|
741 | // private - called when first menu is created |
---|
742 | function init(){ |
---|
743 | menus = {}; |
---|
744 | active = new Ext.util.MixedCollection(); |
---|
745 | Ext.getDoc().addKeyListener(27, function(){ |
---|
746 | if(active.length > 0){ |
---|
747 | hideAll(); |
---|
748 | } |
---|
749 | }); |
---|
750 | } |
---|
751 | |
---|
752 | // private |
---|
753 | function hideAll(){ |
---|
754 | if(active && active.length > 0){ |
---|
755 | var c = active.clone(); |
---|
756 | c.each(function(m){ |
---|
757 | m.hide(); |
---|
758 | }); |
---|
759 | } |
---|
760 | } |
---|
761 | |
---|
762 | // private |
---|
763 | function onHide(m){ |
---|
764 | active.remove(m); |
---|
765 | if(active.length < 1){ |
---|
766 | Ext.getDoc().un("mousedown", onMouseDown); |
---|
767 | attached = false; |
---|
768 | } |
---|
769 | } |
---|
770 | |
---|
771 | // private |
---|
772 | function onShow(m){ |
---|
773 | var last = active.last(); |
---|
774 | lastShow = new Date(); |
---|
775 | active.add(m); |
---|
776 | if(!attached){ |
---|
777 | Ext.getDoc().on("mousedown", onMouseDown); |
---|
778 | attached = true; |
---|
779 | } |
---|
780 | if(m.parentMenu){ |
---|
781 | m.getEl().setZIndex(parseInt(m.parentMenu.getEl().getStyle("z-index"), 10) + 3); |
---|
782 | m.parentMenu.activeChild = m; |
---|
783 | }else if(last && last.isVisible()){ |
---|
784 | m.getEl().setZIndex(parseInt(last.getEl().getStyle("z-index"), 10) + 3); |
---|
785 | } |
---|
786 | } |
---|
787 | |
---|
788 | // private |
---|
789 | function onBeforeHide(m){ |
---|
790 | if(m.activeChild){ |
---|
791 | m.activeChild.hide(); |
---|
792 | } |
---|
793 | if(m.autoHideTimer){ |
---|
794 | clearTimeout(m.autoHideTimer); |
---|
795 | delete m.autoHideTimer; |
---|
796 | } |
---|
797 | } |
---|
798 | |
---|
799 | // private |
---|
800 | function onBeforeShow(m){ |
---|
801 | var pm = m.parentMenu; |
---|
802 | if(!pm && !m.allowOtherMenus){ |
---|
803 | hideAll(); |
---|
804 | }else if(pm && pm.activeChild){ |
---|
805 | pm.activeChild.hide(); |
---|
806 | } |
---|
807 | } |
---|
808 | |
---|
809 | // private |
---|
810 | function onMouseDown(e){ |
---|
811 | if(lastShow.getElapsed() > 50 && active.length > 0 && !e.getTarget(".x-menu")){ |
---|
812 | hideAll(); |
---|
813 | } |
---|
814 | } |
---|
815 | |
---|
816 | // private |
---|
817 | function onBeforeCheck(mi, state){ |
---|
818 | if(state){ |
---|
819 | var g = groups[mi.group]; |
---|
820 | for(var i = 0, l = g.length; i < l; i++){ |
---|
821 | if(g[i] != mi){ |
---|
822 | g[i].setChecked(false); |
---|
823 | } |
---|
824 | } |
---|
825 | } |
---|
826 | } |
---|
827 | |
---|
828 | return { |
---|
829 | |
---|
830 | /** |
---|
831 | * Hides all menus that are currently visible |
---|
832 | */ |
---|
833 | hideAll : function(){ |
---|
834 | hideAll(); |
---|
835 | }, |
---|
836 | |
---|
837 | // private |
---|
838 | register : function(menu){ |
---|
839 | if(!menus){ |
---|
840 | init(); |
---|
841 | } |
---|
842 | menus[menu.id] = menu; |
---|
843 | menu.on("beforehide", onBeforeHide); |
---|
844 | menu.on("hide", onHide); |
---|
845 | menu.on("beforeshow", onBeforeShow); |
---|
846 | menu.on("show", onShow); |
---|
847 | var g = menu.group; |
---|
848 | if(g && menu.events["checkchange"]){ |
---|
849 | if(!groups[g]){ |
---|
850 | groups[g] = []; |
---|
851 | } |
---|
852 | groups[g].push(menu); |
---|
853 | menu.on("checkchange", onCheck); |
---|
854 | } |
---|
855 | }, |
---|
856 | |
---|
857 | /** |
---|
858 | * Returns a {@link Ext.menu.Menu} object |
---|
859 | * @param {String/Object} menu The string menu id, an existing menu object reference, or a Menu config that will |
---|
860 | * be used to generate and return a new Menu instance. |
---|
861 | * @return {Ext.menu.Menu} The specified menu, or null if none are found |
---|
862 | */ |
---|
863 | get : function(menu){ |
---|
864 | if(typeof menu == "string"){ // menu id |
---|
865 | if(!menus){ // not initialized, no menus to return |
---|
866 | return null; |
---|
867 | } |
---|
868 | return menus[menu]; |
---|
869 | }else if(menu.events){ // menu instance |
---|
870 | return menu; |
---|
871 | }else if(typeof menu.length == 'number'){ // array of menu items? |
---|
872 | return new Ext.menu.Menu({items:menu}); |
---|
873 | }else{ // otherwise, must be a config |
---|
874 | return Ext.create(menu, 'menu'); |
---|
875 | } |
---|
876 | }, |
---|
877 | |
---|
878 | // private |
---|
879 | unregister : function(menu){ |
---|
880 | delete menus[menu.id]; |
---|
881 | menu.un("beforehide", onBeforeHide); |
---|
882 | menu.un("hide", onHide); |
---|
883 | menu.un("beforeshow", onBeforeShow); |
---|
884 | menu.un("show", onShow); |
---|
885 | var g = menu.group; |
---|
886 | if(g && menu.events["checkchange"]){ |
---|
887 | groups[g].remove(menu); |
---|
888 | menu.un("checkchange", onCheck); |
---|
889 | } |
---|
890 | }, |
---|
891 | |
---|
892 | // private |
---|
893 | registerCheckable : function(menuItem){ |
---|
894 | var g = menuItem.group; |
---|
895 | if(g){ |
---|
896 | if(!groups[g]){ |
---|
897 | groups[g] = []; |
---|
898 | } |
---|
899 | groups[g].push(menuItem); |
---|
900 | menuItem.on("beforecheckchange", onBeforeCheck); |
---|
901 | } |
---|
902 | }, |
---|
903 | |
---|
904 | // private |
---|
905 | unregisterCheckable : function(menuItem){ |
---|
906 | var g = menuItem.group; |
---|
907 | if(g){ |
---|
908 | groups[g].remove(menuItem); |
---|
909 | menuItem.un("beforecheckchange", onBeforeCheck); |
---|
910 | } |
---|
911 | }, |
---|
912 | |
---|
913 | getCheckedItem : function(groupId){ |
---|
914 | var g = groups[groupId]; |
---|
915 | if(g){ |
---|
916 | for(var i = 0, l = g.length; i < l; i++){ |
---|
917 | if(g[i].checked){ |
---|
918 | return g[i]; |
---|
919 | } |
---|
920 | } |
---|
921 | } |
---|
922 | return null; |
---|
923 | }, |
---|
924 | |
---|
925 | setCheckedItem : function(groupId, itemId){ |
---|
926 | var g = groups[groupId]; |
---|
927 | if(g){ |
---|
928 | for(var i = 0, l = g.length; i < l; i++){ |
---|
929 | if(g[i].id == itemId){ |
---|
930 | g[i].setChecked(true); |
---|
931 | } |
---|
932 | } |
---|
933 | } |
---|
934 | return null; |
---|
935 | } |
---|
936 | }; |
---|
937 | }(); |
---|
938 | /** |
---|
939 | * @class Ext.menu.BaseItem |
---|
940 | * @extends Ext.Component |
---|
941 | * The base class for all items that render into menus. BaseItem provides default rendering, activated state |
---|
942 | * management and base configuration options shared by all menu components. |
---|
943 | * @constructor |
---|
944 | * Creates a new BaseItem |
---|
945 | * @param {Object} config Configuration options |
---|
946 | * @xtype menubaseitem |
---|
947 | */ |
---|
948 | Ext.menu.BaseItem = function(config){ |
---|
949 | Ext.menu.BaseItem.superclass.constructor.call(this, config); |
---|
950 | |
---|
951 | this.addEvents( |
---|
952 | /** |
---|
953 | * @event click |
---|
954 | * Fires when this item is clicked |
---|
955 | * @param {Ext.menu.BaseItem} this |
---|
956 | * @param {Ext.EventObject} e |
---|
957 | */ |
---|
958 | 'click', |
---|
959 | /** |
---|
960 | * @event activate |
---|
961 | * Fires when this item is activated |
---|
962 | * @param {Ext.menu.BaseItem} this |
---|
963 | */ |
---|
964 | 'activate', |
---|
965 | /** |
---|
966 | * @event deactivate |
---|
967 | * Fires when this item is deactivated |
---|
968 | * @param {Ext.menu.BaseItem} this |
---|
969 | */ |
---|
970 | 'deactivate' |
---|
971 | ); |
---|
972 | |
---|
973 | if(this.handler){ |
---|
974 | this.on("click", this.handler, this.scope); |
---|
975 | } |
---|
976 | }; |
---|
977 | |
---|
978 | Ext.extend(Ext.menu.BaseItem, Ext.Component, { |
---|
979 | /** |
---|
980 | * @property parentMenu |
---|
981 | * @type Ext.menu.Menu |
---|
982 | * The parent Menu of this Item. |
---|
983 | */ |
---|
984 | /** |
---|
985 | * @cfg {Function} handler |
---|
986 | * A function that will handle the click event of this menu item (optional). |
---|
987 | * The handler is passed the following parameters:<div class="mdetail-params"><ul> |
---|
988 | * <li><code>b</code> : Item<div class="sub-desc">This menu Item.</div></li> |
---|
989 | * <li><code>e</code> : EventObject<div class="sub-desc">The click event.</div></li> |
---|
990 | * </ul></div> |
---|
991 | */ |
---|
992 | /** |
---|
993 | * @cfg {Object} scope |
---|
994 | * The scope (<tt><b>this</b></tt> reference) in which the handler function will be called. |
---|
995 | */ |
---|
996 | /** |
---|
997 | * @cfg {Boolean} canActivate True if this item can be visually activated (defaults to false) |
---|
998 | */ |
---|
999 | canActivate : false, |
---|
1000 | /** |
---|
1001 | * @cfg {String} activeClass The CSS class to use when the item becomes activated (defaults to "x-menu-item-active") |
---|
1002 | */ |
---|
1003 | activeClass : "x-menu-item-active", |
---|
1004 | /** |
---|
1005 | * @cfg {Boolean} hideOnClick True to hide the containing menu after this item is clicked (defaults to true) |
---|
1006 | */ |
---|
1007 | hideOnClick : true, |
---|
1008 | /** |
---|
1009 | * @cfg {Number} clickHideDelay Length of time in milliseconds to wait before hiding after a click (defaults to 100) |
---|
1010 | */ |
---|
1011 | clickHideDelay : 1, |
---|
1012 | |
---|
1013 | // private |
---|
1014 | ctype : "Ext.menu.BaseItem", |
---|
1015 | |
---|
1016 | // private |
---|
1017 | actionMode : "container", |
---|
1018 | |
---|
1019 | // private |
---|
1020 | onRender : function(container, position){ |
---|
1021 | Ext.menu.BaseItem.superclass.onRender.apply(this, arguments); |
---|
1022 | if(this.ownerCt && this.ownerCt instanceof Ext.menu.Menu){ |
---|
1023 | this.parentMenu = this.ownerCt; |
---|
1024 | }else{ |
---|
1025 | this.container.addClass('x-menu-list-item'); |
---|
1026 | this.mon(this.el, 'click', this.onClick, this); |
---|
1027 | this.mon(this.el, 'mouseenter', this.activate, this); |
---|
1028 | this.mon(this.el, 'mouseleave', this.deactivate, this); |
---|
1029 | } |
---|
1030 | }, |
---|
1031 | |
---|
1032 | /** |
---|
1033 | * Sets the function that will handle click events for this item (equivalent to passing in the {@link #handler} |
---|
1034 | * config property). If an existing handler is already registered, it will be unregistered for you. |
---|
1035 | * @param {Function} handler The function that should be called on click |
---|
1036 | * @param {Object} scope The scope that should be passed to the handler |
---|
1037 | */ |
---|
1038 | setHandler : function(handler, scope){ |
---|
1039 | if(this.handler){ |
---|
1040 | this.un("click", this.handler, this.scope); |
---|
1041 | } |
---|
1042 | this.on("click", this.handler = handler, this.scope = scope); |
---|
1043 | }, |
---|
1044 | |
---|
1045 | // private |
---|
1046 | onClick : function(e){ |
---|
1047 | if(!this.disabled && this.fireEvent("click", this, e) !== false |
---|
1048 | && (this.parentMenu && this.parentMenu.fireEvent("itemclick", this, e) !== false)){ |
---|
1049 | this.handleClick(e); |
---|
1050 | }else{ |
---|
1051 | e.stopEvent(); |
---|
1052 | } |
---|
1053 | }, |
---|
1054 | |
---|
1055 | // private |
---|
1056 | activate : function(){ |
---|
1057 | if(this.disabled){ |
---|
1058 | return false; |
---|
1059 | } |
---|
1060 | var li = this.container; |
---|
1061 | li.addClass(this.activeClass); |
---|
1062 | this.region = li.getRegion().adjust(2, 2, -2, -2); |
---|
1063 | this.fireEvent("activate", this); |
---|
1064 | return true; |
---|
1065 | }, |
---|
1066 | |
---|
1067 | // private |
---|
1068 | deactivate : function(){ |
---|
1069 | this.container.removeClass(this.activeClass); |
---|
1070 | this.fireEvent("deactivate", this); |
---|
1071 | }, |
---|
1072 | |
---|
1073 | // private |
---|
1074 | shouldDeactivate : function(e){ |
---|
1075 | return !this.region || !this.region.contains(e.getPoint()); |
---|
1076 | }, |
---|
1077 | |
---|
1078 | // private |
---|
1079 | handleClick : function(e){ |
---|
1080 | if(this.hideOnClick){ |
---|
1081 | this.parentMenu.hide.defer(this.clickHideDelay, this.parentMenu, [true]); |
---|
1082 | } |
---|
1083 | }, |
---|
1084 | |
---|
1085 | // private. Do nothing |
---|
1086 | expandMenu : Ext.emptyFn, |
---|
1087 | |
---|
1088 | // private. Do nothing |
---|
1089 | hideMenu : Ext.emptyFn |
---|
1090 | }); |
---|
1091 | Ext.reg('menubaseitem', Ext.menu.BaseItem);/** |
---|
1092 | * @class Ext.menu.TextItem |
---|
1093 | * @extends Ext.menu.BaseItem |
---|
1094 | * Adds a static text string to a menu, usually used as either a heading or group separator. |
---|
1095 | * @constructor |
---|
1096 | * Creates a new TextItem |
---|
1097 | * @param {Object/String} config If config is a string, it is used as the text to display, otherwise it |
---|
1098 | * is applied as a config object (and should contain a <tt>text</tt> property). |
---|
1099 | * @xtype menutextitem |
---|
1100 | */ |
---|
1101 | Ext.menu.TextItem = function(cfg){ |
---|
1102 | if(typeof cfg == 'string'){ |
---|
1103 | cfg = {text: cfg} |
---|
1104 | } |
---|
1105 | Ext.menu.TextItem.superclass.constructor.call(this, cfg); |
---|
1106 | }; |
---|
1107 | |
---|
1108 | Ext.extend(Ext.menu.TextItem, Ext.menu.BaseItem, { |
---|
1109 | /** |
---|
1110 | * @cfg {String} text The text to display for this item (defaults to '') |
---|
1111 | */ |
---|
1112 | /** |
---|
1113 | * @cfg {Boolean} hideOnClick True to hide the containing menu after this item is clicked (defaults to false) |
---|
1114 | */ |
---|
1115 | hideOnClick : false, |
---|
1116 | /** |
---|
1117 | * @cfg {String} itemCls The default CSS class to use for text items (defaults to "x-menu-text") |
---|
1118 | */ |
---|
1119 | itemCls : "x-menu-text", |
---|
1120 | |
---|
1121 | // private |
---|
1122 | onRender : function(){ |
---|
1123 | var s = document.createElement("span"); |
---|
1124 | s.className = this.itemCls; |
---|
1125 | s.innerHTML = this.text; |
---|
1126 | this.el = s; |
---|
1127 | Ext.menu.TextItem.superclass.onRender.apply(this, arguments); |
---|
1128 | } |
---|
1129 | }); |
---|
1130 | Ext.reg('menutextitem', Ext.menu.TextItem);/** |
---|
1131 | * @class Ext.menu.Separator |
---|
1132 | * @extends Ext.menu.BaseItem |
---|
1133 | * Adds a separator bar to a menu, used to divide logical groups of menu items. Generally you will |
---|
1134 | * add one of these by using "-" in you call to add() or in your items config rather than creating one directly. |
---|
1135 | * @constructor |
---|
1136 | * @param {Object} config Configuration options |
---|
1137 | * @xtype menuseparator |
---|
1138 | */ |
---|
1139 | Ext.menu.Separator = function(config){ |
---|
1140 | Ext.menu.Separator.superclass.constructor.call(this, config); |
---|
1141 | }; |
---|
1142 | |
---|
1143 | Ext.extend(Ext.menu.Separator, Ext.menu.BaseItem, { |
---|
1144 | /** |
---|
1145 | * @cfg {String} itemCls The default CSS class to use for separators (defaults to "x-menu-sep") |
---|
1146 | */ |
---|
1147 | itemCls : "x-menu-sep", |
---|
1148 | /** |
---|
1149 | * @cfg {Boolean} hideOnClick True to hide the containing menu after this item is clicked (defaults to false) |
---|
1150 | */ |
---|
1151 | hideOnClick : false, |
---|
1152 | |
---|
1153 | /** |
---|
1154 | * @cfg {String} activeClass |
---|
1155 | * @hide |
---|
1156 | */ |
---|
1157 | activeClass: '', |
---|
1158 | |
---|
1159 | // private |
---|
1160 | onRender : function(li){ |
---|
1161 | var s = document.createElement("span"); |
---|
1162 | s.className = this.itemCls; |
---|
1163 | s.innerHTML = " "; |
---|
1164 | this.el = s; |
---|
1165 | li.addClass("x-menu-sep-li"); |
---|
1166 | Ext.menu.Separator.superclass.onRender.apply(this, arguments); |
---|
1167 | } |
---|
1168 | }); |
---|
1169 | Ext.reg('menuseparator', Ext.menu.Separator);/** |
---|
1170 | * @class Ext.menu.Item |
---|
1171 | * @extends Ext.menu.BaseItem |
---|
1172 | * A base class for all menu items that require menu-related functionality (like sub-menus) and are not static |
---|
1173 | * display items. Item extends the base functionality of {@link Ext.menu.BaseItem} by adding menu-specific |
---|
1174 | * activation and click handling. |
---|
1175 | * @constructor |
---|
1176 | * Creates a new Item |
---|
1177 | * @param {Object} config Configuration options |
---|
1178 | * @xtype menuitem |
---|
1179 | */ |
---|
1180 | Ext.menu.Item = function(config){ |
---|
1181 | Ext.menu.Item.superclass.constructor.call(this, config); |
---|
1182 | if(this.menu){ |
---|
1183 | this.menu = Ext.menu.MenuMgr.get(this.menu); |
---|
1184 | } |
---|
1185 | }; |
---|
1186 | Ext.extend(Ext.menu.Item, Ext.menu.BaseItem, { |
---|
1187 | /** |
---|
1188 | * @property menu |
---|
1189 | * @type Ext.menu.Menu |
---|
1190 | * The submenu associated with this Item if one was configured. |
---|
1191 | */ |
---|
1192 | /** |
---|
1193 | * @cfg {Mixed} menu (optional) Either an instance of {@link Ext.menu.Menu} or the config object for an |
---|
1194 | * {@link Ext.menu.Menu} which acts as the submenu when this item is activated. |
---|
1195 | */ |
---|
1196 | /** |
---|
1197 | * @cfg {String} icon The path to an icon to display in this item (defaults to Ext.BLANK_IMAGE_URL). If |
---|
1198 | * icon is specified {@link #iconCls} should not be. |
---|
1199 | */ |
---|
1200 | /** |
---|
1201 | * @cfg {String} iconCls A CSS class that specifies a background image that will be used as the icon for |
---|
1202 | * this item (defaults to ''). If iconCls is specified {@link #icon} should not be. |
---|
1203 | */ |
---|
1204 | /** |
---|
1205 | * @cfg {String} text The text to display in this item (defaults to ''). |
---|
1206 | */ |
---|
1207 | /** |
---|
1208 | * @cfg {String} href The href attribute to use for the underlying anchor link (defaults to '#'). |
---|
1209 | */ |
---|
1210 | /** |
---|
1211 | * @cfg {String} hrefTarget The target attribute to use for the underlying anchor link (defaults to ''). |
---|
1212 | */ |
---|
1213 | /** |
---|
1214 | * @cfg {String} itemCls The default CSS class to use for menu items (defaults to 'x-menu-item') |
---|
1215 | */ |
---|
1216 | itemCls : 'x-menu-item', |
---|
1217 | /** |
---|
1218 | * @cfg {Boolean} canActivate True if this item can be visually activated (defaults to true) |
---|
1219 | */ |
---|
1220 | canActivate : true, |
---|
1221 | /** |
---|
1222 | * @cfg {Number} showDelay Length of time in milliseconds to wait before showing this item (defaults to 200) |
---|
1223 | */ |
---|
1224 | showDelay: 200, |
---|
1225 | // doc'd in BaseItem |
---|
1226 | hideDelay: 200, |
---|
1227 | |
---|
1228 | // private |
---|
1229 | ctype: 'Ext.menu.Item', |
---|
1230 | |
---|
1231 | // private |
---|
1232 | onRender : function(container, position){ |
---|
1233 | if (!this.itemTpl) { |
---|
1234 | this.itemTpl = Ext.menu.Item.prototype.itemTpl = new Ext.XTemplate( |
---|
1235 | '<a id="{id}" class="{cls}" hidefocus="true" unselectable="on" href="{href}"', |
---|
1236 | '<tpl if="hrefTarget">', |
---|
1237 | ' target="{hrefTarget}"', |
---|
1238 | '</tpl>', |
---|
1239 | '>', |
---|
1240 | '<img src="{icon}" class="x-menu-item-icon {iconCls}"/>', |
---|
1241 | '<span class="x-menu-item-text">{text}</span>', |
---|
1242 | '</a>' |
---|
1243 | ); |
---|
1244 | } |
---|
1245 | var a = this.getTemplateArgs(); |
---|
1246 | this.el = position ? this.itemTpl.insertBefore(position, a, true) : this.itemTpl.append(container, a, true); |
---|
1247 | this.iconEl = this.el.child('img.x-menu-item-icon'); |
---|
1248 | this.textEl = this.el.child('.x-menu-item-text'); |
---|
1249 | Ext.menu.Item.superclass.onRender.call(this, container, position); |
---|
1250 | }, |
---|
1251 | |
---|
1252 | getTemplateArgs: function() { |
---|
1253 | return { |
---|
1254 | id: this.id, |
---|
1255 | cls: this.itemCls + (this.menu ? ' x-menu-item-arrow' : '') + (this.cls ? ' ' + this.cls : ''), |
---|
1256 | href: this.href || '#', |
---|
1257 | hrefTarget: this.hrefTarget, |
---|
1258 | icon: this.icon || Ext.BLANK_IMAGE_URL, |
---|
1259 | iconCls: this.iconCls || '', |
---|
1260 | text: this.itemText||this.text||' ' |
---|
1261 | }; |
---|
1262 | }, |
---|
1263 | |
---|
1264 | /** |
---|
1265 | * Sets the text to display in this menu item |
---|
1266 | * @param {String} text The text to display |
---|
1267 | */ |
---|
1268 | setText : function(text){ |
---|
1269 | this.text = text||' '; |
---|
1270 | if(this.rendered){ |
---|
1271 | this.textEl.update(this.text); |
---|
1272 | this.parentMenu.layout.doAutoSize(); |
---|
1273 | } |
---|
1274 | }, |
---|
1275 | |
---|
1276 | /** |
---|
1277 | * Sets the CSS class to apply to the item's icon element |
---|
1278 | * @param {String} cls The CSS class to apply |
---|
1279 | */ |
---|
1280 | setIconClass : function(cls){ |
---|
1281 | var oldCls = this.iconCls; |
---|
1282 | this.iconCls = cls; |
---|
1283 | if(this.rendered){ |
---|
1284 | this.iconEl.replaceClass(oldCls, this.iconCls); |
---|
1285 | } |
---|
1286 | }, |
---|
1287 | |
---|
1288 | //private |
---|
1289 | beforeDestroy: function(){ |
---|
1290 | if (this.menu){ |
---|
1291 | this.menu.destroy(); |
---|
1292 | } |
---|
1293 | Ext.menu.Item.superclass.beforeDestroy.call(this); |
---|
1294 | }, |
---|
1295 | |
---|
1296 | // private |
---|
1297 | handleClick : function(e){ |
---|
1298 | if(!this.href){ // if no link defined, stop the event automatically |
---|
1299 | e.stopEvent(); |
---|
1300 | } |
---|
1301 | Ext.menu.Item.superclass.handleClick.apply(this, arguments); |
---|
1302 | }, |
---|
1303 | |
---|
1304 | // private |
---|
1305 | activate : function(autoExpand){ |
---|
1306 | if(Ext.menu.Item.superclass.activate.apply(this, arguments)){ |
---|
1307 | this.focus(); |
---|
1308 | if(autoExpand){ |
---|
1309 | this.expandMenu(); |
---|
1310 | } |
---|
1311 | } |
---|
1312 | return true; |
---|
1313 | }, |
---|
1314 | |
---|
1315 | // private |
---|
1316 | shouldDeactivate : function(e){ |
---|
1317 | if(Ext.menu.Item.superclass.shouldDeactivate.call(this, e)){ |
---|
1318 | if(this.menu && this.menu.isVisible()){ |
---|
1319 | return !this.menu.getEl().getRegion().contains(e.getPoint()); |
---|
1320 | } |
---|
1321 | return true; |
---|
1322 | } |
---|
1323 | return false; |
---|
1324 | }, |
---|
1325 | |
---|
1326 | // private |
---|
1327 | deactivate : function(){ |
---|
1328 | Ext.menu.Item.superclass.deactivate.apply(this, arguments); |
---|
1329 | this.hideMenu(); |
---|
1330 | }, |
---|
1331 | |
---|
1332 | // private |
---|
1333 | expandMenu : function(autoActivate){ |
---|
1334 | if(!this.disabled && this.menu){ |
---|
1335 | clearTimeout(this.hideTimer); |
---|
1336 | delete this.hideTimer; |
---|
1337 | if(!this.menu.isVisible() && !this.showTimer){ |
---|
1338 | this.showTimer = this.deferExpand.defer(this.showDelay, this, [autoActivate]); |
---|
1339 | }else if (this.menu.isVisible() && autoActivate){ |
---|
1340 | this.menu.tryActivate(0, 1); |
---|
1341 | } |
---|
1342 | } |
---|
1343 | }, |
---|
1344 | |
---|
1345 | // private |
---|
1346 | deferExpand : function(autoActivate){ |
---|
1347 | delete this.showTimer; |
---|
1348 | this.menu.show(this.container, this.parentMenu.subMenuAlign || 'tl-tr?', this.parentMenu); |
---|
1349 | if(autoActivate){ |
---|
1350 | this.menu.tryActivate(0, 1); |
---|
1351 | } |
---|
1352 | }, |
---|
1353 | |
---|
1354 | // private |
---|
1355 | hideMenu : function(){ |
---|
1356 | clearTimeout(this.showTimer); |
---|
1357 | delete this.showTimer; |
---|
1358 | if(!this.hideTimer && this.menu && this.menu.isVisible()){ |
---|
1359 | this.hideTimer = this.deferHide.defer(this.hideDelay, this); |
---|
1360 | } |
---|
1361 | }, |
---|
1362 | |
---|
1363 | // private |
---|
1364 | deferHide : function(){ |
---|
1365 | delete this.hideTimer; |
---|
1366 | if(this.menu.over){ |
---|
1367 | this.parentMenu.setActiveItem(this, false); |
---|
1368 | }else{ |
---|
1369 | this.menu.hide(); |
---|
1370 | } |
---|
1371 | } |
---|
1372 | }); |
---|
1373 | Ext.reg('menuitem', Ext.menu.Item);/** |
---|
1374 | * @class Ext.menu.CheckItem |
---|
1375 | * @extends Ext.menu.Item |
---|
1376 | * Adds a menu item that contains a checkbox by default, but can also be part of a radio group. |
---|
1377 | * @constructor |
---|
1378 | * Creates a new CheckItem |
---|
1379 | * @param {Object} config Configuration options |
---|
1380 | * @xtype menucheckitem |
---|
1381 | */ |
---|
1382 | Ext.menu.CheckItem = function(config){ |
---|
1383 | Ext.menu.CheckItem.superclass.constructor.call(this, config); |
---|
1384 | this.addEvents( |
---|
1385 | /** |
---|
1386 | * @event beforecheckchange |
---|
1387 | * Fires before the checked value is set, providing an opportunity to cancel if needed |
---|
1388 | * @param {Ext.menu.CheckItem} this |
---|
1389 | * @param {Boolean} checked The new checked value that will be set |
---|
1390 | */ |
---|
1391 | "beforecheckchange" , |
---|
1392 | /** |
---|
1393 | * @event checkchange |
---|
1394 | * Fires after the checked value has been set |
---|
1395 | * @param {Ext.menu.CheckItem} this |
---|
1396 | * @param {Boolean} checked The checked value that was set |
---|
1397 | */ |
---|
1398 | "checkchange" |
---|
1399 | ); |
---|
1400 | /** |
---|
1401 | * A function that handles the checkchange event. The function is undefined by default, but if an implementation |
---|
1402 | * is provided, it will be called automatically when the checkchange event fires. |
---|
1403 | * @param {Ext.menu.CheckItem} this |
---|
1404 | * @param {Boolean} checked The checked value that was set |
---|
1405 | * @method checkHandler |
---|
1406 | */ |
---|
1407 | if(this.checkHandler){ |
---|
1408 | this.on('checkchange', this.checkHandler, this.scope); |
---|
1409 | } |
---|
1410 | Ext.menu.MenuMgr.registerCheckable(this); |
---|
1411 | }; |
---|
1412 | Ext.extend(Ext.menu.CheckItem, Ext.menu.Item, { |
---|
1413 | /** |
---|
1414 | * @cfg {String} group |
---|
1415 | * All check items with the same group name will automatically be grouped into a single-select |
---|
1416 | * radio button group (defaults to '') |
---|
1417 | */ |
---|
1418 | /** |
---|
1419 | * @cfg {String} itemCls The default CSS class to use for check items (defaults to "x-menu-item x-menu-check-item") |
---|
1420 | */ |
---|
1421 | itemCls : "x-menu-item x-menu-check-item", |
---|
1422 | /** |
---|
1423 | * @cfg {String} groupClass The default CSS class to use for radio group check items (defaults to "x-menu-group-item") |
---|
1424 | */ |
---|
1425 | groupClass : "x-menu-group-item", |
---|
1426 | |
---|
1427 | /** |
---|
1428 | * @cfg {Boolean} checked True to initialize this checkbox as checked (defaults to false). Note that |
---|
1429 | * if this checkbox is part of a radio group (group = true) only the last item in the group that is |
---|
1430 | * initialized with checked = true will be rendered as checked. |
---|
1431 | */ |
---|
1432 | checked: false, |
---|
1433 | |
---|
1434 | // private |
---|
1435 | ctype: "Ext.menu.CheckItem", |
---|
1436 | |
---|
1437 | // private |
---|
1438 | onRender : function(c){ |
---|
1439 | Ext.menu.CheckItem.superclass.onRender.apply(this, arguments); |
---|
1440 | if(this.group){ |
---|
1441 | this.el.addClass(this.groupClass); |
---|
1442 | } |
---|
1443 | if(this.checked){ |
---|
1444 | this.checked = false; |
---|
1445 | this.setChecked(true, true); |
---|
1446 | } |
---|
1447 | }, |
---|
1448 | |
---|
1449 | // private |
---|
1450 | destroy : function(){ |
---|
1451 | Ext.menu.MenuMgr.unregisterCheckable(this); |
---|
1452 | Ext.menu.CheckItem.superclass.destroy.apply(this, arguments); |
---|
1453 | }, |
---|
1454 | |
---|
1455 | /** |
---|
1456 | * Set the checked state of this item |
---|
1457 | * @param {Boolean} checked The new checked value |
---|
1458 | * @param {Boolean} suppressEvent (optional) True to prevent the checkchange event from firing (defaults to false) |
---|
1459 | */ |
---|
1460 | setChecked : function(state, suppressEvent){ |
---|
1461 | if(this.checked != state && this.fireEvent("beforecheckchange", this, state) !== false){ |
---|
1462 | if(this.container){ |
---|
1463 | this.container[state ? "addClass" : "removeClass"]("x-menu-item-checked"); |
---|
1464 | } |
---|
1465 | this.checked = state; |
---|
1466 | if(suppressEvent !== true){ |
---|
1467 | this.fireEvent("checkchange", this, state); |
---|
1468 | } |
---|
1469 | } |
---|
1470 | }, |
---|
1471 | |
---|
1472 | // private |
---|
1473 | handleClick : function(e){ |
---|
1474 | if(!this.disabled && !(this.checked && this.group)){// disable unselect on radio item |
---|
1475 | this.setChecked(!this.checked); |
---|
1476 | } |
---|
1477 | Ext.menu.CheckItem.superclass.handleClick.apply(this, arguments); |
---|
1478 | } |
---|
1479 | }); |
---|
1480 | Ext.reg('menucheckitem', Ext.menu.CheckItem);/** |
---|
1481 | * @class Ext.menu.DateMenu |
---|
1482 | * @extends Ext.menu.Menu |
---|
1483 | * A menu containing a {@link Ext.DatePicker} Component. |
---|
1484 | * @xtype datemenu |
---|
1485 | */ |
---|
1486 | Ext.menu.DateMenu = Ext.extend(Ext.menu.Menu, { |
---|
1487 | /** |
---|
1488 | * @cfg {Boolean} enableScrolling |
---|
1489 | * @hide |
---|
1490 | */ |
---|
1491 | enableScrolling: false, |
---|
1492 | |
---|
1493 | /** |
---|
1494 | * @cfg {Boolean} hideOnClick |
---|
1495 | * False to continue showing the menu after a date is selected, defaults to true. |
---|
1496 | */ |
---|
1497 | hideOnClick: true, |
---|
1498 | |
---|
1499 | /** |
---|
1500 | * @cfg {Number} maxHeight |
---|
1501 | * @hide |
---|
1502 | */ |
---|
1503 | /** |
---|
1504 | * @cfg {Number} scrollIncrement |
---|
1505 | * @hide |
---|
1506 | */ |
---|
1507 | /** |
---|
1508 | * @property picker |
---|
1509 | * @type DatePicker |
---|
1510 | * The {@link Ext.DatePicker} instance for this DateMenu |
---|
1511 | */ |
---|
1512 | cls: 'x-date-menu', |
---|
1513 | |
---|
1514 | /** |
---|
1515 | * @event click |
---|
1516 | * @hide |
---|
1517 | */ |
---|
1518 | |
---|
1519 | /** |
---|
1520 | * @event itemclick |
---|
1521 | * @hide |
---|
1522 | */ |
---|
1523 | |
---|
1524 | initComponent: function(){ |
---|
1525 | this.on('beforeshow', this.onBeforeShow, this); |
---|
1526 | if(this.strict = (Ext.isIE7 && Ext.isStrict)){ |
---|
1527 | this.on('show', this.onShow, this, {single: true, delay: 20}); |
---|
1528 | } |
---|
1529 | Ext.apply(this, { |
---|
1530 | plain: true, |
---|
1531 | showSeparator: false, |
---|
1532 | items: this.picker = new Ext.DatePicker(Ext.apply({ |
---|
1533 | internalRender: this.strict || !Ext.isIE, |
---|
1534 | ctCls: 'x-menu-date-item' |
---|
1535 | }, this.initialConfig)) |
---|
1536 | }); |
---|
1537 | this.picker.purgeListeners(); |
---|
1538 | Ext.menu.DateMenu.superclass.initComponent.call(this); |
---|
1539 | this.relayEvents(this.picker, ["select"]); |
---|
1540 | this.on('select', this.menuHide, this); |
---|
1541 | if(this.handler){ |
---|
1542 | this.on('select', this.handler, this.scope || this); |
---|
1543 | } |
---|
1544 | }, |
---|
1545 | |
---|
1546 | menuHide: function() { |
---|
1547 | if(this.hideOnClick){ |
---|
1548 | this.hide(true); |
---|
1549 | } |
---|
1550 | }, |
---|
1551 | |
---|
1552 | onBeforeShow: function(){ |
---|
1553 | if(this.picker){ |
---|
1554 | this.picker.hideMonthPicker(true); |
---|
1555 | } |
---|
1556 | }, |
---|
1557 | |
---|
1558 | onShow: function(){ |
---|
1559 | var el = this.picker.getEl(); |
---|
1560 | el.setWidth(el.getWidth()); //nasty hack for IE7 strict mode |
---|
1561 | } |
---|
1562 | }); |
---|
1563 | Ext.reg('datemenu', Ext.menu.DateMenu);/** |
---|
1564 | * @class Ext.menu.ColorMenu |
---|
1565 | * @extends Ext.menu.Menu |
---|
1566 | * A menu containing a {@link Ext.ColorPalette} Component. |
---|
1567 | * @xtype colormenu |
---|
1568 | */ |
---|
1569 | Ext.menu.ColorMenu = Ext.extend(Ext.menu.Menu, { |
---|
1570 | /** |
---|
1571 | * @cfg {Boolean} enableScrolling |
---|
1572 | * @hide |
---|
1573 | */ |
---|
1574 | enableScrolling: false, |
---|
1575 | |
---|
1576 | /** |
---|
1577 | * @cfg {Boolean} hideOnClick |
---|
1578 | * False to continue showing the menu after a color is selected, defaults to true. |
---|
1579 | */ |
---|
1580 | hideOnClick: true, |
---|
1581 | |
---|
1582 | /** |
---|
1583 | * @cfg {Number} maxHeight |
---|
1584 | * @hide |
---|
1585 | */ |
---|
1586 | /** |
---|
1587 | * @cfg {Number} scrollIncrement |
---|
1588 | * @hide |
---|
1589 | */ |
---|
1590 | /** |
---|
1591 | * @property palette |
---|
1592 | * @type ColorPalette |
---|
1593 | * The {@link Ext.ColorPalette} instance for this ColorMenu |
---|
1594 | */ |
---|
1595 | |
---|
1596 | |
---|
1597 | /** |
---|
1598 | * @event click |
---|
1599 | * @hide |
---|
1600 | */ |
---|
1601 | |
---|
1602 | /** |
---|
1603 | * @event itemclick |
---|
1604 | * @hide |
---|
1605 | */ |
---|
1606 | |
---|
1607 | initComponent: function(){ |
---|
1608 | Ext.apply(this, { |
---|
1609 | plain: true, |
---|
1610 | showSeparator: false, |
---|
1611 | items: this.palette = new Ext.ColorPalette(this.initialConfig) |
---|
1612 | }); |
---|
1613 | this.palette.purgeListeners(); |
---|
1614 | Ext.menu.ColorMenu.superclass.initComponent.call(this); |
---|
1615 | this.relayEvents(this.palette, ['select']); |
---|
1616 | this.on('select', this.menuHide, this); |
---|
1617 | if(this.handler){ |
---|
1618 | this.on('select', this.handler, this.scope || this) |
---|
1619 | } |
---|
1620 | }, |
---|
1621 | |
---|
1622 | menuHide: function(){ |
---|
1623 | if(this.hideOnClick){ |
---|
1624 | this.hide(true); |
---|
1625 | } |
---|
1626 | } |
---|
1627 | }); |
---|
1628 | Ext.reg('colormenu', Ext.menu.ColorMenu); |
---|