I really need the function pause drag and continue drag with conditions
thangnm93 opened this issue · comments
Firstly I want to say thank you to you for this excellent plugin.
As my title above, I need a new method or something like that, that I can stop moving draggable if the draggable box moving out the circle.
Currently, I have used draggie._pointerUp(event.originalEvent, pointer);
for leaving the event drag, but I don't want to leave this event, I just want to pause the mouse event moving out the circle, after that the mouse moved to inside the circle the moving draggable will works again.
Codepen: https://codepen.io/thangnm93/pen/ExNxgKZ
My condition here:
$draggables.on('dragMove', function(event, pointer, moveVector) {
let position = $(this).data('draggabilly').position;
if ($.limitPoint1(xCenter, yCenter, width, height, radius, position.x, position.y) ||
$.limitPoint2(xCenter, yCenter, width, height, radius, position.x, position.y) ||
$.limitPoint3(xCenter, yCenter, width, height, radius, position.x, position.y) ||
$.limitPoint4(xCenter, yCenter, width, height, radius, position.x, position.y)
) {
draggie._pointerUp(event.originalEvent, pointer);
}
});
I expected the result is:
$draggables.on('dragMove', function(event, pointer, moveVector) {
let position = $(this).data('draggabilly').position;
if ($.limitPoint1(xCenter, yCenter, width, height, radius, position.x, position.y) ||
$.limitPoint2(xCenter, yCenter, width, height, radius, position.x, position.y) ||
$.limitPoint3(xCenter, yCenter, width, height, radius, position.x, position.y) ||
$.limitPoint4(xCenter, yCenter, width, height, radius, position.x, position.y)
) {
draggie.pauseDrag(event, pointer);
} else {
draggie.continueDrag(event, pointer);
}
});
Do you have any ideas for my case?
Thank you for your help.