Fix support for legacy IE

2014-03-07 14:33:19 +01:00
parent d6ca93e23c
commit b17957b543
3 changed files with 114 additions and 39 deletions
--- a/src/ol/mapbrowserevent.js
+++ b/src/ol/mapbrowserevent.js
@@ -148,6 +148,14 @@ ol.MapBrowserEventHandler = function(map) {
   */
  this.pointerdownListenerKey_ = null;

+  if (ol.LEGACY_IE_SUPPORT && ol.IS_LEGACY_IE) {
+    /**
+     * @type {goog.events.Key}
+     * @private
+     */
+    this.ieDblclickListenerKey_ = null;
+  }
+
  /**
   * @type {ol.pointer.PointerEvent}
   * @private
@@ -194,6 +202,17 @@ ol.MapBrowserEventHandler = function(map) {
      [ol.pointer.EventType.POINTERMOVE],
      this.relayEvent_, false, this);

+  if (ol.LEGACY_IE_SUPPORT && ol.IS_LEGACY_IE) {
+    /*
+     * On legacy IE, double clicks do not produce two mousedown and
+     * mouseup events. That is why a separate DBLCLICK event listener
+     * is used.
+     */
+    this.ieDblclickListenerKey_ = goog.events.listen(element,
+        goog.events.EventType.DBLCLICK,
+        this.emulateClickLegacyIE_, false, this);
+  }
+
 };
 goog.inherits(ol.MapBrowserEventHandler, goog.events.EventTarget);

@@ -208,6 +227,20 @@ ol.MapBrowserEventHandler.prototype.getDown = function() {
 };


+/**
+ * @param {goog.events.BrowserEvent} browserEvent Pointer event.
+ * @private
+ */
+ol.MapBrowserEventHandler.prototype.emulateClickLegacyIE_ =
+    function(browserEvent) {
+  var pointerEvent = this.pointerEventHandler_.wrapMouseEvent(
+      ol.MapBrowserEvent.EventType.POINTERUP,
+      browserEvent
+      );
+  this.emulateClick_(pointerEvent);
+};
+
+
 /**
 * @param {ol.pointer.PointerEvent} pointerEvent Pointer event.
 * @private
@@ -273,14 +306,29 @@ ol.MapBrowserEventHandler.prototype.handlePointerUp_ = function(pointerEvent) {
  // We emulate click event on left mouse button click, touch contact, and pen
  // contact. isMouseActionButton returns true in these cases (evt.button is set
  // to 0).
-  // See http://www.w3.org/TR/pointerevents/#button-states .
-  if (!this.dragged_ && pointerEvent.button == 0) {
+  // See http://www.w3.org/TR/pointerevents/#button-states
+  if (!this.dragged_ && this.isMouseActionButton_(pointerEvent)) {
    goog.asserts.assert(!goog.isNull(this.down_));
    this.emulateClick_(this.down_);
  }
 };


+/**
+ * @param {ol.pointer.PointerEvent} pointerEvent Pointer event.
+ * @return {boolean} If the left mouse button was pressed.
+ * @private
+ */
+ol.MapBrowserEventHandler.prototype.isMouseActionButton_ =
+    function(pointerEvent) {
+  if (ol.LEGACY_IE_SUPPORT && ol.IS_LEGACY_IE) {
+    return pointerEvent.button == 1;
+  } else {
+    return pointerEvent.button == 0;
+  }
+};
+
+
 /**
 * @param {ol.pointer.PointerEvent} pointerEvent Pointer event.
 * @private
@@ -385,6 +433,11 @@ ol.MapBrowserEventHandler.prototype.disposeInternal = function() {
    goog.dispose(this.pointerEventHandler_);
    this.pointerEventHandler_ = null;
  }
+  if (ol.LEGACY_IE_SUPPORT && ol.IS_LEGACY_IE &&
+      !goog.isNull(this.ieDblclickListenerKey_)) {
+    goog.events.unlistenByKey(this.ieDblclickListenerKey_);
+    this.ieDblclickListenerKey_ = null;
+  }
  goog.base(this, 'disposeInternal');
 };

--- a/src/ol/pointer/mousesource.js
+++ b/src/ol/pointer/mousesource.js
@@ -48,26 +48,6 @@ ol.pointer.MouseSource = function(dispatcher) {
   */
  this.pointerMap = dispatcher.pointerMap;

-  /**
-   * Radius around touchend that swallows mouse events.
-   *
-   * @const
-   * @type {number}
-   */
-  this.DEDUP_DIST = 25;
-
-  /**
-   * @const
-   * @type {number}
-   */
-  this.POINTER_ID = 1;
-
-  /**
-   * @const
-   * @type {string}
-   */
-  this.POINTER_TYPE = 'mouse';
-
  /**
   * @const
   * @type {Array.<string>}
@@ -101,6 +81,29 @@ ol.pointer.MouseSource = function(dispatcher) {
 goog.inherits(ol.pointer.MouseSource, ol.pointer.EventSource);


+/**
+ * @const
+ * @type {number}
+ */
+ol.pointer.MouseSource.POINTER_ID = 1;
+
+
+/**
+ * @const
+ * @type {string}
+ */
+ol.pointer.MouseSource.POINTER_TYPE = 'mouse';
+
+
+/**
+ * Radius around touchend that swallows mouse events.
+ *
+ * @const
+ * @type {number}
+ */
+ol.pointer.MouseSource.DEDUP_DIST = 25;
+
+
 /** @inheritDoc */
 ol.pointer.MouseSource.prototype.getEvents = function() {
  return this.events;
@@ -144,7 +147,8 @@ ol.pointer.MouseSource.prototype.isEventSimulatedFromTouch_ =
  for (var i = 0, l = lts.length, t; i < l && (t = lts[i]); i++) {
    // simulated mouse events will be swallowed near a primary touchend
    var dx = Math.abs(x - t.x), dy = Math.abs(y - t.y);
-    if (dx <= this.DEDUP_DIST && dy <= this.DEDUP_DIST) {
+    if (dx <= ol.pointer.MouseSource.DEDUP_DIST &&
+        dy <= ol.pointer.MouseSource.DEDUP_DIST) {
      return true;
    }
  }
@@ -156,12 +160,12 @@ ol.pointer.MouseSource.prototype.isEventSimulatedFromTouch_ =
 * Creates a copy of the original event that will be used
 * for the fake pointer event.
 *
- * @private
 * @param {goog.events.BrowserEvent} inEvent
+ * @param {ol.pointer.PointerEventHandler} dispatcher
 * @return {Object}
 */
-ol.pointer.MouseSource.prototype.prepareEvent_ = function(inEvent) {
-  var e = this.dispatcher.cloneEvent(inEvent, inEvent.getBrowserEvent());
+ol.pointer.MouseSource.prepareEvent = function(inEvent, dispatcher) {
+  var e = dispatcher.cloneEvent(inEvent, inEvent.getBrowserEvent());

  // forward mouse preventDefault
  var pd = e.preventDefault;
@@ -170,9 +174,9 @@ ol.pointer.MouseSource.prototype.prepareEvent_ = function(inEvent) {
    pd();
  };

-  e.pointerId = this.POINTER_ID;
+  e.pointerId = ol.pointer.MouseSource.POINTER_ID;
  e.isPrimary = true;
-  e.pointerType = this.POINTER_TYPE;
+  e.pointerType = ol.pointer.MouseSource.POINTER_TYPE;

  return e;
 };
@@ -185,14 +189,14 @@ ol.pointer.MouseSource.prototype.prepareEvent_ = function(inEvent) {
 */
 ol.pointer.MouseSource.prototype.mousedown = function(inEvent) {
  if (!this.isEventSimulatedFromTouch_(inEvent)) {
-    var p = this.pointerMap.containsKey(this.POINTER_ID);
+    var p = this.pointerMap.containsKey(ol.pointer.MouseSource.POINTER_ID);
    // TODO(dfreedman) workaround for some elements not sending mouseup
    // http://crbug/149091
    if (p) {
      this.cancel(inEvent);
    }
-    var e = this.prepareEvent_(inEvent);
-    this.pointerMap.set(this.POINTER_ID, inEvent);
+    var e = ol.pointer.MouseSource.prepareEvent(inEvent, this.dispatcher);
+    this.pointerMap.set(ol.pointer.MouseSource.POINTER_ID, inEvent);
    this.dispatcher.down(e, inEvent);
  }
 };
@@ -205,7 +209,7 @@ ol.pointer.MouseSource.prototype.mousedown = function(inEvent) {
 */
 ol.pointer.MouseSource.prototype.mousemove = function(inEvent) {
  if (!this.isEventSimulatedFromTouch_(inEvent)) {
-    var e = this.prepareEvent_(inEvent);
+    var e = ol.pointer.MouseSource.prepareEvent(inEvent, this.dispatcher);
    this.dispatcher.move(e, inEvent);
  }
 };
@@ -218,10 +222,10 @@ ol.pointer.MouseSource.prototype.mousemove = function(inEvent) {
 */
 ol.pointer.MouseSource.prototype.mouseup = function(inEvent) {
  if (!this.isEventSimulatedFromTouch_(inEvent)) {
-    var p = this.pointerMap.get(this.POINTER_ID);
+    var p = this.pointerMap.get(ol.pointer.MouseSource.POINTER_ID);

    if (p && p.button === inEvent.button) {
-      var e = this.prepareEvent_(inEvent);
+      var e = ol.pointer.MouseSource.prepareEvent(inEvent, this.dispatcher);
      this.dispatcher.up(e, inEvent);
      this.cleanupMouse();
    }
@@ -236,7 +240,7 @@ ol.pointer.MouseSource.prototype.mouseup = function(inEvent) {
 */
 ol.pointer.MouseSource.prototype.mouseover = function(inEvent) {
  if (!this.isEventSimulatedFromTouch_(inEvent)) {
-    var e = this.prepareEvent_(inEvent);
+    var e = ol.pointer.MouseSource.prepareEvent(inEvent, this.dispatcher);
    this.dispatcher.enterOver(e, inEvent);
  }
 };
@@ -249,7 +253,7 @@ ol.pointer.MouseSource.prototype.mouseover = function(inEvent) {
 */
 ol.pointer.MouseSource.prototype.mouseout = function(inEvent) {
  if (!this.isEventSimulatedFromTouch_(inEvent)) {
-    var e = this.prepareEvent_(inEvent);
+    var e = ol.pointer.MouseSource.prepareEvent(inEvent, this.dispatcher);
    this.dispatcher.leaveOut(e, inEvent);
  }
 };
@@ -261,7 +265,7 @@ ol.pointer.MouseSource.prototype.mouseout = function(inEvent) {
 * @param {goog.events.BrowserEvent} inEvent
 */
 ol.pointer.MouseSource.prototype.cancel = function(inEvent) {
-  var e = this.prepareEvent_(inEvent);
+  var e = ol.pointer.MouseSource.prepareEvent(inEvent, this.dispatcher);
  this.dispatcher.cancel(e, inEvent);
  this.cleanupMouse();
 };
@@ -271,5 +275,5 @@ ol.pointer.MouseSource.prototype.cancel = function(inEvent) {
 * Remove the mouse from the list of active pointers.
 */
 ol.pointer.MouseSource.prototype.cleanupMouse = function() {
-  this.pointerMap.remove(this.POINTER_ID);
+  this.pointerMap.remove(ol.pointer.MouseSource.POINTER_ID);
 };
--- a/src/ol/pointer/pointereventhandler.js
+++ b/src/ol/pointer/pointereventhandler.js
@@ -364,7 +364,7 @@ ol.pointer.PointerEventHandler.prototype.contains_ =
 // EVENT CREATION AND TRACKING
 /**
 * Creates a new Event of type `inType`, based on the information in
- * `inEvent`.
+ * `pointerEventData`.
 *
 * @param {string} inType A string representing the type of event to create.
 * @param {Object} pointerEventData
@@ -412,6 +412,24 @@ ol.pointer.PointerEventHandler.prototype.fireNativeEvent =
 };


+/**
+ * Wrap a native mouse event into a pointer event.
+ * This proxy method is required for the legacy IE support.
+ * @param {string} eventType The pointer event type.
+ * @param {goog.events.BrowserEvent} browserEvent
+ * @return {ol.pointer.PointerEvent}
+ */
+ol.pointer.PointerEventHandler.prototype.wrapMouseEvent =
+    function(eventType, browserEvent) {
+  var pointerEvent = this.makeEvent(
+      eventType,
+      ol.pointer.MouseSource.prepareEvent(browserEvent, this),
+      browserEvent
+      );
+  return pointerEvent;
+};
+
+
 /**
 * @inheritDoc
 */