jquery-ui-touch-punch icon indicating copy to clipboard operation
jquery-ui-touch-punch copied to clipboard

Detecting Longpress

Open ttseng opened this issue 9 years ago • 6 comments

I would like to enable draggable elements on my page on a longpress. I tried implementing this using mouseup and mousedown in javascript as follows:

  $('.stepNode').mouseup(function(){
              // console.log('clear timing');
              clearTimeout(pressTimer);
              $('.stepNode').draggable('disable');
              $('body').tap();
              return false;
            }).mousedown(function(){
                element = $(this);
              pressTimer = window.setTimeout(function(){
                // console.log('enabling dragging');
                makeCurrentStep(element);
                $('.stepNode').draggable('enable');
              }, 500);
              return false;
            });

You can check that this works on a desktop here: http://bip-android-test.herokuapp.com/projects/776/steps/mobile?auth_token=yC7dCCh8Lfkr8CxLfZ4Z&tree_width=2 The block that you long click on becomes highlighted in yellow after a short delay and becomes draggable.

But when I check it on mobile, the mousedown event doesn't seem to be registered on a long press.

Is there a way to implement long press using jquery-ui-touch-punch?

ttseng avatar Sep 08 '15 19:09 ttseng

I would also LOVE to know a way to implement this. Otherwise, when you try to scroll the page you end up dragging and dropping items you don't mean to drag and drop.

boxystudio avatar Nov 06 '15 04:11 boxystudio

:+1:

brchristian avatar Dec 02 '15 22:12 brchristian

+1

bhofstaetter avatar Apr 28 '16 16:04 bhofstaetter

+1

liamjohnston avatar May 09 '16 23:05 liamjohnston

+1

jayagl avatar Aug 22 '17 00:08 jayagl

I've created a pull request which implements this using a global touchPunchDelay property

jayagl avatar Aug 24 '17 00:08 jayagl