Merge pull request #329 from twpayne/animation-clean-ups

Animation clean ups
This commit is contained in:
Tom Payne
2013-03-09 04:02:29 -08:00
5 changed files with 72 additions and 48 deletions

View File

@@ -56,8 +56,8 @@ rotateRight.addEventListener('click', function() {
var panToLondon = document.getElementById('pan-to-london');
panToLondon.addEventListener('click', function() {
var pan = ol.animation.pan({
source: map.getView().getView2D().getCenter(),
duration: 2000
duration: 2000,
source: map.getView().getView2D().getCenter()
});
map.addPreRenderFunction(pan);
map.getView().getView2D().setCenter(london);
@@ -66,9 +66,9 @@ panToLondon.addEventListener('click', function() {
var elasticToMoscow = document.getElementById('elastic-to-moscow');
elasticToMoscow.addEventListener('click', function() {
var pan = ol.animation.pan({
source: map.getView().getView2D().getCenter(),
duration: 2000,
easing: ol.easing.elastic
easing: ol.easing.elastic,
source: map.getView().getView2D().getCenter()
});
map.addPreRenderFunction(pan);
map.getView().getView2D().setCenter(moscow);
@@ -77,9 +77,9 @@ elasticToMoscow.addEventListener('click', function() {
var bounceToInstanbul = document.getElementById('bounce-to-instanbul');
bounceToInstanbul.addEventListener('click', function() {
var pan = ol.animation.pan({
source: map.getView().getView2D().getCenter(),
duration: 2000,
easing: ol.easing.bounce
easing: ol.easing.bounce,
source: map.getView().getView2D().getCenter()
});
map.addPreRenderFunction(pan);
map.getView().getView2D().setCenter(instanbul);

View File

@@ -2,7 +2,6 @@
goog.provide('ol.animation');
goog.require('goog.fx.easing');
goog.require('ol.PreRenderFunction');
goog.require('ol.ViewHint');
goog.require('ol.easing');
@@ -48,7 +47,7 @@ ol.animation.pan = function(options) {
var sourceY = source.y;
var duration = goog.isDef(options.duration) ? options.duration : 1000;
var easing = goog.isDef(options.easing) ?
options.easing : goog.fx.easing.inAndOut;
options.easing : ol.easing.inAndOut;
return function(map, frameState) {
if (frameState.time < start) {
frameState.animate = true;
@@ -79,7 +78,7 @@ ol.animation.rotate = function(options) {
var start = goog.isDef(options.start) ? options.start : goog.now();
var duration = goog.isDef(options.duration) ? options.duration : 1000;
var easing = goog.isDef(options.easing) ?
options.easing : goog.fx.easing.inAndOut;
options.easing : ol.easing.inAndOut;
return function(map, frameState) {
if (frameState.time < start) {
@@ -110,7 +109,7 @@ ol.animation.zoom = function(options) {
var start = goog.isDef(options.start) ? options.start : goog.now();
var duration = goog.isDef(options.duration) ? options.duration : 1000;
var easing = goog.isDef(options.easing) ?
options.easing : ol.easing.linear;
options.easing : ol.easing.inAndOut;
return function(map, frameState) {
if (frameState.time < start) {
frameState.animate = true;

View File

@@ -1,5 +1,8 @@
@exportSymbol ol.easing
@exportProperty ol.easing.bounce
@exportProperty ol.easing.easeIn
@exportProperty ol.easing.easeOut
@exportProperty ol.easing.elastic
@exportProperty ol.easing.inAndOut
@exportProperty ol.easing.linear
@exportProperty ol.easing.upAndDown
@exportProperty ol.easing.elastic
@exportProperty ol.easing.bounce

View File

@@ -1,36 +1,6 @@
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.
*/
ol.easing.upAndDown = function(t) {
if (t < 0.5) {
return goog.fx.easing.inAndOut(2 * t);
} else {
return 1 - goog.fx.easing.inAndOut(2 * (t - 0.5));
}
};
/**
* from https://raw.github.com/DmitryBaranovskiy/raphael/master/raphael.js
* @param {number} t Input between 0 and 1.
* @return {number} Output between 0 and 1.
*/
ol.easing.elastic = function(t) {
return Math.pow(2, -10 * t) * Math.sin((t - 0.075) * (2 * Math.PI) / 0.3) + 1;
};
goog.require('goog.fx.easing');
/**
@@ -58,3 +28,56 @@ ol.easing.bounce = function(t) {
}
return l;
};
/**
* @param {number} t Input between 0 and 1.
* @return {number} Output between 0 and 1.
*/
ol.easing.easeIn = goog.fx.easing.easeIn;
/**
* @param {number} t Input between 0 and 1.
* @return {number} Output between 0 and 1.
*/
ol.easing.easeOut = goog.fx.easing.easeOut;
/**
* from https://raw.github.com/DmitryBaranovskiy/raphael/master/raphael.js
* @param {number} t Input between 0 and 1.
* @return {number} Output between 0 and 1.
*/
ol.easing.elastic = function(t) {
return Math.pow(2, -10 * t) * Math.sin((t - 0.075) * (2 * Math.PI) / 0.3) + 1;
};
/**
* @param {number} t Input between 0 and 1.
* @return {number} Output between 0 and 1.
*/
ol.easing.inAndOut = goog.fx.easing.inAndOut;
/**
* @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.
*/
ol.easing.upAndDown = function(t) {
if (t < 0.5) {
return ol.easing.inAndOut(2 * t);
} else {
return 1 - ol.easing.inAndOut(2 * (t - 0.5));
}
};

View File

@@ -4,7 +4,6 @@
goog.provide('ol.View2D');
goog.provide('ol.View2DProperty');
goog.require('goog.fx.easing');
goog.require('ol.Constraints');
goog.require('ol.Coordinate');
goog.require('ol.Extent');
@@ -308,13 +307,13 @@ ol.View2D.prototype.rotateWithoutConstraints =
map.addPreRenderFunction(ol.animation.rotate({
rotation: currentRotation,
duration: opt_duration,
easing: goog.fx.easing.easeOut
easing: ol.easing.easeOut
}));
if (goog.isDef(opt_anchor)) {
map.addPreRenderFunction(ol.animation.pan({
source: currentCenter,
duration: opt_duration,
easing: goog.fx.easing.easeOut
easing: ol.easing.easeOut
}));
}
}
@@ -382,13 +381,13 @@ ol.View2D.prototype.zoomWithoutConstraints =
map.addPreRenderFunction(ol.animation.zoom({
resolution: currentResolution,
duration: opt_duration,
easing: goog.fx.easing.easeOut
easing: ol.easing.easeOut
}));
if (goog.isDef(opt_anchor)) {
map.addPreRenderFunction(ol.animation.pan({
source: currentCenter,
duration: opt_duration,
easing: goog.fx.easing.easeOut
easing: ol.easing.easeOut
}));
}
}