From 95b48bdec41f69eb089f50cab243335cdfc7bbb3 Mon Sep 17 00:00:00 2001 From: Tom Payne Date: Thu, 17 Jan 2013 15:35:38 +0100 Subject: [PATCH 1/5] Add ol.easing.linear --- src/ol/easing.js | 9 +++++++++ 1 file changed, 9 insertions(+) diff --git a/src/ol/easing.js b/src/ol/easing.js index 74bd1c5210..7700c7fee6 100644 --- a/src/ol/easing.js +++ b/src/ol/easing.js @@ -1,6 +1,15 @@ goog.provide('ol.easing'); +/** + * @param {number} t Input between 0 and 1. + * @return {number} Output between 0 and 1. + */ +ol.easing.linear = function(t) { + return t; +}; + + /** * @param {number} t Input between 0 and 1. * @return {number} Output between 0 and 1. From 0257db05df581a7b19988be64bdb080b4a0441ef Mon Sep 17 00:00:00 2001 From: Tom Payne Date: Thu, 17 Jan 2013 15:36:02 +0100 Subject: [PATCH 2/5] Add zoom from animation --- src/ol/animation.js | 33 +++++++++++++++++++++++++++++++++ 1 file changed, 33 insertions(+) diff --git a/src/ol/animation.js b/src/ol/animation.js index e85fccbd5a..582c7c5ad0 100644 --- a/src/ol/animation.js +++ b/src/ol/animation.js @@ -107,3 +107,36 @@ ol.animation.createSpin = } }; }; + + +/** + * @param {number} sourceResolution Source resolution. + * @param {number=} opt_duration Duration. + * @param {number=} opt_start Start. + * @param {function(number): number=} opt_easingFunction Easing function. + * @return {ol.PreRenderFunction} Pre-render function. + */ +ol.animation.createZoomFrom = + function(sourceResolution, opt_duration, opt_start, opt_easingFunction) { + var start = goog.isDef(opt_start) ? opt_start : Date.now(); + var duration = goog.isDef(opt_duration) ? opt_duration : 1000; + var easingFunction = goog.isDef(opt_easingFunction) ? + opt_easingFunction : ol.easing.linear; + return function(map, frameState) { + if (frameState.time < start) { + frameState.animate = true; + frameState.viewHints[ol.ViewHint.ANIMATING] += 1; + return true; + } else if (frameState.time < start + duration) { + var delta = 1 - easingFunction((frameState.time - start) / duration); + var deltaResolution = + sourceResolution - frameState.view2DState.resolution; + frameState.animate = true; + frameState.view2DState.resolution += delta * deltaResolution; + frameState.viewHints[ol.ViewHint.ANIMATING] += 1; + return true; + } else { + return false; + } + }; +}; From 965d5e2cc8409456d4deb62f27181f2838c19f07 Mon Sep 17 00:00:00 2001 From: Tom Payne Date: Thu, 17 Jan 2013 15:36:36 +0100 Subject: [PATCH 3/5] Add animation duration to ol.View2D.zoom --- src/ol/animation.js | 2 +- src/ol/view2d.js | 12 ++++++++++-- 2 files changed, 11 insertions(+), 3 deletions(-) diff --git a/src/ol/animation.js b/src/ol/animation.js index 582c7c5ad0..4049186bb8 100644 --- a/src/ol/animation.js +++ b/src/ol/animation.js @@ -1,10 +1,10 @@ // FIXME works for View2D only +// FIXME dependency on ol.View2D suppressed to prevent dependency loop goog.provide('ol.animation'); goog.require('goog.fx.easing'); goog.require('ol.PreRenderFunction'); -goog.require('ol.View2D'); goog.require('ol.easing'); diff --git a/src/ol/view2d.js b/src/ol/view2d.js index e7cad27ed3..0ea5977c43 100644 --- a/src/ol/view2d.js +++ b/src/ol/view2d.js @@ -12,6 +12,7 @@ goog.require('ol.Projection'); goog.require('ol.ResolutionConstraint'); goog.require('ol.RotationConstraint'); goog.require('ol.View'); +goog.require('ol.animation'); /** @@ -289,9 +290,16 @@ ol.View2D.prototype.zoom_ = function(map, resolution, opt_anchor) { * @param {ol.Map} map Map. * @param {number} delta Delta from previous zoom level. * @param {ol.Coordinate=} opt_anchor Anchor coordinate. + * @param {number=} opt_duration Duration. */ -ol.View2D.prototype.zoom = function(map, delta, opt_anchor) { - var resolution = this.constraints_.resolution(this.getResolution(), delta); +ol.View2D.prototype.zoom = function(map, delta, opt_anchor, opt_duration) { + var currentResolution = this.getResolution(); + if (goog.isDef(currentResolution) && goog.isDef(opt_duration)) { + map.requestRenderFrame(); + map.addPreRenderFunction(ol.animation.createZoomFrom( + currentResolution, opt_duration)); + } + var resolution = this.constraints_.resolution(currentResolution, delta); this.zoom_(map, resolution, opt_anchor); }; From 90b7cfb33063c70d6649db4df5db069efb76df28 Mon Sep 17 00:00:00 2001 From: Tom Payne Date: Thu, 17 Jan 2013 15:37:18 +0100 Subject: [PATCH 4/5] Add animated zoom to zoom control --- src/ol/control/zoomcontrol.js | 12 ++++++++++-- 1 file changed, 10 insertions(+), 2 deletions(-) diff --git a/src/ol/control/zoomcontrol.js b/src/ol/control/zoomcontrol.js index 82be362311..96c83d703d 100644 --- a/src/ol/control/zoomcontrol.js +++ b/src/ol/control/zoomcontrol.js @@ -11,6 +11,12 @@ goog.require('ol.Projection'); goog.require('ol.control.Control'); +/** + * @define {number} Zoom duration. + */ +ol.control.ZOOM_DURATION = 250; + + /** * @constructor @@ -61,8 +67,9 @@ ol.control.Zoom.prototype.handleIn_ = function(browserEvent) { // prevent #zoomIn anchor from getting appended to the url browserEvent.preventDefault(); var map = this.getMap(); + map.requestRenderFrame(); // FIXME works for View2D only - map.getView().zoom(map, this.delta_); + map.getView().zoom(map, this.delta_, undefined, ol.control.ZOOM_DURATION); }; @@ -74,6 +81,7 @@ ol.control.Zoom.prototype.handleOut_ = function(browserEvent) { // prevent #zoomOut anchor from getting appended to the url browserEvent.preventDefault(); var map = this.getMap(); + map.requestRenderFrame(); // FIXME works for View2D only - map.getView().zoom(map, -this.delta_); + map.getView().zoom(map, -this.delta_, undefined, ol.control.ZOOM_DURATION); }; From 9428a94968ea3862c70673d04bac250a5b808ff5 Mon Sep 17 00:00:00 2001 From: Tom Payne Date: Thu, 17 Jan 2013 15:37:32 +0100 Subject: [PATCH 5/5] Add animated zoom to keyboard zoom interaction --- src/ol/interaction/keyboardzoominteraction.js | 9 ++++++++- 1 file changed, 8 insertions(+), 1 deletion(-) diff --git a/src/ol/interaction/keyboardzoominteraction.js b/src/ol/interaction/keyboardzoominteraction.js index 3075754ca7..9252cc652c 100644 --- a/src/ol/interaction/keyboardzoominteraction.js +++ b/src/ol/interaction/keyboardzoominteraction.js @@ -8,6 +8,12 @@ goog.require('ol.View2D'); goog.require('ol.interaction.Interaction'); +/** + * @define {number} Zoom duration. + */ +ol.interaction.KEYBOARD_ZOOM_DURATION = 100; + + /** * @constructor @@ -31,10 +37,11 @@ ol.interaction.KeyboardZoom.prototype.handleMapBrowserEvent = if (charCode == '+'.charCodeAt(0) || charCode == '-'.charCodeAt(0)) { var map = mapBrowserEvent.map; var delta = (charCode == '+'.charCodeAt(0)) ? 4 : -4; + map.requestRenderFrame(); // FIXME works for View2D only var view = map.getView(); goog.asserts.assert(view instanceof ol.View2D); - view.zoom(map, delta); + view.zoom(map, delta, undefined, ol.interaction.KEYBOARD_ZOOM_DURATION); keyEvent.preventDefault(); mapBrowserEvent.preventDefault(); }