diff --git a/src/interaction/InteractionManager.js b/src/interaction/InteractionManager.js index e45a319..c880280 100644 --- a/src/interaction/InteractionManager.js +++ b/src/interaction/InteractionManager.js @@ -43,6 +43,9 @@ /** * Should default browser actions automatically be prevented. + * Does not apply to pointer events for backwards compatibility + * preventDefault on pointer events stops mouse events from firing + * Thus, for every pointer event, there will always be either a mouse of touch event alongside it. * * @member {boolean} * @default true @@ -511,19 +514,10 @@ this.interactionDOMElement.style['touch-action'] = 'none'; } - window.document.addEventListener('mousemove', this.onMouseMove, true); - this.interactionDOMElement.addEventListener('mousedown', this.onMouseDown, true); - this.interactionDOMElement.addEventListener('mouseout', this.onMouseOut, true); - this.interactionDOMElement.addEventListener('mouseover', this.onMouseOver, true); - window.addEventListener('mouseup', this.onMouseUp, true); - - if (this.supportsTouchEvents) - { - this.interactionDOMElement.addEventListener('touchstart', this.onTouchStart, true); - this.interactionDOMElement.addEventListener('touchend', this.onTouchEnd, true); - this.interactionDOMElement.addEventListener('touchmove', this.onTouchMove, true); - } - + /** + * These events are added first, so that if pointer events are normalised, they are fired + * in the same order as non-normalised events. ie. pointer event 1st, mouse / touch 2nd + */ if (this.supportsPointerEvents) { window.document.addEventListener('pointermove', this.onPointerMove, true); @@ -556,6 +550,19 @@ } } + window.document.addEventListener('mousemove', this.onMouseMove, true); + this.interactionDOMElement.addEventListener('mousedown', this.onMouseDown, true); + this.interactionDOMElement.addEventListener('mouseout', this.onMouseOut, true); + this.interactionDOMElement.addEventListener('mouseover', this.onMouseOver, true); + window.addEventListener('mouseup', this.onMouseUp, true); + + if (this.supportsTouchEvents) + { + this.interactionDOMElement.addEventListener('touchstart', this.onTouchStart, true); + this.interactionDOMElement.addEventListener('touchend', this.onTouchEnd, true); + this.interactionDOMElement.addEventListener('touchmove', this.onTouchMove, true); + } + this.eventsAdded = true; } @@ -583,19 +590,6 @@ this.interactionDOMElement.style['touch-action'] = ''; } - window.document.removeEventListener('mousemove', this.onMouseMove, true); - this.interactionDOMElement.removeEventListener('mousedown', this.onMouseDown, true); - this.interactionDOMElement.removeEventListener('mouseout', this.onMouseOut, true); - this.interactionDOMElement.removeEventListener('mouseover', this.onMouseOver, true); - window.removeEventListener('mouseup', this.onMouseUp, true); - - if (this.supportsTouchEvents) - { - this.interactionDOMElement.removeEventListener('touchstart', this.onTouchStart, true); - this.interactionDOMElement.removeEventListener('touchend', this.onTouchEnd, true); - this.interactionDOMElement.removeEventListener('touchmove', this.onTouchMove, true); - } - if (this.supportsPointerEvents) { window.document.removeEventListener('pointermove', this.onPointerMove, true); @@ -628,6 +622,19 @@ } } + window.document.removeEventListener('mousemove', this.onMouseMove, true); + this.interactionDOMElement.removeEventListener('mousedown', this.onMouseDown, true); + this.interactionDOMElement.removeEventListener('mouseout', this.onMouseOut, true); + this.interactionDOMElement.removeEventListener('mouseover', this.onMouseOver, true); + window.removeEventListener('mouseup', this.onMouseUp, true); + + if (this.supportsTouchEvents) + { + this.interactionDOMElement.removeEventListener('touchstart', this.onTouchStart, true); + this.interactionDOMElement.removeEventListener('touchend', this.onTouchEnd, true); + this.interactionDOMElement.removeEventListener('touchmove', this.onTouchMove, true); + } + this.interactionDOMElement = null; this.eventsAdded = false; @@ -1109,7 +1116,12 @@ // Update internal pointer reference this.mapPositionToPoint(this.pointer.global, event.clientX, event.clientY); - if (this.autoPreventDefault) + /** + * No need to prevent default on natural pointer events, as there are no side effects + * Normalized events, however, may have the double mousedown/touchstart issue on the native android browser, + * so still need to be prevented. + */ + if (this.autoPreventDefault && (this.normalizeMouseEvents || this.normalizeTouchEvents)) { this.pointer.originalEvent.preventDefault(); }