1 //

     2 // Use LongPress() to set a function callback for a long-press on a particular DOM element.

     3 //   Parameters:

     4 //      elementId: id string of the element

     5 //      callback: the function to be called when the long-press fires

     6 //      mouseDownCallback: the function to be called on mouse-down

     7 //   Example:

     8 //        <javascript ...> 

     9 //          new LongPress("btnId", function(el) { alert("hello"); });

    10 //        </javascript>

    11 //        ...

    12 //        <img id="btnId" ... />

    13 //

    14 function LongPress(elementId, callback, mouseDownCallback) {

    15     this.el = document.getElementById(elementId);

    16     this.callback = callback;

    17     this.initialX = 0;

    18     this.initialY = 0;

    19     this.mouseDownCallback = mouseDownCallback;

    20 

    21 	if(!this.el) {

    22 		window.app.debug("LongPress: element " + elementId + " not found");

    23 		return;

    24 	}

    25 

    26     this.onTimerFired = function() {

    27         window.app.debug("onTimerFired");

    28         this.callback(this.el);

    29         this.cancelTimer();

    30         this.unregisterMouseMove();

    31     }

    32 

    33     this.startTimer = function() {

    34         this.cancelTimer();

    35         this.timer = window.setTimeout(createDelegate(this, this.onTimerFired), 1000);

    36 	}

    37 

    38     this.cancelTimer = function() {

    39         if(this.timer) {

    40             window.clearTimeout(this.timer);

    41             this.timer = null;

    42         }

    43     }

    44 

    45     // Stop tracking mouse movements.

    46     this.unregisterMouseMove= function() {

    47         this.el.onmousemove = null;

    48     }

    49 

    50     this.cancel = function() {

    51         //window.app.debug("cancel");

    52         this.cancelTimer();

    53         this.unregisterMouseMove();

    54     }

    55 

    56     // If the mouse has moved too much it's not considered a long press, so cancel.

    57     this.onMouseMove = function() {

    58         //window.app.debug("LongPress::onMouseMove " + this + " event=" + window.event +

    59         //                    " " + window.event.clientX + "," + window.event.clientY);

    60         if(Math.abs(this.initialX - window.event.clientX) > 4 ||

    61            Math.abs(this.initialY - window.event.clientY) > 4) {

    62             this.cancel();

    63         }

    64     }

    65 

    66     // Start tracking the mouse and save the initial mouse coords.

    67     this.onMouseDown = function() {

    68         window.app.debug("LongPress::onMouseDown " + this);

    69         this.isDown = true;

    70         this.initialX = window.event.clientX;

    71         this.initialY = window.event.clientY;

    72         this.el.onmousemove = this.onMouseMove.bind(this);

    73         this.startTimer();

    74         if(this.mouseDownCallback != undefined)

    75             this.mouseDownCallback(this);

    76     }

    77 

    78 	this.el.onmousedown = this.onMouseDown.bind(this);

    79 

    80     // Cancel tracking on mouse up and out events, ie. not a long press.

    81 	this.el.onmouseup = this.cancel.bind(this);

    82 	this.el.onmouseout = this.cancel.bind(this);

    83 }