From 214e5783331fcb1e3240ee8d97a901d13eaf69ad Mon Sep 17 00:00:00 2001 From: Tom Payne Date: Mon, 7 Oct 2013 15:35:52 +0200 Subject: [PATCH 1/7] Make zoom control animation duration configurable --- src/objectliterals.jsdoc | 1 + src/ol/control/zoomcontrol.js | 24 +++++++++++++----------- 2 files changed, 14 insertions(+), 11 deletions(-) diff --git a/src/objectliterals.jsdoc b/src/objectliterals.jsdoc index 8bd45c0487..a608544138 100644 --- a/src/objectliterals.jsdoc +++ b/src/objectliterals.jsdoc @@ -217,6 +217,7 @@ /** * @typedef {Object} ol.control.ZoomOptions + * @property {number|undefined} duration Animation duration. Default is 250ms. * @property {string|undefined} className CSS class name. Default is `ol-zoom`. * @property {number|undefined} delta The zoom delta applied on each click. * @property {Element|undefined} target Target. diff --git a/src/ol/control/zoomcontrol.js b/src/ol/control/zoomcontrol.js index 4707691f67..05cb4e0974 100644 --- a/src/ol/control/zoomcontrol.js +++ b/src/ol/control/zoomcontrol.js @@ -12,12 +12,6 @@ goog.require('ol.css'); goog.require('ol.easing'); -/** - * @define {number} Zoom duration. - */ -ol.control.ZOOM_DURATION = 250; - - /** * Create a new control with 2 buttons, one for zoom in and one for zoom out. @@ -62,6 +56,12 @@ ol.control.Zoom = function(opt_options) { target: options.target }); + /** + * @type {number} + * @private + */ + this.duration_ = goog.isDef(options.duration) ? options.duration : 250; + }; goog.inherits(ol.control.Zoom, ol.control.Control); @@ -79,11 +79,13 @@ ol.control.Zoom.prototype.zoomByDelta_ = function(delta, browserEvent) { var view = map.getView().getView2D(); var currentResolution = view.getResolution(); if (goog.isDef(currentResolution)) { - map.beforeRender(ol.animation.zoom({ - resolution: currentResolution, - duration: ol.control.ZOOM_DURATION, - easing: ol.easing.easeOut - })); + if (this.duration_ > 0) { + map.beforeRender(ol.animation.zoom({ + resolution: currentResolution, + duration: this.duration_, + easing: ol.easing.easeOut + })); + } var newResolution = view.constrainResolution(currentResolution, delta); view.setResolution(newResolution); } From 93b33589a1133784b4fc75bb3fb980a656626c92 Mon Sep 17 00:00:00 2001 From: Tom Payne Date: Mon, 7 Oct 2013 15:39:52 +0200 Subject: [PATCH 2/7] Make double click zoom animation duration configurable --- src/objectliterals.jsdoc | 1 + src/ol/interaction/doubleclickzoominteraction.js | 16 ++++++++-------- 2 files changed, 9 insertions(+), 8 deletions(-) diff --git a/src/objectliterals.jsdoc b/src/objectliterals.jsdoc index a608544138..bee1954ac6 100644 --- a/src/objectliterals.jsdoc +++ b/src/objectliterals.jsdoc @@ -240,6 +240,7 @@ /** * @typedef {Object} ol.interaction.DoubleClickZoomOptions + * @property {number|undefined} duration Animation duration. Default is 250ms. * @property {number|undefined} delta The zoom delta applied on each double * click, default is 1. */ diff --git a/src/ol/interaction/doubleclickzoominteraction.js b/src/ol/interaction/doubleclickzoominteraction.js index 38c1427db5..f68a348c5d 100644 --- a/src/ol/interaction/doubleclickzoominteraction.js +++ b/src/ol/interaction/doubleclickzoominteraction.js @@ -8,12 +8,6 @@ goog.require('ol.MapBrowserEvent.EventType'); goog.require('ol.interaction.Interaction'); -/** - * @define {number} Animation duration. - */ -ol.interaction.DOUBLECLICKZOOM_ANIMATION_DURATION = 250; - - /** * Allows the user to zoom by double-clicking on the map. @@ -34,6 +28,12 @@ ol.interaction.DoubleClickZoom = function(opt_options) { goog.base(this); + /** + * @private + * @type {number} + */ + this.duration_ = goog.isDef(options.duration) ? options.duration : 250; + }; goog.inherits(ol.interaction.DoubleClickZoom, ol.interaction.Interaction); @@ -52,8 +52,8 @@ ol.interaction.DoubleClickZoom.prototype.handleMapBrowserEvent = var delta = browserEvent.shiftKey ? -this.delta_ : this.delta_; // FIXME works for View2D only var view = map.getView().getView2D(); - ol.interaction.Interaction.zoomByDelta(map, view, delta, anchor, - ol.interaction.DOUBLECLICKZOOM_ANIMATION_DURATION); + ol.interaction.Interaction.zoomByDelta( + map, view, delta, anchor, this.duration_); mapBrowserEvent.preventDefault(); stopEvent = true; } From 1863109ac81188f40e7b684b5cad9b96c81b4a11 Mon Sep 17 00:00:00 2001 From: Tom Payne Date: Mon, 7 Oct 2013 15:41:00 +0200 Subject: [PATCH 3/7] Make keyboard zoom animation duration configurable --- src/objectliterals.jsdoc | 1 + src/ol/interaction/keyboardzoominteraction.js | 16 ++++++++-------- 2 files changed, 9 insertions(+), 8 deletions(-) diff --git a/src/objectliterals.jsdoc b/src/objectliterals.jsdoc index bee1954ac6..47034e4494 100644 --- a/src/objectliterals.jsdoc +++ b/src/objectliterals.jsdoc @@ -306,6 +306,7 @@ /** * @typedef {Object} ol.interaction.KeyboardZoomOptions + * @property {number|undefined} duration Animation duration. Default is 100ms. * @property {ol.interaction.ConditionType|undefined} condition A conditional * modifier (i.e. Shift key) that determines if the interaction is active * or not, default is no modifiers. diff --git a/src/ol/interaction/keyboardzoominteraction.js b/src/ol/interaction/keyboardzoominteraction.js index e1ef2c9b18..436a77e509 100644 --- a/src/ol/interaction/keyboardzoominteraction.js +++ b/src/ol/interaction/keyboardzoominteraction.js @@ -9,12 +9,6 @@ goog.require('ol.interaction.Interaction'); goog.require('ol.interaction.condition'); -/** - * @define {number} Zoom duration. - */ -ol.interaction.KEYBOARD_ZOOM_DURATION = 100; - - /** * Allows the user to zoom the map using keyboard + and -. @@ -41,6 +35,12 @@ ol.interaction.KeyboardZoom = function(opt_options) { */ this.delta_ = goog.isDef(options.delta) ? options.delta : 1; + /** + * @private + * @type {number} + */ + this.duration_ = goog.isDef(options.duration) ? options.duration : 100; + }; goog.inherits(ol.interaction.KeyboardZoom, ol.interaction.Interaction); @@ -62,8 +62,8 @@ ol.interaction.KeyboardZoom.prototype.handleMapBrowserEvent = map.requestRenderFrame(); // FIXME works for View2D only var view = map.getView().getView2D(); - ol.interaction.Interaction.zoomByDelta(map, view, delta, undefined, - ol.interaction.KEYBOARD_ZOOM_DURATION); + ol.interaction.Interaction.zoomByDelta( + map, view, delta, undefined, this.duration_); mapBrowserEvent.preventDefault(); stopEvent = true; } From 6c0d4cddad883fd7c96270b9b9287e88a17a7573 Mon Sep 17 00:00:00 2001 From: Tom Payne Date: Mon, 7 Oct 2013 15:44:54 +0200 Subject: [PATCH 4/7] Make mouse wheel zoom animation duration configurable --- src/objectliterals.jsdoc | 5 +++++ .../interaction/mousewheelzoominteraction.js | 19 +++++++++++-------- 2 files changed, 16 insertions(+), 8 deletions(-) diff --git a/src/objectliterals.jsdoc b/src/objectliterals.jsdoc index 47034e4494..98203a7b44 100644 --- a/src/objectliterals.jsdoc +++ b/src/objectliterals.jsdoc @@ -313,6 +313,11 @@ * @property {number|undefined} delta The amount to zoom on each key press. */ +/** + * @typedef {Object} ol.interaction.MouseWheelZoomOptions + * @property {number|undefined} duration Animation duration. Default is 250ms. + */ + /** * @typedef {Object} ol.interaction.SelectOptions * @property {ol.interaction.ConditionType|undefined} addCondition A conditional diff --git a/src/ol/interaction/mousewheelzoominteraction.js b/src/ol/interaction/mousewheelzoominteraction.js index 1e138a8233..0463143de1 100644 --- a/src/ol/interaction/mousewheelzoominteraction.js +++ b/src/ol/interaction/mousewheelzoominteraction.js @@ -10,12 +10,6 @@ goog.require('ol.Coordinate'); goog.require('ol.interaction.Interaction'); -/** - * @define {number} Animation duration. - */ -ol.interaction.MOUSEWHEELZOOM_ANIMATION_DURATION = 250; - - /** * @define {number} Maximum delta. */ @@ -33,8 +27,11 @@ ol.interaction.MOUSEWHEELZOOM_TIMEOUT_DURATION = 80; * Allows the user to zoom the map by scrolling the mouse wheel. * @constructor * @extends {ol.interaction.Interaction} + * @param {ol.interaction.MouseWheelZoomOptions=} opt_options Options. */ -ol.interaction.MouseWheelZoom = function() { +ol.interaction.MouseWheelZoom = function(opt_options) { + + var options = goog.isDef(opt_options) ? opt_options : {}; goog.base(this); @@ -44,6 +41,12 @@ ol.interaction.MouseWheelZoom = function() { */ this.delta_ = 0; + /** + * @private + * @type {number} + */ + this.duration_ = goog.isDef(options.duration) ? options.duration : 250; + /** * @private * @type {?ol.Coordinate} @@ -113,7 +116,7 @@ ol.interaction.MouseWheelZoom.prototype.doZoom_ = function(map) { map.requestRenderFrame(); ol.interaction.Interaction.zoomByDelta(map, view, -delta, this.lastAnchor_, - ol.interaction.MOUSEWHEELZOOM_ANIMATION_DURATION); + this.duration_); this.delta_ = 0; this.lastAnchor_ = null; From b1ed63ebf8d796c812b99073c8d5ffa6f94c3c3e Mon Sep 17 00:00:00 2001 From: Tom Payne Date: Mon, 7 Oct 2013 15:46:19 +0200 Subject: [PATCH 5/7] Make touch zoom animation duration configurable --- src/objectliterals.jsdoc | 5 +++++ src/ol/interaction/touchzoominteraction.js | 19 +++++++++++-------- 2 files changed, 16 insertions(+), 8 deletions(-) diff --git a/src/objectliterals.jsdoc b/src/objectliterals.jsdoc index 98203a7b44..797bd1e942 100644 --- a/src/objectliterals.jsdoc +++ b/src/objectliterals.jsdoc @@ -343,6 +343,11 @@ * @property {number|undefined} threshold Minimal angle to start a rotation. */ +/** + * @typedef {Object} ol.interaction.TouchZoomOptions + * @property {number|undefined} duration Animation duration. Default is 400ms. + */ + /** * @typedef {Object} ol.layer.BaseOptions * @property {number|undefined} brightness Brightness. diff --git a/src/ol/interaction/touchzoominteraction.js b/src/ol/interaction/touchzoominteraction.js index 2591f0b0d4..8d1ece062b 100644 --- a/src/ol/interaction/touchzoominteraction.js +++ b/src/ol/interaction/touchzoominteraction.js @@ -9,20 +9,17 @@ goog.require('ol.interaction.Interaction'); goog.require('ol.interaction.Touch'); -/** - * @define {number} Animation duration. - */ -ol.interaction.TOUCHZOOM_ANIMATION_DURATION = 400; - - /** * Allows the user to zoom the map by pinching with two fingers * on a touch screen. * @constructor * @extends {ol.interaction.Touch} + * @param {ol.interaction.TouchZoomOptions=} opt_options Options. */ -ol.interaction.TouchZoom = function() { +ol.interaction.TouchZoom = function(opt_options) { + + var options = goog.isDef(opt_options) ? opt_options : {}; goog.base(this); @@ -32,6 +29,12 @@ ol.interaction.TouchZoom = function() { */ this.anchor_ = null; + /** + * @private + * @type {number} + */ + this.duration_ = goog.isDef(options.duration) ? options.duration : 400; + /** * @private * @type {number|undefined} @@ -107,7 +110,7 @@ ol.interaction.TouchZoom.prototype.handleTouchEnd = // Direction is > 0 if pinching out, and < 0 if pinching in. var direction = this.lastScaleDelta_ - 1; ol.interaction.Interaction.zoom(map, view, view2DState.resolution, - this.anchor_, ol.interaction.TOUCHZOOM_ANIMATION_DURATION, direction); + this.anchor_, this.duration_, direction); return false; } else { return true; From c6df48e42444f590731a279bcbff50895b8ae41a Mon Sep 17 00:00:00 2001 From: Tom Payne Date: Mon, 7 Oct 2013 15:46:57 +0200 Subject: [PATCH 6/7] Add zoomDuration option to interaction defaults --- src/objectliterals.jsdoc | 1 + src/ol/interaction/interactiondefaults.js | 14 ++++++++++---- 2 files changed, 11 insertions(+), 4 deletions(-) diff --git a/src/objectliterals.jsdoc b/src/objectliterals.jsdoc index 797bd1e942..ccad654bec 100644 --- a/src/objectliterals.jsdoc +++ b/src/objectliterals.jsdoc @@ -293,6 +293,7 @@ * @property {boolean|undefined} touchRotate Whether touch rotate is desired. * @property {boolean|undefined} touchZoom Whether touch zoom is desired. * @property {number|undefined} zoomDelta Zoom delta. + * @property {number|undefined} zoomDuration Zoom duration. */ /** diff --git a/src/ol/interaction/interactiondefaults.js b/src/ol/interaction/interactiondefaults.js index 541d378459..27a2010b62 100644 --- a/src/ol/interaction/interactiondefaults.js +++ b/src/ol/interaction/interactiondefaults.js @@ -45,7 +45,8 @@ ol.interaction.defaults = function(opt_options) { options.doubleClickZoom : true; if (doubleClickZoom) { interactions.push(new ol.interaction.DoubleClickZoom({ - delta: options.zoomDelta + delta: options.zoomDelta, + duration: options.zoomDuration })); } @@ -66,7 +67,9 @@ ol.interaction.defaults = function(opt_options) { var touchZoom = goog.isDef(options.touchZoom) ? options.touchZoom : true; if (touchZoom) { - interactions.push(new ol.interaction.TouchZoom()); + interactions.push(new ol.interaction.TouchZoom({ + duration: options.zoomDuration + })); } var dragPan = goog.isDef(options.dragPan) ? @@ -82,14 +85,17 @@ ol.interaction.defaults = function(opt_options) { if (keyboard) { interactions.push(new ol.interaction.KeyboardPan()); interactions.push(new ol.interaction.KeyboardZoom({ - delta: options.zoomDelta + delta: options.zoomDelta, + duration: options.zoomDuration })); } var mouseWheelZoom = goog.isDef(options.mouseWheelZoom) ? options.mouseWheelZoom : true; if (mouseWheelZoom) { - interactions.push(new ol.interaction.MouseWheelZoom()); + interactions.push(new ol.interaction.MouseWheelZoom({ + duration: options.zoomDuration + })); } var shiftDragZoom = goog.isDef(options.shiftDragZoom) ? From b533cad031919a0731c2ea519443317ef0d92055 Mon Sep 17 00:00:00 2001 From: Tom Payne Date: Mon, 7 Oct 2013 15:47:16 +0200 Subject: [PATCH 7/7] Only install animations if duration > 0 --- src/ol/interaction/interaction.js | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/src/ol/interaction/interaction.js b/src/ol/interaction/interaction.js index 99978dc5a7..ffb2e7bf70 100644 --- a/src/ol/interaction/interaction.js +++ b/src/ol/interaction/interaction.js @@ -35,7 +35,7 @@ ol.interaction.Interaction.pan = function( map, view, delta, opt_duration) { var currentCenter = view.getCenter(); if (goog.isDef(currentCenter)) { - if (goog.isDef(opt_duration)) { + if (goog.isDef(opt_duration) && opt_duration > 0) { map.beforeRender(ol.animation.pan({ source: currentCenter, duration: opt_duration, @@ -77,7 +77,7 @@ ol.interaction.Interaction.rotateWithoutConstraints = var currentRotation = view.getRotation(); var currentCenter = view.getCenter(); if (goog.isDef(currentRotation) && goog.isDef(currentCenter) && - goog.isDef(opt_duration)) { + goog.isDef(opt_duration) && opt_duration > 0) { map.beforeRender(ol.animation.rotate({ rotation: currentRotation, duration: opt_duration, @@ -156,7 +156,7 @@ ol.interaction.Interaction.zoomWithoutConstraints = var currentResolution = view.getResolution(); var currentCenter = view.getCenter(); if (goog.isDef(currentResolution) && goog.isDef(currentCenter) && - goog.isDef(opt_duration)) { + goog.isDef(opt_duration) && opt_duration > 0) { map.beforeRender(ol.animation.zoom({ resolution: currentResolution, duration: opt_duration,