diff --git a/examples/draw-and-modify-features.js b/examples/draw-and-modify-features.js index d28118d920..4da34fced8 100644 --- a/examples/draw-and-modify-features.js +++ b/examples/draw-and-modify-features.js @@ -71,9 +71,4 @@ typeSelect.onchange = function() { addInteractions(); }; -// Avoid context menu for long taps when editing on mobile -map.getTargetElement().oncontextmenu = function(e) { - e.preventDefault(); -}; - addInteractions(); diff --git a/src/ol/PluggableMap.js b/src/ol/PluggableMap.js index 187d1b1fdf..eef8b2e74a 100644 --- a/src/ol/PluggableMap.js +++ b/src/ol/PluggableMap.js @@ -267,6 +267,8 @@ const PluggableMap = function(options) { */ this.keyHandlerKeys_ = null; + _ol_events_.listen(this.viewport_, EventType.CONTEXTMENU, + this.handleBrowserEvent, this); _ol_events_.listen(this.viewport_, EventType.WHEEL, this.handleBrowserEvent, this); _ol_events_.listen(this.viewport_, EventType.MOUSEWHEEL, @@ -491,6 +493,8 @@ PluggableMap.prototype.addOverlayInternal_ = function(overlay) { */ PluggableMap.prototype.disposeInternal = function() { this.mapBrowserEventHandler_.dispose(); + _ol_events_.unlisten(this.viewport_, EventType.CONTEXTMENU, + this.handleBrowserEvent, this); _ol_events_.unlisten(this.viewport_, EventType.WHEEL, this.handleBrowserEvent, this); _ol_events_.unlisten(this.viewport_, EventType.MOUSEWHEEL, diff --git a/src/ol/events/EventType.js b/src/ol/events/EventType.js index 78b3b6ae82..3e7689d36b 100644 --- a/src/ol/events/EventType.js +++ b/src/ol/events/EventType.js @@ -15,6 +15,7 @@ export default { CHANGE: 'change', CLEAR: 'clear', + CONTEXTMENU: 'contextmenu', CLICK: 'click', DBLCLICK: 'dblclick', DRAGENTER: 'dragenter', diff --git a/src/ol/interaction/Draw.js b/src/ol/interaction/Draw.js index 58d281cc59..7420c9a387 100644 --- a/src/ol/interaction/Draw.js +++ b/src/ol/interaction/Draw.js @@ -2,6 +2,7 @@ * @module ol/interaction/Draw */ import {inherits} from '../index.js'; +import EventType from '../events/EventType.js'; import Feature from '../Feature.js'; import MapBrowserEventType from '../MapBrowserEventType.js'; import MapBrowserPointerEvent from '../MapBrowserPointerEvent.js'; @@ -336,6 +337,10 @@ Draw.prototype.setMap = function(map) { * @api */ Draw.handleEvent = function(event) { + if (event.originalEvent.type === EventType.CONTEXTMENU) { + // Avoid context menu for long taps when drawing on mobile + event.preventDefault(); + } this.freehand_ = this.mode_ !== Draw.Mode_.POINT && this.freehandCondition_(event); let move = event.type === MapBrowserEventType.POINTERMOVE; let pass = true;