Add LongPress support to mobile. Fires a contextmenu event after a single press without movement of 1 second
This commit is contained in:
parent
3c7b66b56c
commit
d133c86b51
@ -170,6 +170,7 @@ var deps = {
|
||||
src: ['dom/DomEvent.js',
|
||||
'dom/DomEvent.DoubleTap.js',
|
||||
'dom/DomEvent.MsTouch.js',
|
||||
'dom/DomEvent.LongPress.js',
|
||||
'core/Handler.js',
|
||||
'map/handler/Map.TouchZoom.js'],
|
||||
deps: ['MapAnimationZoom'],
|
||||
|
@ -17,6 +17,7 @@
|
||||
'dom/DomEvent.js',
|
||||
'dom/DomEvent.DoubleTap.js',
|
||||
'dom/DomEvent.MsTouch.js',
|
||||
'dom/DomEvent.LongPress.js',
|
||||
'dom/DomUtil.js',
|
||||
'dom/Draggable.js',
|
||||
|
||||
|
60
src/dom/DomEvent.LongPress.js
Normal file
60
src/dom/DomEvent.LongPress.js
Normal file
@ -0,0 +1,60 @@
|
||||
L.Util.extend(L.DomEvent, {
|
||||
// inspired by Zepto touch code by Thomas Fuchs
|
||||
addLongPressListener: function (obj, handler, id) {
|
||||
var touch,
|
||||
start,
|
||||
timeoutId = null,
|
||||
delay = 1000,
|
||||
maxMovement = 10,
|
||||
diffX, diffY,
|
||||
pre = '_leaflet_',
|
||||
touchstart = 'touchstart',
|
||||
touchmove = 'touchmove',
|
||||
touchend = 'touchend';
|
||||
|
||||
function onTouchStart(e) {
|
||||
clearTimeout(timeoutId);
|
||||
|
||||
if (e.touches.length !== 1) {
|
||||
return;
|
||||
}
|
||||
|
||||
touch = e.touches[0];
|
||||
start = Date.now();
|
||||
|
||||
timeoutId = setTimeout(function () {
|
||||
touch.type = 'contextmenu';
|
||||
handler(touch);
|
||||
}, delay);
|
||||
}
|
||||
|
||||
function onTouchMove(e) {
|
||||
diffX = e.touches[0].pageX - touch.pageX;
|
||||
diffY = e.touches[0].pageY - touch.pageY;
|
||||
|
||||
if (diffX * diffX + diffY * diffY > maxMovement * maxMovement) {
|
||||
clearTimeout(timeoutId);
|
||||
}
|
||||
}
|
||||
|
||||
function onTouchEnd() {
|
||||
clearTimeout(timeoutId);
|
||||
}
|
||||
obj[pre + touchstart + id] = onTouchStart;
|
||||
obj[pre + touchmove + id] = onTouchMove;
|
||||
obj[pre + touchend + id] = onTouchEnd;
|
||||
|
||||
obj.addEventListener(touchstart, onTouchStart, false);
|
||||
obj.addEventListener(touchmove, onTouchMove, false);
|
||||
obj.addEventListener(touchend, onTouchEnd, false);
|
||||
return this;
|
||||
},
|
||||
|
||||
removeLongPressListener: function (obj, id) {
|
||||
var pre = '_leaflet_';
|
||||
obj.removeEventListener(obj, obj[pre + 'touchstart' + id], false);
|
||||
obj.removeEventListener(obj, obj[pre + 'touchmove' + id], false);
|
||||
obj.removeEventListener(obj, obj[pre + 'touchend' + id], false);
|
||||
return this;
|
||||
}
|
||||
});
|
@ -21,6 +21,9 @@ L.DomEvent = {
|
||||
} else if (L.Browser.touch && (type === 'dblclick') && this.addDoubleTapListener) {
|
||||
return this.addDoubleTapListener(obj, handler, id);
|
||||
|
||||
} else if (L.Browser.touch && (type === 'contextmenu') && this.addLongPressListener) {
|
||||
return this.addLongPressListener(obj, handler, id);
|
||||
|
||||
} else if ('addEventListener' in obj) {
|
||||
|
||||
if (type === 'mousewheel') {
|
||||
|
Loading…
Reference in New Issue
Block a user