Add support for long press - a delay before _touchStart handles click event

[jayagl]

I've changed _touchStart to only handle a touch event if touch is held for the number of milliseconds specified by the global property touchPunchDelay. The property is optional and behaviour is as before if it's not specified. This is essential if using touch-punch for enabling drag and drop on touch devices and avoiding accidental dragging on scroll.

[powerpaul17]

As this is a very useful (and in my opinion a must-have) feature, I want to ask if/when this is going to be merged?

[ndbroadbent]

Awesome, thanks @jayagl! This is a good start but there's still some issues. I noticed that scrolling is still stopped after the delay. I'm using jquery UI sortable, and if the touch starts on a sortable element, i can scroll the page until the mouse event fires after touchPunchDelay. Then the page stops scrolling. For my case, I need to cancel the even if the user starts scrolling immediately. And only fire the event if they haven't moved their finger for touchPunchDelay ms.

Also for anyone else who finds this issue, you need to disable the iOS "callout" that pops up when you long press an image, and you can do that with this CSS:

img.sortable-image {
   -webkit-touch-callout: none;
}

EDIT: I think it's a problem with the way you're using this in your code. The handler functions don't always have access to the same this, so self._touchMoved isn't working as expected. You should be using a variable that is declared with the other vars in var mouseProto = ....

EDIT 2: Ohhh, this is also breaking inside nested jquery UI sortable widgets. The second touch event isn't handled so it breaks scrolling. Maybe needs a counter somewhere instead of a boolean flag.

[wallyhall]

A small app I'm involved with just got an alpha quality demo shown to a few users, they all naturally wanted to long-press on mobile to drag. I'm absolutely +1'ing this feature!

[frmeran]

// Ignore multi-touch events
if (event.originalEvent.touches.length > 1) {
    return;
}

if(event.cancelable) {
    event.preventDefault();
}

this fix it