/**
- @class Ext.util.ClickRepeater
- @extends Ext.util.Observable
-
- A wrapper class which can be applied to any element. Fires a "click" event while the
- mouse is pressed. The interval between firings may be specified in the config but
- defaults to 20 milliseconds.
-
- Optionally, a CSS class may be applied to the element during the time it is pressed.
-
- @cfg {Mixed} el The element to act as a button.
- @cfg {Number} delay The initial delay before the repeating event begins firing.
- Similar to an autorepeat key delay.
- @cfg {Number} interval The interval between firings of the "click" event. Default 20 ms.
- @cfg {String} pressClass A CSS class name to be applied to the element while pressed.
- @cfg {Boolean} accelerate True if autorepeating should start slowly and accelerate.
- "interval" and "delay" are ignored.
- @cfg {Boolean} preventDefault True to prevent the default click event
- @cfg {Boolean} stopDefault True to stop the default click event
-
- @history
- 2007-02-02 jvs Original code contributed by Nige "Animal" White
- 2007-02-02 jvs Renamed to ClickRepeater
- 2007-02-03 jvs Modifications for FF Mac and Safari
-
- @constructor
- @param {Mixed} el The element to listen on
- @param {Object} config
+
+
+
+
+ The source code
+
+
+
+
+
+
+
/**
+ * @class Ext.util.ClickRepeater
+ * @extends Ext.util.Observable
+ *
+ * A wrapper class which can be applied to any element. Fires a "click" event while the
+ * mouse is pressed. The interval between firings may be specified in the config but
+ * defaults to 20 milliseconds.
+ *
+ * Optionally, a CSS class may be applied to the element during the time it is pressed.
+ *
+ * @constructor
+ * @param {Mixed} el The element to listen on
+ * @param {Object} config
*/
-Ext.util.ClickRepeater = function(el, config)
-{
- this.el = Ext.get(el);
- this.el.unselectable();
-
- Ext.apply(this, config);
-
- this.addEvents(
- /**
- * @event mousedown
- * Fires when the mouse button is depressed.
- * @param {Ext.util.ClickRepeater} this
- */
- "mousedown",
- /**
- * @event click
- * Fires on a specified interval during the time the element is pressed.
- * @param {Ext.util.ClickRepeater} this
- */
- "click",
- /**
- * @event mouseup
- * Fires when the mouse key is released.
- * @param {Ext.util.ClickRepeater} this
- */
- "mouseup"
- );
- if(!this.disabled){
- this.disabled = true;
- this.enable();
- }
+Ext.define('Ext.util.ClickRepeater', {
+ extend: 'Ext.util.Observable',
+
+ constructor : function(el, config){
+ this.el = Ext.get(el);
+ this.el.unselectable();
+
+ Ext.apply(this, config);
+
+ this.addEvents(
+ /**
+ * @event mousedown
+ * Fires when the mouse button is depressed.
+ * @param {Ext.util.ClickRepeater} this
+ * @param {Ext.EventObject} e
+ */
+ "mousedown",
+ /**
+ * @event click
+ * Fires on a specified interval during the time the element is pressed.
+ * @param {Ext.util.ClickRepeater} this
+ * @param {Ext.EventObject} e
+ */
+ "click",
+ /**
+ * @event mouseup
+ * Fires when the mouse key is released.
+ * @param {Ext.util.ClickRepeater} this
+ * @param {Ext.EventObject} e
+ */
+ "mouseup"
+ );
+
+ if(!this.disabled){
+ this.disabled = true;
+ this.enable();
+ }
- // allow inline handler
- if(this.handler){
- this.on("click", this.handler, this.scope || this);
- }
+ // allow inline handler
+ if(this.handler){
+ this.on("click", this.handler, this.scope || this);
+ }
+
+ this.callParent();
+ },
+
+ /**
+ * @cfg {Mixed} el The element to act as a button.
+ */
+
+ /**
+ * @cfg {String} pressedCls A CSS class name to be applied to the element while pressed.
+ */
- Ext.util.ClickRepeater.superclass.constructor.call(this);
-};
+ /**
+ * @cfg {Boolean} accelerate True if autorepeating should start slowly and accelerate.
+ * "interval" and "delay" are ignored.
+ */
-Ext.extend(Ext.util.ClickRepeater, Ext.util.Observable, {
+ /**
+ * @cfg {Number} interval The interval between firings of the "click" event. Default 20 ms.
+ */
interval : 20,
+
+ /**
+ * @cfg {Number} delay The initial delay before the repeating event begins firing.
+ * Similar to an autorepeat key delay.
+ */
delay: 250,
+
+ /**
+ * @cfg {Boolean} preventDefault True to prevent the default click event
+ */
preventDefault : true,
+ /**
+ * @cfg {Boolean} stopDefault True to stop the default click event
+ */
stopDefault : false,
+
timer : 0,
- /**
- * Enables the repeater and allows events to fire.
+ /**
+ * Enables the repeater and allows events to fire.
*/
enable: function(){
if(this.disabled){
this.el.on('mousedown', this.handleMouseDown, this);
+ if (Ext.isIE){
+ this.el.on('dblclick', this.handleDblClick, this);
+ }
if(this.preventDefault || this.stopDefault){
this.el.on('click', this.eventOptions, this);
}
}
this.disabled = false;
},
-
- /**
- * Disables the repeater and stops events from firing.
+
+ /**
+ * Disables the repeater and stops events from firing.
*/
disable: function(/* private */ force){
if(force || !this.disabled){
clearTimeout(this.timer);
- if(this.pressClass){
- this.el.removeClass(this.pressClass);
+ if(this.pressedCls){
+ this.el.removeCls(this.pressedCls);
}
Ext.getDoc().un('mouseup', this.handleMouseUp, this);
this.el.removeAllListeners();
}
this.disabled = true;
},
-
- /**
- * Convenience function for setting disabled/enabled by boolean.
+
+ /**
+ * Convenience function for setting disabled/enabled by boolean.
* @param {Boolean} disabled
*/
setDisabled: function(disabled){
- this[disabled ? 'disable' : 'enable']();
+ this[disabled ? 'disable' : 'enable']();
},
-
+
eventOptions: function(e){
if(this.preventDefault){
e.preventDefault();
}
if(this.stopDefault){
e.stopEvent();
- }
+ }
},
-
+
// private
destroy : function() {
this.disable(true);
Ext.destroy(this.el);
- this.purgeListeners();
+ this.clearListeners();
},
-
+
+ handleDblClick : function(e){
+ clearTimeout(this.timer);
+ this.el.blur();
+
+ this.fireEvent("mousedown", this, e);
+ this.fireEvent("click", this, e);
+ },
+
// private
- handleMouseDown : function(){
+ handleMouseDown : function(e){
clearTimeout(this.timer);
this.el.blur();
- if(this.pressClass){
- this.el.addClass(this.pressClass);
+ if(this.pressedCls){
+ this.el.addCls(this.pressedCls);
}
this.mousedownTime = new Date();
- Ext.getDoc().on("mouseup", this.handleMouseUp, this);
- this.el.on("mouseout", this.handleMouseOut, this);
+ Ext.getDoc().on("mouseup", this.handleMouseUp, this);
+ this.el.on("mouseout", this.handleMouseOut, this);
- this.fireEvent("mousedown", this);
- this.fireEvent("click", this);
+ this.fireEvent("mousedown", this, e);
+ this.fireEvent("click", this, e);
-// Do not honor delay or interval if acceleration wanted.
+ // Do not honor delay or interval if acceleration wanted.
if (this.accelerate) {
this.delay = 400;
- }
- this.timer = this.click.defer(this.delay || this.interval, this);
+ }
+
+ // Re-wrap the event object in a non-shared object, so it doesn't lose its context if
+ // the global shared EventObject gets a new Event put into it before the timer fires.
+ e = new Ext.EventObjectImpl(e);
+
+ this.timer = Ext.defer(this.click, this.delay || this.interval, this, [e]);
},
// private
- click : function(){
- this.fireEvent("click", this);
- this.timer = this.click.defer(this.accelerate ?
- this.easeOutExpo(this.mousedownTime.getElapsed(),
+ click : function(e){
+ this.fireEvent("click", this, e);
+ this.timer = Ext.defer(this.click, this.accelerate ?
+ this.easeOutExpo(Ext.Date.getElapsed(this.mousedownTime),
400,
-390,
12000) :
- this.interval, this);
+ this.interval, this, [e]);
},
easeOutExpo : function (t, b, c, d) {
@@ -175,30 +219,33 @@ Ext.extend(Ext.util.ClickRepeater, Ext.util.Observable, {
// private
handleMouseOut : function(){
clearTimeout(this.timer);
- if(this.pressClass){
- this.el.removeClass(this.pressClass);
+ if(this.pressedCls){
+ this.el.removeCls(this.pressedCls);
}
- this.el.on("mouseover", this.handleMouseReturn, this);
+ this.el.on("mouseover", this.handleMouseReturn, this);
},
// private
handleMouseReturn : function(){
- this.el.un("mouseover", this.handleMouseReturn, this);
- if(this.pressClass){
- this.el.addClass(this.pressClass);
+ this.el.un("mouseover", this.handleMouseReturn, this);
+ if(this.pressedCls){
+ this.el.addCls(this.pressedCls);
}
this.click();
},
// private
- handleMouseUp : function(){
+ handleMouseUp : function(e){
clearTimeout(this.timer);
- this.el.un("mouseover", this.handleMouseReturn, this);
- this.el.un("mouseout", this.handleMouseOut, this);
- Ext.getDoc().un("mouseup", this.handleMouseUp, this);
- this.el.removeClass(this.pressClass);
- this.fireEvent("mouseup", this);
+ this.el.un("mouseover", this.handleMouseReturn, this);
+ this.el.un("mouseout", this.handleMouseOut, this);
+ Ext.getDoc().un("mouseup", this.handleMouseUp, this);
+ if(this.pressedCls){
+ this.el.removeCls(this.pressedCls);
+ }
+ this.fireEvent("mouseup", this, e);
}
-});