view release on metacpan or  search on metacpan

share/docs/source/ClickRepeater.html  view on Meta::CPAN

 @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
 */
Ext.util.ClickRepeater = Ext.extend(Ext.util.Observable, {
    
    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();
        }

        // allow inline handler
        if(this.handler){
            this.on(&quot;click&quot;, this.handler,  this.scope || this);
        }

        Ext.util.ClickRepeater.superclass.constructor.call(this);        
    },
    
<span id='Ext-util-ClickRepeater-property-interval'>    interval : 20,
</span><span id='Ext-util-ClickRepeater-property-delay'>    delay: 250,
</span><span id='Ext-util-ClickRepeater-property-preventDefault'>    preventDefault : true,
</span><span id='Ext-util-ClickRepeater-property-stopDefault'>    stopDefault : false,
</span><span id='Ext-util-ClickRepeater-property-timer'>    timer : 0,
</span>
<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);
            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;
    },

<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);
            if(this.pressClass){
                this.el.removeClass(this.pressClass);
            }
            Ext.getDoc().un('mouseup', this.handleMouseUp, this);
            this.el.removeAllListeners();
        }
        this.disabled = true;
    },

<span id='Ext-util-ClickRepeater-method-setDisabled'>    /**
</span>     * Convenience function for setting disabled/enabled by boolean.
     * @param {Boolean} disabled
     */
    setDisabled: function(disabled){
        this[disabled ? 'disable' : 'enable']();
    },

<span id='Ext-util-ClickRepeater-method-eventOptions'>    eventOptions: function(e){
</span>        if(this.preventDefault){
            e.preventDefault();
        }
        if(this.stopDefault){
            e.stopEvent();
        }
    },

<span id='Ext-util-ClickRepeater-method-destroy'>    // private
</span>    destroy : function() {
        this.disable(true);
        Ext.destroy(this.el);
        this.purgeListeners();
    },

<span id='Ext-util-ClickRepeater-method-handleDblClick'>    handleDblClick : function(e){
</span>        clearTimeout(this.timer);
        this.el.blur();

        this.fireEvent(&quot;mousedown&quot;, this, e);
        this.fireEvent(&quot;click&quot;, this, e);
    },

<span id='Ext-util-ClickRepeater-method-handleMouseDown'>    // private
</span>    handleMouseDown : function(e){
        clearTimeout(this.timer);
        this.el.blur();
        if(this.pressClass){
            this.el.addClass(this.pressClass);
        }
        this.mousedownTime = new Date();

        Ext.getDoc().on(&quot;mouseup&quot;, this.handleMouseUp, this);
        this.el.on(&quot;mouseout&quot;, this.handleMouseOut, this);

        this.fireEvent(&quot;mousedown&quot;, this, e);
        this.fireEvent(&quot;click&quot;, this, e);

        // 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, [e]);
    },

<span id='Ext-util-ClickRepeater-method-click'>    // private
</span>    click : function(e){
        this.fireEvent(&quot;click&quot;, this, e);
        this.timer = this.click.defer(this.accelerate ?
            this.easeOutExpo(this.mousedownTime.getElapsed(),
                400,
                -390,
                12000) :
            this.interval, this, [e]);
    },

<span id='Ext-util-ClickRepeater-method-easeOutExpo'>    easeOutExpo : function (t, b, c, d) {
</span>        return (t==d) ? b+c : c * (-Math.pow(2, -10 * t/d) + 1) + b;
    },

<span id='Ext-util-ClickRepeater-method-handleMouseOut'>    // private
</span>    handleMouseOut : function(){
        clearTimeout(this.timer);
        if(this.pressClass){
            this.el.removeClass(this.pressClass);
        }
        this.el.on(&quot;mouseover&quot;, this.handleMouseReturn, this);
    },

<span id='Ext-util-ClickRepeater-method-handleMouseReturn'>    // private
</span>    handleMouseReturn : function(){
        this.el.un(&quot;mouseover&quot;, this.handleMouseReturn, this);
        if(this.pressClass){
            this.el.addClass(this.pressClass);
        }
        this.click();
    },

<span id='Ext-util-ClickRepeater-method-handleMouseUp'>    // private
</span>    handleMouseUp : function(e){
        clearTimeout(this.timer);
        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);
        this.el.removeClass(this.pressClass);
        this.fireEvent(&quot;mouseup&quot;, this, e);
    }
});</pre>
</body>
</html>