use separate pointer event handler for document when dragging

src/ol/mapbrowserevent.js

@@ -168,11 +168,23 @@ ol.MapBrowserEventHandler = function(map) {
   this.trackedTouches_ = {};
 
   /**
+   * Event handler which generates pointer events for
+   * the viewport element.
+   *
    * @type {ol.pointer.PointerEventHandler}
    * @private
    */
   this.pointerEventHandler_ = new ol.pointer.PointerEventHandler(element);
 
+  /**
+   * Event handler which generates pointer events for
+   * the document (used when dragging).
+   *
+   * @type {ol.pointer.PointerEventHandler}
+   * @private
+   */
+  this.documentPointerEventHandler_ = null;
+
   this.pointerdownListenerKey_ = goog.events.listen(this.pointerEventHandler_,
       ol.pointer.EventType.POINTERDOWN,
       this.handlePointerDown_, false, this);
@@ -181,8 +193,7 @@ goog.inherits(ol.MapBrowserEventHandler, goog.events.EventTarget);
 
 
 /**
- * Get the last "down" type event.  This will be set on mousedown,
+ * Get the last "down" type event. This will be set on pointerdown.
- * touchstart, and pointerdown.
  * @return {ol.pointer.PointerEvent} The most recent "down" type event (or null
  * if none have occurred).
  */
@@ -246,14 +257,10 @@ ol.MapBrowserEventHandler.prototype.handlePointerUp_ = function(pointerEvent) {
   this.dispatchEvent(newEvent);
 
   if (this.activePointers_ <= 0) {
-    this.pointerEventHandler_.unlistenOnDocument(
-        ol.MapBrowserEvent.EventType.POINTERMOVE,
-        this.handlePointerMove_, false, this);
-    this.pointerEventHandler_.unlistenOnDocument(
-        ol.MapBrowserEvent.EventType.POINTERUP,
-        this.handlePointerUp_, false, this);
     goog.array.forEach(this.dragListenerKeys_, goog.events.unlistenByKey);
     this.dragListenerKeys_ = null;
+    this.documentPointerEventHandler_.dispose();
+    this.documentPointerEventHandler_ = null;
   }
 
   // We emulate click event on left mouse button click, touch contact, and pen
@@ -282,16 +289,22 @@ ol.MapBrowserEventHandler.prototype.handlePointerDown_ =
   this.dragged_ = false;
 
   if (goog.isNull(this.dragListenerKeys_)) {
-    this.pointerEventHandler_.listenOnDocument(
+    /* Set up a pointer event handler on the `document`,
-        ol.MapBrowserEvent.EventType.POINTERMOVE,
+     * which is required when the pointer is moved outside
-        this.handlePointerMove_, false, this);
+     * the viewport when dragging.
-    this.pointerEventHandler_.listenOnDocument(
+     */
-        ol.MapBrowserEvent.EventType.POINTERUP,
+    this.documentPointerEventHandler_ =
-        this.handlePointerUp_, false, this);
+        new ol.pointer.PointerEventHandler(document);
 
     this.dragListenerKeys_ = [
+      goog.events.listen(this.documentPointerEventHandler_,
+          ol.MapBrowserEvent.EventType.POINTERMOVE,
+          this.handlePointerMove_, false, this),
+      goog.events.listen(this.documentPointerEventHandler_,
+          ol.MapBrowserEvent.EventType.POINTERUP,
+          this.handlePointerUp_, false, this),
       goog.events.listen(this.pointerEventHandler_,
-          [ol.MapBrowserEvent.EventType.POINTERCANCEL],
+          ol.MapBrowserEvent.EventType.POINTERCANCEL,
           this.handlePointerUp_, false, this)
     ];
   }
@@ -330,7 +343,7 @@ ol.MapBrowserEventHandler.prototype.handlePointerMove_ =
 
 
 /**
- * FIXME empty description for jsdoc
+ * @inheritDoc
  */
 ol.MapBrowserEventHandler.prototype.disposeInternal = function() {
   if (!goog.isNull(this.pointerdownListenerKey_)) {
@@ -341,10 +354,13 @@ ol.MapBrowserEventHandler.prototype.disposeInternal = function() {
     goog.array.forEach(this.dragListenerKeys_, goog.events.unlistenByKey);
     this.dragListenerKeys_ = null;
   }
-  if (ol.LEGACY_IE_SUPPORT && ol.IS_LEGACY_IE &&
+  if (!goog.isNull(this.documentPointerEventHandler_)) {
-      !goog.isNull(this.ieDblclickListenerKey_)) {
+    this.documentPointerEventHandler_.dispose();
-    goog.events.unlistenByKey(this.ieDblclickListenerKey_);
+    this.documentPointerEventHandler_ = null;
-    this.ieDblclickListenerKey_ = null;
+  }
+  if (!goog.isNull(this.pointerEventHandler_)) {
+    this.pointerEventHandler_.dispose();
+    this.pointerEventHandler_ = null;
   }
   goog.base(this, 'disposeInternal');
 };

src/ol/pointer/eventsource.js

@@ -41,21 +41,3 @@ ol.pointer.EventSource.prototype.getMapping = goog.abstractMethod;
 ol.pointer.EventSource.prototype.getHandlerForEvent = function(eventType) {
   return this.getMapping()[eventType];
 };
-
-
-/**
- * Setup source listeners for the given pointer event type on the `document`
- * element. See also `PointerEventHandler.listenOnDocument()`.
- * @param {string} type Pointer event type.
- */
-ol.pointer.EventSource.prototype.listenOnDocument = function(type) {
-};
-
-
-/**
- * Remove source listeners for the given pointer event type from the `document`
- * element. See also `PointerEventHandler.unlistenOnDocument()`.
- * @param {string} type Pointer event type.
- */
-ol.pointer.EventSource.prototype.unlistenOnDocument = function(type) {
-};

src/ol/pointer/mousesource.js

@@ -113,30 +113,6 @@ ol.pointer.MouseSource.prototype.getMapping = function() {
 };
 
 
-/** @inheritDoc */
-ol.pointer.MouseSource.prototype.listenOnDocument = function(type) {
-  if (type === 'pointermove') {
-    this.dispatcher.removeEvent('mousemove');
-    this.dispatcher.addEvent('mousemove', goog.global.document);
-  } else if (type === 'pointerup') {
-    this.dispatcher.removeEvent('mouseup');
-    this.dispatcher.addEvent('mouseup', goog.global.document);
-  }
-};
-
-
-/** @inheritDoc */
-ol.pointer.MouseSource.prototype.unlistenOnDocument = function(type) {
-  if (type === 'pointermove') {
-    this.dispatcher.removeEvent('mousemove', goog.global.document);
-    this.dispatcher.addEvent('mousemove');
-  } else if (type === 'pointerup') {
-    this.dispatcher.removeEvent('mouseup', goog.global.document);
-    this.dispatcher.addEvent('mouseup');
-  }
-};
-
-
 /**
  * Detect if a mouse event was simulated from a touch by
  * checking if previously there was a touch event at the

src/ol/pointer/mssource.js

@@ -111,30 +111,6 @@ ol.pointer.MsSource.prototype.getMapping = function() {
 };
 
 
-/** @inheritDoc */
-ol.pointer.MsSource.prototype.listenOnDocument = function(type) {
-  if (type === 'pointermove') {
-    this.dispatcher.removeEvent('MSPointerMove');
-    this.dispatcher.addEvent('MSPointerMove', goog.global.document);
-  } else if (type === 'pointerup') {
-    this.dispatcher.removeEvent('MSPointerUp');
-    this.dispatcher.addEvent('MSPointerUp', goog.global.document);
-  }
-};
-
-
-/** @inheritDoc */
-ol.pointer.MsSource.prototype.unlistenOnDocument = function(type) {
-  if (type === 'pointermove') {
-    this.dispatcher.removeEvent('MSPointerMove', goog.global.document);
-    this.dispatcher.addEvent('MSPointerMove');
-  } else if (type === 'pointerup') {
-    this.dispatcher.removeEvent('MSPointerUp', goog.global.document);
-    this.dispatcher.addEvent('MSPointerUp');
-  }
-};
-
-
 /**
  * @suppress {missingProperties}
  * @return {boolean}

src/ol/pointer/nativesource.js

@@ -93,30 +93,6 @@ ol.pointer.NativeSource.prototype.getMapping = function() {
 };
 
 
-/** @inheritDoc */
-ol.pointer.NativeSource.prototype.listenOnDocument = function(type) {
-  if (type === 'pointermove') {
-    this.dispatcher.removeEvent('pointermove');
-    this.dispatcher.addEvent('pointermove', goog.global.document);
-  } else if (type === 'pointerup') {
-    this.dispatcher.removeEvent('pointerup');
-    this.dispatcher.addEvent('pointerup', goog.global.document);
-  }
-};
-
-
-/** @inheritDoc */
-ol.pointer.NativeSource.prototype.unlistenOnDocument = function(type) {
-  if (type === 'pointermove') {
-    this.dispatcher.removeEvent('pointermove', goog.global.document);
-    this.dispatcher.addEvent('pointermove');
-  } else if (type === 'pointerup') {
-    this.dispatcher.removeEvent('pointerup', goog.global.document);
-    this.dispatcher.addEvent('pointerup');
-  }
-};
-
-
 /**
  * Handler for `pointerdown`.
  *

src/ol/pointer/pointereventhandler.js

@@ -49,7 +49,7 @@ goog.require('ol.pointer.TouchSource');
 /**
  * @constructor
  * @extends {goog.events.EventTarget}
- * @param {Element} element Viewport element.
+ * @param {Element|HTMLDocument} element Viewport element.
  */
 ol.pointer.PointerEventHandler = function(element) {
   goog.base(this);
@@ -57,7 +57,7 @@ ol.pointer.PointerEventHandler = function(element) {
   /**
    * @const
    * @private
-   * @type {Element}
+   * @type {Element|HTMLDocument}
    */
   this.element_ = element;
 
@@ -203,65 +203,6 @@ ol.pointer.PointerEventHandler.prototype.eventHandler_ = function(inEvent) {
 };
 
 
-/**
- * Set up an event listener for the given pointer event type
- * by adding source event listeners to the `document` element. The
- * original listener on the map viewport is removed.
- * This is required for mouse and pointer devices when dragging,
- * because no `*move` events are fired, when the mouse/pointer is
- * outside the map viewport.
- * To remove these listeners again, use `unlistenOnDocument()`.
- *
- * @param {string} type Pointer event type.
- * @param {!Function} listener Callback method, or an object
- *     with a handleEvent function.
- * @param {boolean=} opt_useCapture Whether to fire in capture phase
- *     (defaults to false).
- * @param {Object=} opt_listenerScope Object in whose scope to call the
- *     listener.
- * @return {goog.events.ListenableKey} Unique key for the listener.
- */
-ol.pointer.PointerEventHandler.prototype.listenOnDocument = function(
-    type, listener, opt_useCapture, opt_listenerScope) {
-  var l = this.eventSourceList_.length;
-  var eventSource;
-  for (var i = 0; i < l; i++) {
-    eventSource = this.eventSourceList_[i];
-    eventSource.listenOnDocument(type);
-  }
-
-  return this.listen(
-      type, listener, opt_useCapture, opt_listenerScope);
-};
-
-
-/**
- * Removes the source event listeners on the `document` element,
- * and listenes to the orginal map viewport element again.
- *
- * @param {string} type Pointer event type.
- * @param {!Function} listener Callback method, or an object
- *     with a handleEvent function.
- * @param {boolean=} opt_useCapture Whether to fire in capture phase
- *     (defaults to false).
- * @param {Object=} opt_listenerScope Object in whose scope to call the
- *     listener.
- * @return {boolean} Whether any listener was removed.
- */
-ol.pointer.PointerEventHandler.prototype.unlistenOnDocument = function(
-    type, listener, opt_useCapture, opt_listenerScope) {
-  var l = this.eventSourceList_.length;
-  var eventSource;
-  for (var i = 0; i < l; i++) {
-    eventSource = this.eventSourceList_[i];
-    eventSource.listenOnDocument(type);
-  }
-
-  return this.unlisten(
-      type, listener, opt_useCapture, opt_listenerScope);
-};
-
-
 /**
  * Setup listeners for the given events.
  * @private
@@ -275,19 +216,6 @@ ol.pointer.PointerEventHandler.prototype.addEvents_ = function(events) {
 };
 
 
-/**
- * Setup listener for the given event.
- * @param {string} eventName Event type.
- * @param {HTMLDocument|Element=} opt_element Optional element.
- */
-ol.pointer.PointerEventHandler.prototype.addEvent = function(
-    eventName, opt_element) {
-  var element = goog.isDef(opt_element) ? opt_element : this.element_;
-  goog.events.listen(element, eventName,
-      this.eventHandler_, false, this);
-};
-
-
 /**
  * Unregister listeners for the given events.
  * @private
@@ -301,19 +229,6 @@ ol.pointer.PointerEventHandler.prototype.removeEvents_ = function(events) {
 };
 
 
-/**
- * Unregister listener for the given event.
- * @param {string} eventName Event type.
- * @param {HTMLDocument|Element=} opt_element Optional element.
- */
-ol.pointer.PointerEventHandler.prototype.removeEvent = function(
-    eventName, opt_element) {
-  var element = goog.isDef(opt_element) ? opt_element : this.element_;
-  goog.events.unlisten(element, eventName,
-      this.eventHandler_, false, this);
-};
-
-
 /**
  * Returns a snapshot of inEvent, with writable properties.
  *
@@ -537,6 +452,15 @@ ol.pointer.PointerEventHandler.prototype.fireNativeEvent =
 };
 
 
+/**
+ * @inheritDoc
+ */
+ol.pointer.PointerEventHandler.prototype.disposeInternal = function() {
+  this.unregister_();
+  goog.base(this, 'disposeInternal');
+};
+
+
 /**
  * Constants for event names.
  * @enum {string}