1 | /* |
---|
2 | * Ext JS Library 2.2.1 |
---|
3 | * Copyright(c) 2006-2009, Ext JS, LLC. |
---|
4 | * licensing@extjs.com |
---|
5 | * |
---|
6 | * http://extjs.com/license |
---|
7 | */ |
---|
8 | |
---|
9 | |
---|
10 | /** |
---|
11 | * @class Ext.Button |
---|
12 | * @extends Ext.Component |
---|
13 | * Simple Button class |
---|
14 | * @cfg {String} text The button text |
---|
15 | * @cfg {String} icon The path to an image to display in the button (the image will be set as the background-image |
---|
16 | * CSS property of the button by default, so if you want a mixed icon/text button, set cls:"x-btn-text-icon") |
---|
17 | * @cfg {Function} handler A function called when the button is clicked (can be used instead of click event) |
---|
18 | * @cfg {Object} scope The scope of the handler |
---|
19 | * @cfg {Number} minWidth The minimum width for this button (used to give a set of buttons a common width) |
---|
20 | * @cfg {String/Object} tooltip The tooltip for the button - can be a string or QuickTips config object |
---|
21 | * @cfg {Boolean} hidden True to start hidden (defaults to false) |
---|
22 | * @cfg {Boolean} disabled True to start disabled (defaults to false) |
---|
23 | * @cfg {Boolean} pressed True to start pressed (only if enableToggle = true) |
---|
24 | * @cfg {String} toggleGroup The group this toggle button is a member of (only 1 per group can be pressed) |
---|
25 | * @cfg {Boolean/Object} repeat True to repeat fire the click event while the mouse is down. This can also be |
---|
26 | an {@link Ext.util.ClickRepeater} config object (defaults to false). |
---|
27 | * @constructor |
---|
28 | * Create a new button |
---|
29 | * @param {Object} config The config object |
---|
30 | */ |
---|
31 | Ext.Button = Ext.extend(Ext.Component, { |
---|
32 | /** |
---|
33 | * Read-only. True if this button is hidden |
---|
34 | * @type Boolean |
---|
35 | */ |
---|
36 | hidden : false, |
---|
37 | /** |
---|
38 | * Read-only. True if this button is disabled |
---|
39 | * @type Boolean |
---|
40 | */ |
---|
41 | disabled : false, |
---|
42 | /** |
---|
43 | * Read-only. True if this button is pressed (only if enableToggle = true) |
---|
44 | * @type Boolean |
---|
45 | */ |
---|
46 | pressed : false, |
---|
47 | /** |
---|
48 | * The Button's owner {@link Ext.Panel} (defaults to undefined, and is set automatically when |
---|
49 | * the Button is added to a container). Read-only. |
---|
50 | * @type Ext.Panel |
---|
51 | * @property ownerCt |
---|
52 | */ |
---|
53 | |
---|
54 | /** |
---|
55 | * @cfg {Number} tabIndex Set a DOM tabIndex for this button (defaults to undefined) |
---|
56 | */ |
---|
57 | |
---|
58 | /** |
---|
59 | * @cfg {Boolean} allowDepress |
---|
60 | * False to not allow a pressed Button to be depressed (defaults to undefined). Only valid when {@link #enableToggle} is true. |
---|
61 | */ |
---|
62 | |
---|
63 | /** |
---|
64 | * @cfg {Boolean} enableToggle |
---|
65 | * True to enable pressed/not pressed toggling (defaults to false) |
---|
66 | */ |
---|
67 | enableToggle: false, |
---|
68 | /** |
---|
69 | * @cfg {Function} toggleHandler |
---|
70 | * Function called when a Button with {@link #enableToggle} set to true is clicked. Two arguments are passed:<ul class="mdetail-params"> |
---|
71 | * <li><b>button</b> : Ext.Button<div class="sub-desc">this Button object</div></li> |
---|
72 | * <li><b>state</b> : Boolean<div class="sub-desc">The next state if the Button, true means pressed.</div></li> |
---|
73 | * </ul> |
---|
74 | */ |
---|
75 | /** |
---|
76 | * @cfg {Mixed} menu |
---|
77 | * Standard menu attribute consisting of a reference to a menu object, a menu id or a menu config blob (defaults to undefined). |
---|
78 | */ |
---|
79 | /** |
---|
80 | * @cfg {String} menuAlign |
---|
81 | * The position to align the menu to (see {@link Ext.Element#alignTo} for more details, defaults to 'tl-bl?'). |
---|
82 | */ |
---|
83 | menuAlign : "tl-bl?", |
---|
84 | |
---|
85 | /** |
---|
86 | * @cfg {String} iconCls |
---|
87 | * A css class which sets a background image to be used as the icon for this button |
---|
88 | */ |
---|
89 | /** |
---|
90 | * @cfg {String} type |
---|
91 | * submit, reset or button - defaults to 'button' |
---|
92 | */ |
---|
93 | type : 'button', |
---|
94 | |
---|
95 | // private |
---|
96 | menuClassTarget: 'tr', |
---|
97 | |
---|
98 | /** |
---|
99 | * @cfg {String} clickEvent |
---|
100 | * The type of event to map to the button's event handler (defaults to 'click') |
---|
101 | */ |
---|
102 | clickEvent : 'click', |
---|
103 | |
---|
104 | /** |
---|
105 | * @cfg {Boolean} handleMouseEvents |
---|
106 | * False to disable visual cues on mouseover, mouseout and mousedown (defaults to true) |
---|
107 | */ |
---|
108 | handleMouseEvents : true, |
---|
109 | |
---|
110 | /** |
---|
111 | * @cfg {String} tooltipType |
---|
112 | * The type of tooltip to use. Either "qtip" (default) for QuickTips or "title" for title attribute. |
---|
113 | */ |
---|
114 | tooltipType : 'qtip', |
---|
115 | |
---|
116 | /** |
---|
117 | * @cfg {String} buttonSelector |
---|
118 | * <p>(Optional) A {@link Ext.DomQuery DomQuery} selector which is used to extract the active, clickable element from the |
---|
119 | * DOM structure created.</p> |
---|
120 | * <p>When a custom {@link #template} is used, you must ensure that this selector results in the selection of |
---|
121 | * a focussable element.</p> |
---|
122 | * <p>Defaults to <b><tt>"button:first-child"</tt></b>.</p> |
---|
123 | */ |
---|
124 | buttonSelector : "button:first-child", |
---|
125 | |
---|
126 | /** |
---|
127 | * @cfg {Ext.Template} template |
---|
128 | * (Optional) An {@link Ext.Template} with which to create the Button's main element. This Template must |
---|
129 | * contain numeric substitution parameter 0 if it is to display the text property. Changing the template could |
---|
130 | * require code modifications if required elements (e.g. a button) aren't present. |
---|
131 | */ |
---|
132 | /** |
---|
133 | * @cfg {String} cls |
---|
134 | * A CSS class string to apply to the button's main element. |
---|
135 | */ |
---|
136 | |
---|
137 | initComponent : function(){ |
---|
138 | Ext.Button.superclass.initComponent.call(this); |
---|
139 | |
---|
140 | this.addEvents( |
---|
141 | /** |
---|
142 | * @event click |
---|
143 | * Fires when this button is clicked |
---|
144 | * @param {Button} this |
---|
145 | * @param {EventObject} e The click event |
---|
146 | */ |
---|
147 | "click", |
---|
148 | /** |
---|
149 | * @event toggle |
---|
150 | * Fires when the "pressed" state of this button changes (only if enableToggle = true) |
---|
151 | * @param {Button} this |
---|
152 | * @param {Boolean} pressed |
---|
153 | */ |
---|
154 | "toggle", |
---|
155 | /** |
---|
156 | * @event mouseover |
---|
157 | * Fires when the mouse hovers over the button |
---|
158 | * @param {Button} this |
---|
159 | * @param {Event} e The event object |
---|
160 | */ |
---|
161 | 'mouseover', |
---|
162 | /** |
---|
163 | * @event mouseout |
---|
164 | * Fires when the mouse exits the button |
---|
165 | * @param {Button} this |
---|
166 | * @param {Event} e The event object |
---|
167 | */ |
---|
168 | 'mouseout', |
---|
169 | /** |
---|
170 | * @event menushow |
---|
171 | * If this button has a menu, this event fires when it is shown |
---|
172 | * @param {Button} this |
---|
173 | * @param {Menu} menu |
---|
174 | */ |
---|
175 | 'menushow', |
---|
176 | /** |
---|
177 | * @event menuhide |
---|
178 | * If this button has a menu, this event fires when it is hidden |
---|
179 | * @param {Button} this |
---|
180 | * @param {Menu} menu |
---|
181 | */ |
---|
182 | 'menuhide', |
---|
183 | /** |
---|
184 | * @event menutriggerover |
---|
185 | * If this button has a menu, this event fires when the mouse enters the menu triggering element |
---|
186 | * @param {Button} this |
---|
187 | * @param {Menu} menu |
---|
188 | * @param {EventObject} e |
---|
189 | */ |
---|
190 | 'menutriggerover', |
---|
191 | /** |
---|
192 | * @event menutriggerout |
---|
193 | * If this button has a menu, this event fires when the mouse leaves the menu triggering element |
---|
194 | * @param {Button} this |
---|
195 | * @param {Menu} menu |
---|
196 | * @param {EventObject} e |
---|
197 | */ |
---|
198 | 'menutriggerout' |
---|
199 | ); |
---|
200 | if(this.menu){ |
---|
201 | this.menu = Ext.menu.MenuMgr.get(this.menu); |
---|
202 | } |
---|
203 | if(typeof this.toggleGroup === 'string'){ |
---|
204 | this.enableToggle = true; |
---|
205 | } |
---|
206 | }, |
---|
207 | |
---|
208 | // private |
---|
209 | onRender : function(ct, position){ |
---|
210 | if(!this.template){ |
---|
211 | if(!Ext.Button.buttonTemplate){ |
---|
212 | // hideous table template |
---|
213 | Ext.Button.buttonTemplate = new Ext.Template( |
---|
214 | '<table border="0" cellpadding="0" cellspacing="0" class="x-btn-wrap"><tbody><tr>', |
---|
215 | '<td class="x-btn-left"><i> </i></td><td class="x-btn-center"><em unselectable="on"><button class="x-btn-text" type="{1}">{0}</button></em></td><td class="x-btn-right"><i> </i></td>', |
---|
216 | "</tr></tbody></table>"); |
---|
217 | } |
---|
218 | this.template = Ext.Button.buttonTemplate; |
---|
219 | } |
---|
220 | var btn, targs = [this.text || ' ', this.type]; |
---|
221 | |
---|
222 | if(position){ |
---|
223 | btn = this.template.insertBefore(position, targs, true); |
---|
224 | }else{ |
---|
225 | btn = this.template.append(ct, targs, true); |
---|
226 | } |
---|
227 | var btnEl = btn.child(this.buttonSelector); |
---|
228 | btnEl.on('focus', this.onFocus, this); |
---|
229 | btnEl.on('blur', this.onBlur, this); |
---|
230 | |
---|
231 | this.initButtonEl(btn, btnEl); |
---|
232 | |
---|
233 | if(this.menu){ |
---|
234 | this.el.child(this.menuClassTarget).addClass("x-btn-with-menu"); |
---|
235 | } |
---|
236 | Ext.ButtonToggleMgr.register(this); |
---|
237 | }, |
---|
238 | |
---|
239 | // private |
---|
240 | initButtonEl : function(btn, btnEl){ |
---|
241 | |
---|
242 | this.el = btn; |
---|
243 | btn.addClass("x-btn"); |
---|
244 | |
---|
245 | if(this.id){ |
---|
246 | this.el.dom.id = this.el.id = this.id; |
---|
247 | } |
---|
248 | if(this.icon){ |
---|
249 | btnEl.setStyle('background-image', 'url(' +this.icon +')'); |
---|
250 | } |
---|
251 | if(this.iconCls){ |
---|
252 | btnEl.addClass(this.iconCls); |
---|
253 | if(!this.cls){ |
---|
254 | btn.addClass(this.text ? 'x-btn-text-icon' : 'x-btn-icon'); |
---|
255 | } |
---|
256 | } |
---|
257 | if(this.tabIndex !== undefined){ |
---|
258 | btnEl.dom.tabIndex = this.tabIndex; |
---|
259 | } |
---|
260 | if(this.tooltip){ |
---|
261 | if(typeof this.tooltip == 'object'){ |
---|
262 | Ext.QuickTips.register(Ext.apply({ |
---|
263 | target: btnEl.id |
---|
264 | }, this.tooltip)); |
---|
265 | } else { |
---|
266 | btnEl.dom[this.tooltipType] = this.tooltip; |
---|
267 | } |
---|
268 | } |
---|
269 | |
---|
270 | if(this.pressed){ |
---|
271 | this.el.addClass("x-btn-pressed"); |
---|
272 | } |
---|
273 | |
---|
274 | if(this.handleMouseEvents){ |
---|
275 | btn.on("mouseover", this.onMouseOver, this); |
---|
276 | // new functionality for monitoring on the document level |
---|
277 | //btn.on("mouseout", this.onMouseOut, this); |
---|
278 | btn.on("mousedown", this.onMouseDown, this); |
---|
279 | } |
---|
280 | |
---|
281 | if(this.menu){ |
---|
282 | this.menu.on("show", this.onMenuShow, this); |
---|
283 | this.menu.on("hide", this.onMenuHide, this); |
---|
284 | } |
---|
285 | |
---|
286 | if(this.repeat){ |
---|
287 | var repeater = new Ext.util.ClickRepeater(btn, |
---|
288 | typeof this.repeat == "object" ? this.repeat : {} |
---|
289 | ); |
---|
290 | repeater.on("click", this.onClick, this); |
---|
291 | } |
---|
292 | |
---|
293 | btn.on(this.clickEvent, this.onClick, this); |
---|
294 | }, |
---|
295 | |
---|
296 | // private |
---|
297 | afterRender : function(){ |
---|
298 | Ext.Button.superclass.afterRender.call(this); |
---|
299 | if(Ext.isIE6){ |
---|
300 | this.autoWidth.defer(1, this); |
---|
301 | }else{ |
---|
302 | this.autoWidth(); |
---|
303 | } |
---|
304 | }, |
---|
305 | |
---|
306 | /** |
---|
307 | * Sets the CSS class that provides a background image to use as the button's icon. This method also changes |
---|
308 | * the value of the {@link iconCls} config internally. |
---|
309 | * @param {String} cls The CSS class providing the icon image |
---|
310 | */ |
---|
311 | setIconClass : function(cls){ |
---|
312 | if(this.el){ |
---|
313 | this.el.child(this.buttonSelector).replaceClass(this.iconCls, cls); |
---|
314 | } |
---|
315 | this.iconCls = cls; |
---|
316 | }, |
---|
317 | |
---|
318 | // private |
---|
319 | beforeDestroy: function(){ |
---|
320 | if(this.rendered){ |
---|
321 | var btnEl = this.el.child(this.buttonSelector); |
---|
322 | if(btnEl){ |
---|
323 | if(this.tooltip){ |
---|
324 | Ext.QuickTips.unregister(btnEl); |
---|
325 | } |
---|
326 | btnEl.removeAllListeners(); |
---|
327 | } |
---|
328 | } |
---|
329 | if(this.menu){ |
---|
330 | Ext.destroy(this.menu); |
---|
331 | } |
---|
332 | }, |
---|
333 | |
---|
334 | // private |
---|
335 | onDestroy : function(){ |
---|
336 | if(this.rendered){ |
---|
337 | Ext.ButtonToggleMgr.unregister(this); |
---|
338 | } |
---|
339 | }, |
---|
340 | |
---|
341 | // private |
---|
342 | autoWidth : function(){ |
---|
343 | if(this.el){ |
---|
344 | this.el.setWidth("auto"); |
---|
345 | if(Ext.isIE7 && Ext.isStrict){ |
---|
346 | var ib = this.el.child(this.buttonSelector); |
---|
347 | if(ib && ib.getWidth() > 20){ |
---|
348 | ib.clip(); |
---|
349 | ib.setWidth(Ext.util.TextMetrics.measure(ib, this.text).width+ib.getFrameWidth('lr')); |
---|
350 | } |
---|
351 | } |
---|
352 | if(this.minWidth){ |
---|
353 | if(this.el.getWidth() < this.minWidth){ |
---|
354 | this.el.setWidth(this.minWidth); |
---|
355 | } |
---|
356 | } |
---|
357 | } |
---|
358 | }, |
---|
359 | |
---|
360 | /** |
---|
361 | * Assigns this button's click handler |
---|
362 | * @param {Function} handler The function to call when the button is clicked |
---|
363 | * @param {Object} scope (optional) Scope for the function passed in |
---|
364 | */ |
---|
365 | setHandler : function(handler, scope){ |
---|
366 | this.handler = handler; |
---|
367 | this.scope = scope; |
---|
368 | }, |
---|
369 | |
---|
370 | /** |
---|
371 | * Sets this button's text |
---|
372 | * @param {String} text The button text |
---|
373 | */ |
---|
374 | setText : function(text){ |
---|
375 | this.text = text; |
---|
376 | if(this.el){ |
---|
377 | this.el.child("td.x-btn-center " + this.buttonSelector).update(text); |
---|
378 | } |
---|
379 | this.autoWidth(); |
---|
380 | }, |
---|
381 | |
---|
382 | /** |
---|
383 | * Gets the text for this button |
---|
384 | * @return {String} The button text |
---|
385 | */ |
---|
386 | getText : function(){ |
---|
387 | return this.text; |
---|
388 | }, |
---|
389 | |
---|
390 | /** |
---|
391 | * If a state it passed, it becomes the pressed state otherwise the current state is toggled. |
---|
392 | * @param {Boolean} state (optional) Force a particular state |
---|
393 | */ |
---|
394 | toggle : function(state){ |
---|
395 | state = state === undefined ? !this.pressed : state; |
---|
396 | if(state != this.pressed){ |
---|
397 | if(state){ |
---|
398 | this.el.addClass("x-btn-pressed"); |
---|
399 | this.pressed = true; |
---|
400 | this.fireEvent("toggle", this, true); |
---|
401 | }else{ |
---|
402 | this.el.removeClass("x-btn-pressed"); |
---|
403 | this.pressed = false; |
---|
404 | this.fireEvent("toggle", this, false); |
---|
405 | } |
---|
406 | if(this.toggleHandler){ |
---|
407 | this.toggleHandler.call(this.scope || this, this, state); |
---|
408 | } |
---|
409 | } |
---|
410 | }, |
---|
411 | |
---|
412 | /** |
---|
413 | * Focus the button |
---|
414 | */ |
---|
415 | focus : function(){ |
---|
416 | this.el.child(this.buttonSelector).focus(); |
---|
417 | }, |
---|
418 | |
---|
419 | // private |
---|
420 | onDisable : function(){ |
---|
421 | if(this.el){ |
---|
422 | if(!Ext.isIE6 || !this.text){ |
---|
423 | this.el.addClass(this.disabledClass); |
---|
424 | } |
---|
425 | this.el.dom.disabled = true; |
---|
426 | } |
---|
427 | this.disabled = true; |
---|
428 | }, |
---|
429 | |
---|
430 | // private |
---|
431 | onEnable : function(){ |
---|
432 | if(this.el){ |
---|
433 | if(!Ext.isIE6 || !this.text){ |
---|
434 | this.el.removeClass(this.disabledClass); |
---|
435 | } |
---|
436 | this.el.dom.disabled = false; |
---|
437 | } |
---|
438 | this.disabled = false; |
---|
439 | }, |
---|
440 | |
---|
441 | /** |
---|
442 | * Show this button's menu (if it has one) |
---|
443 | */ |
---|
444 | showMenu : function(){ |
---|
445 | if(this.menu){ |
---|
446 | this.menu.show(this.el, this.menuAlign); |
---|
447 | } |
---|
448 | return this; |
---|
449 | }, |
---|
450 | |
---|
451 | /** |
---|
452 | * Hide this button's menu (if it has one) |
---|
453 | */ |
---|
454 | hideMenu : function(){ |
---|
455 | if(this.menu){ |
---|
456 | this.menu.hide(); |
---|
457 | } |
---|
458 | return this; |
---|
459 | }, |
---|
460 | |
---|
461 | /** |
---|
462 | * Returns true if the button has a menu and it is visible |
---|
463 | * @return {Boolean} |
---|
464 | */ |
---|
465 | hasVisibleMenu : function(){ |
---|
466 | return this.menu && this.menu.isVisible(); |
---|
467 | }, |
---|
468 | |
---|
469 | // private |
---|
470 | onClick : function(e){ |
---|
471 | if(e){ |
---|
472 | e.preventDefault(); |
---|
473 | } |
---|
474 | if(e.button != 0){ |
---|
475 | return; |
---|
476 | } |
---|
477 | if(!this.disabled){ |
---|
478 | if(this.enableToggle && (this.allowDepress !== false || !this.pressed)){ |
---|
479 | this.toggle(); |
---|
480 | } |
---|
481 | if(this.menu && !this.menu.isVisible() && !this.ignoreNextClick){ |
---|
482 | this.showMenu(); |
---|
483 | } |
---|
484 | this.fireEvent("click", this, e); |
---|
485 | if(this.handler){ |
---|
486 | //this.el.removeClass("x-btn-over"); |
---|
487 | this.handler.call(this.scope || this, this, e); |
---|
488 | } |
---|
489 | } |
---|
490 | }, |
---|
491 | |
---|
492 | // private |
---|
493 | isMenuTriggerOver : function(e, internal){ |
---|
494 | return this.menu && !internal; |
---|
495 | }, |
---|
496 | |
---|
497 | // private |
---|
498 | isMenuTriggerOut : function(e, internal){ |
---|
499 | return this.menu && !internal; |
---|
500 | }, |
---|
501 | |
---|
502 | // private |
---|
503 | onMouseOver : function(e){ |
---|
504 | if(!this.disabled){ |
---|
505 | var internal = e.within(this.el, true); |
---|
506 | if(!internal){ |
---|
507 | this.el.addClass("x-btn-over"); |
---|
508 | if(!this.monitoringMouseOver){ |
---|
509 | Ext.getDoc().on('mouseover', this.monitorMouseOver, this); |
---|
510 | this.monitoringMouseOver = true; |
---|
511 | } |
---|
512 | this.fireEvent('mouseover', this, e); |
---|
513 | } |
---|
514 | if(this.isMenuTriggerOver(e, internal)){ |
---|
515 | this.fireEvent('menutriggerover', this, this.menu, e); |
---|
516 | } |
---|
517 | } |
---|
518 | }, |
---|
519 | |
---|
520 | // private |
---|
521 | monitorMouseOver : function(e){ |
---|
522 | if(e.target != this.el.dom && !e.within(this.el)){ |
---|
523 | if(this.monitoringMouseOver){ |
---|
524 | Ext.getDoc().un('mouseover', this.monitorMouseOver, this); |
---|
525 | this.monitoringMouseOver = false; |
---|
526 | } |
---|
527 | this.onMouseOut(e); |
---|
528 | } |
---|
529 | }, |
---|
530 | |
---|
531 | // private |
---|
532 | onMouseOut : function(e){ |
---|
533 | var internal = e.within(this.el) && e.target != this.el.dom; |
---|
534 | this.el.removeClass("x-btn-over"); |
---|
535 | this.fireEvent('mouseout', this, e); |
---|
536 | if(this.isMenuTriggerOut(e, internal)){ |
---|
537 | this.fireEvent('menutriggerout', this, this.menu, e); |
---|
538 | } |
---|
539 | }, |
---|
540 | // private |
---|
541 | onFocus : function(e){ |
---|
542 | if(!this.disabled){ |
---|
543 | this.el.addClass("x-btn-focus"); |
---|
544 | } |
---|
545 | }, |
---|
546 | // private |
---|
547 | onBlur : function(e){ |
---|
548 | this.el.removeClass("x-btn-focus"); |
---|
549 | }, |
---|
550 | |
---|
551 | // private |
---|
552 | getClickEl : function(e, isUp){ |
---|
553 | return this.el; |
---|
554 | }, |
---|
555 | |
---|
556 | // private |
---|
557 | onMouseDown : function(e){ |
---|
558 | if(!this.disabled && e.button == 0){ |
---|
559 | this.getClickEl(e).addClass("x-btn-click"); |
---|
560 | Ext.getDoc().on('mouseup', this.onMouseUp, this); |
---|
561 | } |
---|
562 | }, |
---|
563 | // private |
---|
564 | onMouseUp : function(e){ |
---|
565 | if(e.button == 0){ |
---|
566 | this.getClickEl(e, true).removeClass("x-btn-click"); |
---|
567 | Ext.getDoc().un('mouseup', this.onMouseUp, this); |
---|
568 | } |
---|
569 | }, |
---|
570 | // private |
---|
571 | onMenuShow : function(e){ |
---|
572 | this.ignoreNextClick = 0; |
---|
573 | this.el.addClass("x-btn-menu-active"); |
---|
574 | this.fireEvent('menushow', this, this.menu); |
---|
575 | }, |
---|
576 | // private |
---|
577 | onMenuHide : function(e){ |
---|
578 | this.el.removeClass("x-btn-menu-active"); |
---|
579 | this.ignoreNextClick = this.restoreClick.defer(250, this); |
---|
580 | this.fireEvent('menuhide', this, this.menu); |
---|
581 | }, |
---|
582 | |
---|
583 | // private |
---|
584 | restoreClick : function(){ |
---|
585 | this.ignoreNextClick = 0; |
---|
586 | } |
---|
587 | |
---|
588 | |
---|
589 | |
---|
590 | /** |
---|
591 | * @cfg {String} autoEl @hide |
---|
592 | */ |
---|
593 | }); |
---|
594 | Ext.reg('button', Ext.Button); |
---|
595 | |
---|
596 | // Private utility class used by Button |
---|
597 | Ext.ButtonToggleMgr = function(){ |
---|
598 | var groups = {}; |
---|
599 | |
---|
600 | function toggleGroup(btn, state){ |
---|
601 | if(state){ |
---|
602 | var g = groups[btn.toggleGroup]; |
---|
603 | for(var i = 0, l = g.length; i < l; i++){ |
---|
604 | if(g[i] != btn){ |
---|
605 | g[i].toggle(false); |
---|
606 | } |
---|
607 | } |
---|
608 | } |
---|
609 | } |
---|
610 | |
---|
611 | return { |
---|
612 | register : function(btn){ |
---|
613 | if(!btn.toggleGroup){ |
---|
614 | return; |
---|
615 | } |
---|
616 | var g = groups[btn.toggleGroup]; |
---|
617 | if(!g){ |
---|
618 | g = groups[btn.toggleGroup] = []; |
---|
619 | } |
---|
620 | g.push(btn); |
---|
621 | btn.on("toggle", toggleGroup); |
---|
622 | }, |
---|
623 | |
---|
624 | unregister : function(btn){ |
---|
625 | if(!btn.toggleGroup){ |
---|
626 | return; |
---|
627 | } |
---|
628 | var g = groups[btn.toggleGroup]; |
---|
629 | if(g){ |
---|
630 | g.remove(btn); |
---|
631 | btn.un("toggle", toggleGroup); |
---|
632 | } |
---|
633 | } |
---|
634 | }; |
---|
635 | }(); |
---|