From f6fe7d48d35e7303b4831c19c6ef5145583b1dd4 Mon Sep 17 00:00:00 2001 From: pgiraud Date: Fri, 8 Feb 2008 13:09:58 +0000 Subject: [PATCH] adds tween and easing classes (with algorithms from Robert Penner) to handle animation git-svn-id: http://svn.openlayers.org/trunk/openlayers@6097 dc9f47b5-9b13-0410-9fdd-eb0c1a62fdaf --- doc/authors.txt | 75 +++++----- doc/licenses/BSD-LICENSE.txt | 28 ++++ lib/OpenLayers.js | 1 + lib/OpenLayers/Tween.js | 256 +++++++++++++++++++++++++++++++++++ tests/list-tests.html | 1 + tests/manual/tween.html | 81 +++++++++++ tests/test_Tween.html | 62 +++++++++ 7 files changed, 468 insertions(+), 36 deletions(-) create mode 100644 doc/licenses/BSD-LICENSE.txt create mode 100644 lib/OpenLayers/Tween.js create mode 100644 tests/manual/tween.html create mode 100644 tests/test_Tween.html diff --git a/doc/authors.txt b/doc/authors.txt index 155c780cd5..2ae9462d23 100644 --- a/doc/authors.txt +++ b/doc/authors.txt @@ -1,36 +1,39 @@ -OpenLayers contributors: - -Seb Benthall -Howard Butler -Bertil Chaupis -John Cole -Jeff Dege -Roald de Wit -Schuyler Erle -Christian López Espínola -John Frank -Sean Gilles -Pierre Giraud -Andreas Hocevar -Ian Johnson -Eric Lemoine -Philip Lindsay -Martijn van Oosterhout -Corey Puffault -Gregers Rygg -Tim Schaub -Christopher Schmidt -Cameron Shorter -Paul Spencer -Glen Stampoultzis -James Stembridge -Erik Uzureau -Ivan Willig -Bill Woodall -Steve Woodbridge - -Some portions of OpenLayers are used under the Apache 2.0 license, available -in doc/licenses/APACHE-2.0.txt. - -Some portions of OpenLayers are used under the MIT license, availabie in -doc/licenses/MIT-LICENSE.txt. +OpenLayers contributors: + +Seb Benthall +Howard Butler +Bertil Chaupis +John Cole +Jeff Dege +Roald de Wit +Schuyler Erle +Christian López Espínola +John Frank +Sean Gilles +Pierre Giraud +Andreas Hocevar +Ian Johnson +Eric Lemoine +Philip Lindsay +Martijn van Oosterhout +Corey Puffault +Gregers Rygg +Tim Schaub +Christopher Schmidt +Cameron Shorter +Paul Spencer +Glen Stampoultzis +James Stembridge +Erik Uzureau +Ivan Willig +Bill Woodall +Steve Woodbridge + +Some portions of OpenLayers are used under the Apache 2.0 license, available +in doc/licenses/APACHE-2.0.txt. + +Some portions of OpenLayers are used under the MIT license, availabie in +doc/licenses/MIT-LICENSE.txt. + +Some portions of OpenLayers are Copyright 2001 Robert Penner, and are used +under the BSD license, available in doc/licenses/BSD-LICENSE.txt diff --git a/doc/licenses/BSD-LICENSE.txt b/doc/licenses/BSD-LICENSE.txt new file mode 100644 index 0000000000..aa321e6749 --- /dev/null +++ b/doc/licenses/BSD-LICENSE.txt @@ -0,0 +1,28 @@ +Redistribution and use of this software in source and binary forms, with or +without modification, are permitted provided that the following conditions are +met: + +* Redistributions of source code must retain the above + copyright notice, this list of conditions and the + following disclaimer. + +* Redistributions in binary form must reproduce the above + copyright notice, this list of conditions and the + following disclaimer in the documentation and/or other + materials provided with the distribution. + +* Neither the name of Yahoo! Inc. nor the names of its + contributors may be used to endorse or promote products + derived from this software without specific prior + written permission of Yahoo! Inc. + +THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS" AND +ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED +WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE +DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT OWNER OR CONTRIBUTORS BE LIABLE FOR +ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES +(INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; +LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON +ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT +(INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS +SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE. diff --git a/lib/OpenLayers.js b/lib/OpenLayers.js index 92aa015334..a948d7e02b 100644 --- a/lib/OpenLayers.js +++ b/lib/OpenLayers.js @@ -79,6 +79,7 @@ "OpenLayers/BaseTypes/Pixel.js", "OpenLayers/BaseTypes/Size.js", "OpenLayers/Console.js", + "OpenLayers/Tween.js", "Rico/Corner.js", "Rico/Color.js", "OpenLayers/Ajax.js", diff --git a/lib/OpenLayers/Tween.js b/lib/OpenLayers/Tween.js new file mode 100644 index 0000000000..d325f793f6 --- /dev/null +++ b/lib/OpenLayers/Tween.js @@ -0,0 +1,256 @@ +/* Copyright (c) 2006-2008 MetaCarta, Inc., published under the Clear BSD + * license. See http://svn.openlayers.org/trunk/openlayers/license.txt for the + * full text of the license. */ + +/** + * Namespace: OpenLayers.Tween + */ +OpenLayers.Tween = OpenLayers.Class({ + + /** + * Constant: INTERVAL + * {int} Interval in milliseconds between 2 steps + */ + INTERVAL: 10, + + /** + * APIProperty: easing + * {(Function)} Easing equation used for the animation + * Defaultly set to OpenLayers.Easing.Expo.easeOut + */ + easing: null, + + /** + * APIProperty: begin + * {Object} Values to start the animation with + */ + begin: null, + + /** + * APIProperty: finish + * {Object} Values to finish the animation with + */ + finish: null, + + /** + * APIProperty: duration + * {int} duration of the tween (number of steps) + */ + duration: null, + + /** + * APIProperty: callbacks + * {Object} An object with start, eachStep and done properties whose values + * are functions to be call during the animation. They are passed the + * current computed value as argument. + */ + callbacks: null, + + /** + * Property: time + * {int} Step counter + */ + time: null, + + /** + * Property: interval + * {int} Interval id returned by window.setInterval + */ + interval: null, + + /** + * Constructor: OpenLayers.Tween + * Creates a Tween. + * + * Parameters: + * easing - {(Function)} easing function method to use + */ + initialize: function(easing) { + this.easing = (easing) ? easing : OpenLayers.Easing.Expo.easeOut; + }, + + /** + * APIMethod: start + * Plays the Tween, and calls the callback method on each step + * + * Parameters: + * begin - {Object} values to start the animation with + * finish - {Object} values to finish the animation with + * duration - {int} duration of the tween (number of steps) + * options - {Object} hash of options (for example callbacks (start, eachStep, done)) + */ + start: function(begin, finish, duration, options) { + this.begin = begin; + this.finish = finish; + this.duration = duration; + this.callbacks = options.callbacks; + this.time = 0; + if (this.interval) { + window.clearInterval(this.interval); + this.interval = null; + } + if (this.callbacks && this.callbacks.start) { + this.callbacks.start.call(this, this.begin); + } + this.interval = window.setInterval( + OpenLayers.Function.bind(this.play, this), this.INTERVAL); + }, + + /** + * APIMethod: stop + * Stops the Tween, and calls the finish callback + */ + stop: function() { + if (this.callbacks && this.callbacks.done) { + this.callbacks.done.call(this, this.finish); + } + window.clearInterval(this.interval); + this.interval = null; + }, + + /** + * Method: play + * Calls the appropriate easing method + */ + play: function() { + var value = {}; + for (var i in this.begin) { + var b = this.begin[i]; + var f = this.finish[i]; + if (b == null || f == null || isNaN(b) || isNaN(f)) { + OpenLayers.Console.error('invalid value for Tween'); + } + + var c = f - b; + value[i] = this.easing.apply(this, [this.time, b, c, this.duration]); + } + this.time++; + + if (this.callbacks && this.callbacks.eachStep) { + this.callbacks.eachStep.call(this, value); + } + + if (this.time > this.duration) { + if (this.callbacks && this.callbacks.done) { + this.callbacks.done.call(this, this.finish); + } + window.clearInterval(this.interval); + this.interval = null; + } + }, + + /** + * Create empty functions for all easing methods. + */ + CLASS_NAME: "OpenLayers.Tween" +}); + +/** + * Namespace: OpenLayers.Easing + * + * Credits: + * Easing Equations by Robert Penner, + */ +OpenLayers.Easing = { + /** + * Create empty functions for all easing methods. + */ + CLASS_NAME: "OpenLayers.Easing" +}; + +/** + * Namespace: OpenLayers.Easing.Linear + */ +OpenLayers.Easing.Linear = { + + /** + * Function: easeIn + * + * Parameters: + * t - {Float} time + * b - {Float} beginning position + * c - {Float} total change + * d - {Float} duration of the transition + */ + easeIn: function(t, b, c, d) { + return c*t/d + b; + }, + + /** + * Function: easeOut + * + * Parameters: + * t - {Float} time + * b - {Float} beginning position + * c - {Float} total change + * d - {Float} duration of the transition + */ + easeOut: function(t, b, c, d) { + return c*t/d + b; + }, + + /** + * Function: easeInOut + * + * Parameters: + * t - {Float} time + * b - {Float} beginning position + * c - {Float} total change + * d - {Float} duration of the transition + */ + easeInOut: function(t, b, c, d) { + return c*t/d + b; + }, + + CLASS_NAME: "OpenLayers.Easing.Linear" +}; + +/** + * Namespace: OpenLayers.Easing.Expo + */ +OpenLayers.Easing.Expo = { + + /** + * Function: easeIn + * + * Parameters: + * t - {Float} time + * b - {Float} beginning position + * c - {Float} total change + * d - {Float} duration of the transition + */ + easeIn: function(t, b, c, d) { + return (t==0) ? b : c * Math.pow(2, 10 * (t/d - 1)) + b; + }, + + /** + * Function: easeOut + * + * Parameters: + * t - {Float} time + * b - {Float} beginning position + * c - {Float} total change + * d - {Float} duration of the transition + */ + easeOut: function(t, b, c, d) { + return (t==d) ? b+c : c * (-Math.pow(2, -10 * t/d) + 1) + b; + }, + + /** + * Function: easeInOut + * + * Parameters: + * t - {Float} time + * b - {Float} beginning position + * c - {Float} total change + * d - {Float} duration of the transition + */ + easeInOut: function(t, b, c, d) { + if (t==0) return b; + if (t==d) return b+c; + if ((t/=d/2) < 1) return c/2 * Math.pow(2, 10 * (t - 1)) + b; + return c/2 * (-Math.pow(2, -10 * --t) + 2) + b; + }, + + CLASS_NAME: "OpenLayers.Easing.Expo" +}; diff --git a/tests/list-tests.html b/tests/list-tests.html index 0495a619fa..6438c86c3f 100644 --- a/tests/list-tests.html +++ b/tests/list-tests.html @@ -109,4 +109,5 @@
  • Renderer/test_SVG.html
  • Renderer/test_VML.html
  • test_Map.html
    • +
  • test_Tween.html
    • diff --git a/tests/manual/tween.html b/tests/manual/tween.html new file mode 100644 index 0000000000..4c2fa8ebbb --- /dev/null +++ b/tests/manual/tween.html @@ -0,0 +1,81 @@ + + + Tween Example + + + + + +
    Tween Example
    +
    +
    Show transition effects
    + + + +
    +
    +
    +
    + This is an example of transition effects. +
    + + \ No newline at end of file diff --git a/tests/test_Tween.html b/tests/test_Tween.html new file mode 100644 index 0000000000..87e9b9f360 --- /dev/null +++ b/tests/test_Tween.html @@ -0,0 +1,62 @@ + + + + + + +
    + +