Merge pull request #2168 from tonio/keyboard_controls

Restore control’s keyboard navigation

src/ol/control/fullscreencontrol.js

@@ -52,7 +52,9 @@ ol.control.FullScreen = function(opt_options) {
   var buttonHandler = new ol.pointer.PointerEventHandler(button);
   this.registerDisposable(buttonHandler);
   goog.events.listen(buttonHandler,
-      ol.pointer.EventType.POINTERUP, this.handleClick_, false, this);
+      ol.pointer.EventType.POINTERUP, this.handlePointerUp_, false, this);
+  goog.events.listen(button, goog.events.EventType.CLICK,
+      this.handleClick_, false, this);
 
   goog.events.listen(button, [
     goog.events.EventType.MOUSEOUT,
@@ -86,14 +88,34 @@ goog.inherits(ol.control.FullScreen, ol.control.Control);
 
 
 /**
- * @param {ol.pointer.PointerEvent} pointerEvent Pointer event.
+ * @param {goog.events.BrowserEvent} event The event to handle
  * @private
  */
-ol.control.FullScreen.prototype.handleClick_ = function(pointerEvent) {
+ol.control.FullScreen.prototype.handleClick_ = function(event) {
+  if (event.screenX !== 0 && event.screenY !== 0) {
+    return;
+  }
+  this.handleFullScreen_();
+};
+
+
+/**
+ * @param {ol.pointer.PointerEvent} pointerEvent The event to handle
+ * @private
+ */
+ol.control.FullScreen.prototype.handlePointerUp_ = function(pointerEvent) {
+  pointerEvent.browserEvent.preventDefault();
+  this.handleFullScreen_();
+};
+
+
+/**
+ * @private
+ */
+ol.control.FullScreen.prototype.handleFullScreen_ = function() {
   if (!googx.dom.fullscreen.isSupported()) {
     return;
   }
-  pointerEvent.browserEvent.preventDefault();
   var map = this.getMap();
   if (goog.isNull(map)) {
     return;

src/ol/control/rotatecontrol.js

@@ -53,7 +53,9 @@ ol.control.Rotate = function(opt_options) {
   var handler = new ol.pointer.PointerEventHandler(button);
   this.registerDisposable(handler);
   goog.events.listen(handler, ol.pointer.EventType.POINTERUP,
-      ol.control.Rotate.prototype.resetNorth_, false, this);
+      ol.control.Rotate.prototype.handlePointerUp_, false, this);
+  goog.events.listen(button, goog.events.EventType.CLICK,
+      ol.control.Rotate.prototype.handleClick_, false, this);
 
   goog.events.listen(button, [
     goog.events.EventType.MOUSEOUT,
@@ -90,12 +92,31 @@ goog.inherits(ol.control.Rotate, ol.control.Control);
 
 
 /**
- * @param {ol.pointer.PointerEvent} pointerEvent The pointer event to handle.
+ * @param {goog.events.BrowserEvent} event The event to handle
  * @private
  */
-ol.control.Rotate.prototype.resetNorth_ = function(pointerEvent) {
+ol.control.Rotate.prototype.handleClick_ = function(event) {
+  if (event.screenX !== 0 && event.screenY !== 0) {
+    return;
+  }
+  this.resetNorth_();
+};
+
+
+/**
+ * @param {ol.pointer.PointerEvent} pointerEvent The event to handle
+ * @private
+ */
+ol.control.Rotate.prototype.handlePointerUp_ = function(pointerEvent) {
   pointerEvent.browserEvent.preventDefault();
-  // prevent the anchor from getting appended to the url
+  this.resetNorth_();
+};
+
+
+/**
+ * @private
+ */
+ol.control.Rotate.prototype.resetNorth_ = function() {
   var map = this.getMap();
   // FIXME works for View2D only
   var view = map.getView();

src/ol/control/zoomcontrol.js

@@ -57,7 +57,10 @@ ol.control.Zoom = function(opt_options) {
   this.registerDisposable(inElementHandler);
   goog.events.listen(inElementHandler,
       ol.pointer.EventType.POINTERUP, goog.partial(
-          ol.control.Zoom.prototype.zoomByDelta_, delta), false, this);
+          ol.control.Zoom.prototype.handlePointerUp_, delta), false, this);
+  goog.events.listen(inElement,
+      goog.events.EventType.CLICK, goog.partial(
+          ol.control.Zoom.prototype.handleClick_, delta), false, this);
 
   goog.events.listen(inElement, [
     goog.events.EventType.MOUSEOUT,
@@ -78,7 +81,10 @@ ol.control.Zoom = function(opt_options) {
   this.registerDisposable(outElementHandler);
   goog.events.listen(outElementHandler,
       ol.pointer.EventType.POINTERUP, goog.partial(
-          ol.control.Zoom.prototype.zoomByDelta_, -delta), false, this);
+          ol.control.Zoom.prototype.handlePointerUp_, -delta), false, this);
+  goog.events.listen(outElement,
+      goog.events.EventType.CLICK, goog.partial(
+          ol.control.Zoom.prototype.handleClick_, -delta), false, this);
 
   goog.events.listen(outElement, [
     goog.events.EventType.MOUSEOUT,
@@ -109,12 +115,33 @@ goog.inherits(ol.control.Zoom, ol.control.Control);
 
 /**
  * @param {number} delta Zoom delta.
- * @param {ol.pointer.PointerEvent} pointerEvent The pointer event to handle.
+ * @param {goog.events.BrowserEvent} event The event to handle
  * @private
  */
-ol.control.Zoom.prototype.zoomByDelta_ = function(delta, pointerEvent) {
+ol.control.Zoom.prototype.handleClick_ = function(delta, event) {
+  if (event.screenX !== 0 && event.screenY !== 0) {
+    return;
+  }
+  this.zoomByDelta_(delta);
+};
+
+
+/**
+ * @param {number} delta Zoom delta.
+ * @param {ol.pointer.PointerEvent} pointerEvent The event to handle
+ * @private
+ */
+ol.control.Zoom.prototype.handlePointerUp_ = function(delta, pointerEvent) {
   pointerEvent.browserEvent.preventDefault();
-  // prevent the anchor from getting appended to the url
+  this.zoomByDelta_(delta);
+};
+
+
+/**
+ * @param {number} delta Zoom delta.
+ * @private
+ */
+ol.control.Zoom.prototype.zoomByDelta_ = function(delta) {
   var map = this.getMap();
   // FIXME works for View2D only
   var view = map.getView();

src/ol/control/zoomtoextentcontrol.js

@@ -48,7 +48,9 @@ ol.control.ZoomToExtent = function(opt_options) {
   var buttonHandler = new ol.pointer.PointerEventHandler(button);
   this.registerDisposable(buttonHandler);
   goog.events.listen(buttonHandler, ol.pointer.EventType.POINTERUP,
-      this.handleZoomToExtent_, false, this);
+      this.handlePointerUp_, false, this);
+  goog.events.listen(button, goog.events.EventType.CLICK,
+      this.handleClick_, false, this);
 
   goog.events.listen(button, [
     goog.events.EventType.MOUSEOUT,
@@ -70,12 +72,31 @@ goog.inherits(ol.control.ZoomToExtent, ol.control.Control);
 
 
 /**
- * @param {ol.pointer.PointerEvent} pointerEvent Pointer event.
+ * @param {goog.events.BrowserEvent} event The event to handle
  * @private
  */
-ol.control.ZoomToExtent.prototype.handleZoomToExtent_ = function(pointerEvent) {
+ol.control.ZoomToExtent.prototype.handleClick_ = function(event) {
+  if (event.screenX !== 0 && event.screenY !== 0) {
+    return;
+  }
+  this.handleZoomToExtent_();
+};
+
+
+/**
+ * @param {ol.pointer.PointerEvent} pointerEvent The event to handle
+ * @private
+ */
+ol.control.ZoomToExtent.prototype.handlePointerUp_ = function(pointerEvent) {
   pointerEvent.browserEvent.preventDefault();
-  // prevent #zoomExtent anchor from getting appended to the url
+  this.handleZoomToExtent_();
+};
+
+
+/**
+ * @private
+ */
+ol.control.ZoomToExtent.prototype.handleZoomToExtent_ = function() {
   var map = this.getMap();
   var view = map.getView();
   goog.asserts.assert(goog.isDef(view));