[76] | 1 | /* Copyright (c) 2006-2010 by OpenLayers Contributors (see authors.txt for |
---|
| 2 | * full list of contributors). Published under the Clear BSD license. |
---|
| 3 | * See http://svn.openlayers.org/trunk/openlayers/license.txt for the |
---|
| 4 | * full text of the license. */ |
---|
| 5 | |
---|
| 6 | /** |
---|
| 7 | * @requires OpenLayers/Console.js |
---|
| 8 | */ |
---|
| 9 | |
---|
| 10 | /** |
---|
| 11 | * Namespace: OpenLayers.Tween |
---|
| 12 | */ |
---|
| 13 | OpenLayers.Tween = OpenLayers.Class({ |
---|
| 14 | |
---|
| 15 | /** |
---|
| 16 | * Constant: INTERVAL |
---|
| 17 | * {int} Interval in milliseconds between 2 steps |
---|
| 18 | */ |
---|
| 19 | INTERVAL: 10, |
---|
| 20 | |
---|
| 21 | /** |
---|
| 22 | * APIProperty: easing |
---|
| 23 | * {<OpenLayers.Easing>(Function)} Easing equation used for the animation |
---|
| 24 | * Defaultly set to OpenLayers.Easing.Expo.easeOut |
---|
| 25 | */ |
---|
| 26 | easing: null, |
---|
| 27 | |
---|
| 28 | /** |
---|
| 29 | * APIProperty: begin |
---|
| 30 | * {Object} Values to start the animation with |
---|
| 31 | */ |
---|
| 32 | begin: null, |
---|
| 33 | |
---|
| 34 | /** |
---|
| 35 | * APIProperty: finish |
---|
| 36 | * {Object} Values to finish the animation with |
---|
| 37 | */ |
---|
| 38 | finish: null, |
---|
| 39 | |
---|
| 40 | /** |
---|
| 41 | * APIProperty: duration |
---|
| 42 | * {int} duration of the tween (number of steps) |
---|
| 43 | */ |
---|
| 44 | duration: null, |
---|
| 45 | |
---|
| 46 | /** |
---|
| 47 | * APIProperty: callbacks |
---|
| 48 | * {Object} An object with start, eachStep and done properties whose values |
---|
| 49 | * are functions to be call during the animation. They are passed the |
---|
| 50 | * current computed value as argument. |
---|
| 51 | */ |
---|
| 52 | callbacks: null, |
---|
| 53 | |
---|
| 54 | /** |
---|
| 55 | * Property: time |
---|
| 56 | * {int} Step counter |
---|
| 57 | */ |
---|
| 58 | time: null, |
---|
| 59 | |
---|
| 60 | /** |
---|
| 61 | * Property: interval |
---|
| 62 | * {int} Interval id returned by window.setInterval |
---|
| 63 | */ |
---|
| 64 | interval: null, |
---|
| 65 | |
---|
| 66 | /** |
---|
| 67 | * Property: playing |
---|
| 68 | * {Boolean} Tells if the easing is currently playing |
---|
| 69 | */ |
---|
| 70 | playing: false, |
---|
| 71 | |
---|
| 72 | /** |
---|
| 73 | * Constructor: OpenLayers.Tween |
---|
| 74 | * Creates a Tween. |
---|
| 75 | * |
---|
| 76 | * Parameters: |
---|
| 77 | * easing - {<OpenLayers.Easing>(Function)} easing function method to use |
---|
| 78 | */ |
---|
| 79 | initialize: function(easing) { |
---|
| 80 | this.easing = (easing) ? easing : OpenLayers.Easing.Expo.easeOut; |
---|
| 81 | }, |
---|
| 82 | |
---|
| 83 | /** |
---|
| 84 | * APIMethod: start |
---|
| 85 | * Plays the Tween, and calls the callback method on each step |
---|
| 86 | * |
---|
| 87 | * Parameters: |
---|
| 88 | * begin - {Object} values to start the animation with |
---|
| 89 | * finish - {Object} values to finish the animation with |
---|
| 90 | * duration - {int} duration of the tween (number of steps) |
---|
| 91 | * options - {Object} hash of options (for example callbacks (start, eachStep, done)) |
---|
| 92 | */ |
---|
| 93 | start: function(begin, finish, duration, options) { |
---|
| 94 | this.playing = true; |
---|
| 95 | this.begin = begin; |
---|
| 96 | this.finish = finish; |
---|
| 97 | this.duration = duration; |
---|
| 98 | this.callbacks = options.callbacks; |
---|
| 99 | this.time = 0; |
---|
| 100 | if (this.interval) { |
---|
| 101 | window.clearInterval(this.interval); |
---|
| 102 | this.interval = null; |
---|
| 103 | } |
---|
| 104 | if (this.callbacks && this.callbacks.start) { |
---|
| 105 | this.callbacks.start.call(this, this.begin); |
---|
| 106 | } |
---|
| 107 | this.interval = window.setInterval( |
---|
| 108 | OpenLayers.Function.bind(this.play, this), this.INTERVAL); |
---|
| 109 | }, |
---|
| 110 | |
---|
| 111 | /** |
---|
| 112 | * APIMethod: stop |
---|
| 113 | * Stops the Tween, and calls the done callback |
---|
| 114 | * Doesn't do anything if animation is already finished |
---|
| 115 | */ |
---|
| 116 | stop: function() { |
---|
| 117 | if (!this.playing) { |
---|
| 118 | return; |
---|
| 119 | } |
---|
| 120 | |
---|
| 121 | if (this.callbacks && this.callbacks.done) { |
---|
| 122 | this.callbacks.done.call(this, this.finish); |
---|
| 123 | } |
---|
| 124 | window.clearInterval(this.interval); |
---|
| 125 | this.interval = null; |
---|
| 126 | this.playing = false; |
---|
| 127 | }, |
---|
| 128 | |
---|
| 129 | /** |
---|
| 130 | * Method: play |
---|
| 131 | * Calls the appropriate easing method |
---|
| 132 | */ |
---|
| 133 | play: function() { |
---|
| 134 | var value = {}; |
---|
| 135 | for (var i in this.begin) { |
---|
| 136 | var b = this.begin[i]; |
---|
| 137 | var f = this.finish[i]; |
---|
| 138 | if (b == null || f == null || isNaN(b) || isNaN(f)) { |
---|
| 139 | OpenLayers.Console.error('invalid value for Tween'); |
---|
| 140 | } |
---|
| 141 | |
---|
| 142 | var c = f - b; |
---|
| 143 | value[i] = this.easing.apply(this, [this.time, b, c, this.duration]); |
---|
| 144 | } |
---|
| 145 | this.time++; |
---|
| 146 | |
---|
| 147 | if (this.callbacks && this.callbacks.eachStep) { |
---|
| 148 | this.callbacks.eachStep.call(this, value); |
---|
| 149 | } |
---|
| 150 | |
---|
| 151 | if (this.time > this.duration) { |
---|
| 152 | this.stop(); |
---|
| 153 | } |
---|
| 154 | }, |
---|
| 155 | |
---|
| 156 | /** |
---|
| 157 | * Create empty functions for all easing methods. |
---|
| 158 | */ |
---|
| 159 | CLASS_NAME: "OpenLayers.Tween" |
---|
| 160 | }); |
---|
| 161 | |
---|
| 162 | /** |
---|
| 163 | * Namespace: OpenLayers.Easing |
---|
| 164 | * |
---|
| 165 | * Credits: |
---|
| 166 | * Easing Equations by Robert Penner, <http://www.robertpenner.com/easing/> |
---|
| 167 | */ |
---|
| 168 | OpenLayers.Easing = { |
---|
| 169 | /** |
---|
| 170 | * Create empty functions for all easing methods. |
---|
| 171 | */ |
---|
| 172 | CLASS_NAME: "OpenLayers.Easing" |
---|
| 173 | }; |
---|
| 174 | |
---|
| 175 | /** |
---|
| 176 | * Namespace: OpenLayers.Easing.Linear |
---|
| 177 | */ |
---|
| 178 | OpenLayers.Easing.Linear = { |
---|
| 179 | |
---|
| 180 | /** |
---|
| 181 | * Function: easeIn |
---|
| 182 | * |
---|
| 183 | * Parameters: |
---|
| 184 | * t - {Float} time |
---|
| 185 | * b - {Float} beginning position |
---|
| 186 | * c - {Float} total change |
---|
| 187 | * d - {Float} duration of the transition |
---|
| 188 | */ |
---|
| 189 | easeIn: function(t, b, c, d) { |
---|
| 190 | return c*t/d + b; |
---|
| 191 | }, |
---|
| 192 | |
---|
| 193 | /** |
---|
| 194 | * Function: easeOut |
---|
| 195 | * |
---|
| 196 | * Parameters: |
---|
| 197 | * t - {Float} time |
---|
| 198 | * b - {Float} beginning position |
---|
| 199 | * c - {Float} total change |
---|
| 200 | * d - {Float} duration of the transition |
---|
| 201 | */ |
---|
| 202 | easeOut: function(t, b, c, d) { |
---|
| 203 | return c*t/d + b; |
---|
| 204 | }, |
---|
| 205 | |
---|
| 206 | /** |
---|
| 207 | * Function: easeInOut |
---|
| 208 | * |
---|
| 209 | * Parameters: |
---|
| 210 | * t - {Float} time |
---|
| 211 | * b - {Float} beginning position |
---|
| 212 | * c - {Float} total change |
---|
| 213 | * d - {Float} duration of the transition |
---|
| 214 | */ |
---|
| 215 | easeInOut: function(t, b, c, d) { |
---|
| 216 | return c*t/d + b; |
---|
| 217 | }, |
---|
| 218 | |
---|
| 219 | CLASS_NAME: "OpenLayers.Easing.Linear" |
---|
| 220 | }; |
---|
| 221 | |
---|
| 222 | /** |
---|
| 223 | * Namespace: OpenLayers.Easing.Expo |
---|
| 224 | */ |
---|
| 225 | OpenLayers.Easing.Expo = { |
---|
| 226 | |
---|
| 227 | /** |
---|
| 228 | * Function: easeIn |
---|
| 229 | * |
---|
| 230 | * Parameters: |
---|
| 231 | * t - {Float} time |
---|
| 232 | * b - {Float} beginning position |
---|
| 233 | * c - {Float} total change |
---|
| 234 | * d - {Float} duration of the transition |
---|
| 235 | */ |
---|
| 236 | easeIn: function(t, b, c, d) { |
---|
| 237 | return (t==0) ? b : c * Math.pow(2, 10 * (t/d - 1)) + b; |
---|
| 238 | }, |
---|
| 239 | |
---|
| 240 | /** |
---|
| 241 | * Function: easeOut |
---|
| 242 | * |
---|
| 243 | * Parameters: |
---|
| 244 | * t - {Float} time |
---|
| 245 | * b - {Float} beginning position |
---|
| 246 | * c - {Float} total change |
---|
| 247 | * d - {Float} duration of the transition |
---|
| 248 | */ |
---|
| 249 | easeOut: function(t, b, c, d) { |
---|
| 250 | return (t==d) ? b+c : c * (-Math.pow(2, -10 * t/d) + 1) + b; |
---|
| 251 | }, |
---|
| 252 | |
---|
| 253 | /** |
---|
| 254 | * Function: easeInOut |
---|
| 255 | * |
---|
| 256 | * Parameters: |
---|
| 257 | * t - {Float} time |
---|
| 258 | * b - {Float} beginning position |
---|
| 259 | * c - {Float} total change |
---|
| 260 | * d - {Float} duration of the transition |
---|
| 261 | */ |
---|
| 262 | easeInOut: function(t, b, c, d) { |
---|
| 263 | if (t==0) return b; |
---|
| 264 | if (t==d) return b+c; |
---|
| 265 | if ((t/=d/2) < 1) return c/2 * Math.pow(2, 10 * (t - 1)) + b; |
---|
| 266 | return c/2 * (-Math.pow(2, -10 * --t) + 2) + b; |
---|
| 267 | }, |
---|
| 268 | |
---|
| 269 | CLASS_NAME: "OpenLayers.Easing.Expo" |
---|
| 270 | }; |
---|
| 271 | |
---|
| 272 | /** |
---|
| 273 | * Namespace: OpenLayers.Easing.Quad |
---|
| 274 | */ |
---|
| 275 | OpenLayers.Easing.Quad = { |
---|
| 276 | |
---|
| 277 | /** |
---|
| 278 | * Function: easeIn |
---|
| 279 | * |
---|
| 280 | * Parameters: |
---|
| 281 | * t - {Float} time |
---|
| 282 | * b - {Float} beginning position |
---|
| 283 | * c - {Float} total change |
---|
| 284 | * d - {Float} duration of the transition |
---|
| 285 | */ |
---|
| 286 | easeIn: function(t, b, c, d) { |
---|
| 287 | return c*(t/=d)*t + b; |
---|
| 288 | }, |
---|
| 289 | |
---|
| 290 | /** |
---|
| 291 | * Function: easeOut |
---|
| 292 | * |
---|
| 293 | * Parameters: |
---|
| 294 | * t - {Float} time |
---|
| 295 | * b - {Float} beginning position |
---|
| 296 | * c - {Float} total change |
---|
| 297 | * d - {Float} duration of the transition |
---|
| 298 | */ |
---|
| 299 | easeOut: function(t, b, c, d) { |
---|
| 300 | return -c *(t/=d)*(t-2) + b; |
---|
| 301 | }, |
---|
| 302 | |
---|
| 303 | /** |
---|
| 304 | * Function: easeInOut |
---|
| 305 | * |
---|
| 306 | * Parameters: |
---|
| 307 | * t - {Float} time |
---|
| 308 | * b - {Float} beginning position |
---|
| 309 | * c - {Float} total change |
---|
| 310 | * d - {Float} duration of the transition |
---|
| 311 | */ |
---|
| 312 | easeInOut: function(t, b, c, d) { |
---|
| 313 | if ((t/=d/2) < 1) return c/2*t*t + b; |
---|
| 314 | return -c/2 * ((--t)*(t-2) - 1) + b; |
---|
| 315 | }, |
---|
| 316 | |
---|
| 317 | CLASS_NAME: "OpenLayers.Easing.Quad" |
---|
| 318 | }; |
---|