git.ithinksw.org / extjs.git / blobdiff
? search:
summary | shortlog | log | commit | commitdiff | tree
raw | inline | side by side
Upgrade to ExtJS 4.0.7 - Released 10/19/2011
[extjs.git] / docs / source / ClickRepeater.html
diff --git a/docs/source/ClickRepeater.html b/docs/source/ClickRepeater.html
index f9714f1..60d9686 100644 (file)
--- a/docs/source/ClickRepeater.html
+++ b/docs/source/ClickRepeater.html
@@ -1,170 +1,216 @@
-<html>\r
-<head>\r
-  <title>The source code</title>\r
-    <link href="../resources/prettify/prettify.css" type="text/css" rel="stylesheet" />\r
-    <script type="text/javascript" src="../resources/prettify/prettify.js"></script>\r
-</head>\r
-<body  onload="prettyPrint();">\r
-    <pre class="prettyprint lang-js"><div id="cls-Ext.util.ClickRepeater"></div>/**
- @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
+<!DOCTYPE html>
+<html>
+<head>
+  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+  <title>The source code</title>
+  <link href="../resources/prettify/prettify.css" type="text/css" rel="stylesheet" />
+  <script type="text/javascript" src="../resources/prettify/prettify.js"></script>
+  <style type="text/css">
+    .highlight { display: block; background-color: #ddd; }
+  </style>
+  <script type="text/javascript">
+    function highlight() {
+      document.getElementById(location.hash.replace(/#/, "")).className = "highlight";
+    }
+  </script>
+</head>
+<body onload="prettyPrint(); highlight();">
+  <pre class="prettyprint lang-js"><span id='Ext-util-ClickRepeater'>/**
+</span> * @class Ext.util.ClickRepeater
+ * @extends Ext.util.Observable
+ *
+ * A wrapper class which can be applied to any element. Fires a &quot;click&quot; 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.
+ *
  */
  */
-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
+Ext.define('Ext.util.ClickRepeater', {
+    extend: 'Ext.util.Observable',
+
+<span id='Ext-util-ClickRepeater-method-constructor'>    /**
+</span>     * Creates new ClickRepeater.
+     * @param {String/HTMLElement/Ext.Element} el The element or its ID to listen on
+     * @param {Object} config (optional) Config object.
      */
      */
-        "mouseup"
-    );
+    constructor : function(el, config){
+        this.el = Ext.get(el);
+        this.el.unselectable();
+
+        Ext.apply(this, config);
+
+        this.addEvents(
+<span id='Ext-util-ClickRepeater-event-mousedown'>        /**
+</span>         * @event mousedown
+         * Fires when the mouse button is depressed.
+         * @param {Ext.util.ClickRepeater} this
+         * @param {Ext.EventObject} e
+         */
+        &quot;mousedown&quot;,
+<span id='Ext-util-ClickRepeater-event-click'>        /**
+</span>         * @event click
+         * Fires on a specified interval during the time the element is pressed.
+         * @param {Ext.util.ClickRepeater} this
+         * @param {Ext.EventObject} e
+         */
+        &quot;click&quot;,
+<span id='Ext-util-ClickRepeater-event-mouseup'>        /**
+</span>         * @event mouseup
+         * Fires when the mouse key is released.
+         * @param {Ext.util.ClickRepeater} this
+         * @param {Ext.EventObject} e
+         */
+        &quot;mouseup&quot;
+        );
+
+        if(!this.disabled){
+            this.disabled = true;
+            this.enable();
+        }
 
 
-    if(!this.disabled){
-        this.disabled = true;
-        this.enable();
-    }
+        // allow inline handler
+        if(this.handler){
+            this.on(&quot;click&quot;, this.handler,  this.scope || this);
+        }
 
 
-    // allow inline handler
-    if(this.handler){
-        this.on("click", this.handler,  this.scope || this);
-    }
+        this.callParent();
+    },
 
 
-    Ext.util.ClickRepeater.superclass.constructor.call(this);
-};
+<span id='Ext-util-ClickRepeater-cfg-el'>    /**
+</span>     * @cfg {String/HTMLElement/Ext.Element} el The element to act as a button.
+     */
+
+<span id='Ext-util-ClickRepeater-cfg-pressedCls'>    /**
+</span>     * @cfg {String} pressedCls A CSS class name to be applied to the element while pressed.
+     */
+
+<span id='Ext-util-ClickRepeater-cfg-accelerate'>    /**
+</span>     * @cfg {Boolean} accelerate True if autorepeating should start slowly and accelerate.
+     * &quot;interval&quot; and &quot;delay&quot; are ignored.
+     */
 
 
-Ext.extend(Ext.util.ClickRepeater, Ext.util.Observable, {
+<span id='Ext-util-ClickRepeater-cfg-interval'>    /**
+</span>     * @cfg {Number} interval The interval between firings of the &quot;click&quot; event. Default 20 ms.
+     */
     interval : 20,
     interval : 20,
+
+<span id='Ext-util-ClickRepeater-cfg-delay'>    /**
+</span>     * @cfg {Number} delay The initial delay before the repeating event begins firing.
+     * Similar to an autorepeat key delay.
+     */
     delay: 250,
     delay: 250,
+
+<span id='Ext-util-ClickRepeater-cfg-preventDefault'>    /**
+</span>     * @cfg {Boolean} preventDefault True to prevent the default click event
+     */
     preventDefault : true,
     preventDefault : true,
+<span id='Ext-util-ClickRepeater-cfg-stopDefault'>    /**
+</span>     * @cfg {Boolean} stopDefault True to stop the default click event
+     */
     stopDefault : false,
     stopDefault : false,
+
     timer : 0,
 
     timer : 0,
 
-    /**
-     * Enables the repeater and allows events to fire.
+<span id='Ext-util-ClickRepeater-method-enable'>    /**
+</span>     * Enables the repeater and allows events to fire.
      */
     enable: function(){
         if(this.disabled){
             this.el.on('mousedown', this.handleMouseDown, this);
      */
     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;
     },
             if(this.preventDefault || this.stopDefault){
                 this.el.on('click', this.eventOptions, this);
             }
         }
         this.disabled = false;
     },
-    
-    /**
-     * Disables the repeater and stops events from firing.
+
+<span id='Ext-util-ClickRepeater-method-disable'>    /**
+</span>     * Disables the repeater and stops events from firing.
      */
     disable: function(/* private */ force){
         if(force || !this.disabled){
             clearTimeout(this.timer);
      */
     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;
     },
             }
             Ext.getDoc().un('mouseup', this.handleMouseUp, this);
             this.el.removeAllListeners();
         }
         this.disabled = true;
     },
-    
-    /**
-     * Convenience function for setting disabled/enabled by boolean.
+
+<span id='Ext-util-ClickRepeater-method-setDisabled'>    /**
+</span>     * Convenience function for setting disabled/enabled by boolean.
      * @param {Boolean} disabled
      */
     setDisabled: function(disabled){
      * @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();
     eventOptions: function(e){
         if(this.preventDefault){
             e.preventDefault();
         }
         if(this.stopDefault){
             e.stopEvent();
-        }       
+        }
     },
     },
-    
+
     // private
     destroy : function() {
         this.disable(true);
         Ext.destroy(this.el);
     // 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(&quot;mousedown&quot;, this, e);
+        this.fireEvent(&quot;click&quot;, this, e);
+    },
+
     // private
     // private
-    handleMouseDown : function(){
+    handleMouseDown : function(e){
         clearTimeout(this.timer);
         this.el.blur();
         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();
 
         }
         this.mousedownTime = new Date();
 
-        Ext.getDoc().on("mouseup", this.handleMouseUp, this);
-        this.el.on("mouseout", this.handleMouseOut, this);
+        Ext.getDoc().on(&quot;mouseup&quot;, this.handleMouseUp, this);
+        this.el.on(&quot;mouseout&quot;, this.handleMouseOut, this);
 
 
-        this.fireEvent("mousedown", this);
-        this.fireEvent("click", this);
+        this.fireEvent(&quot;mousedown&quot;, this, e);
+        this.fireEvent(&quot;click&quot;, 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;
         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
     },
 
     // private
-    click : function(){
-        this.fireEvent("click", this);
-        this.timer = this.click.defer(this.accelerate ?
-            this.easeOutExpo(this.mousedownTime.getElapsed(),
+    click : function(e){
+        this.fireEvent(&quot;click&quot;, this, e);
+        this.timer =  Ext.defer(this.click, this.accelerate ?
+            this.easeOutExpo(Ext.Date.getElapsed(this.mousedownTime),
                 400,
                 -390,
                 12000) :
                 400,
                 -390,
                 12000) :
-            this.interval, this);
+            this.interval, this, [e]);
     },
 
     easeOutExpo : function (t, b, c, d) {
     },
 
     easeOutExpo : function (t, b, c, d) {
@@ -174,30 +220,33 @@ Ext.extend(Ext.util.ClickRepeater, Ext.util.Observable, {
     // private
     handleMouseOut : function(){
         clearTimeout(this.timer);
     // 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(&quot;mouseover&quot;, this.handleMouseReturn, this);
     },
 
     // private
     handleMouseReturn : function(){
     },
 
     // private
     handleMouseReturn : function(){
-        this.el.un("mouseover", this.handleMouseReturn, this);
-        if(this.pressClass){
-            this.el.addClass(this.pressClass);
+        this.el.un(&quot;mouseover&quot;, this.handleMouseReturn, this);
+        if(this.pressedCls){
+            this.el.addCls(this.pressedCls);
         }
         this.click();
     },
 
     // private
         }
         this.click();
     },
 
     // private
-    handleMouseUp : function(){
+    handleMouseUp : function(e){
         clearTimeout(this.timer);
         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(&quot;mouseover&quot;, this.handleMouseReturn, this);
+        this.el.un(&quot;mouseout&quot;, this.handleMouseOut, this);
+        Ext.getDoc().un(&quot;mouseup&quot;, this.handleMouseUp, this);
+        if(this.pressedCls){
+            this.el.removeCls(this.pressedCls);
+        }
+        this.fireEvent(&quot;mouseup&quot;, this, e);
     }
     }
-});</pre>    \r
-</body>\r
-</html>
\ No newline at end of file
+});
+</pre>
+</body>
+</html>
Mirror of ExtJS by Sencha Inc. <http://www.sencha.com/>.