| /* |
| Copyright (c) 2004-2006, The Dojo Foundation |
| All Rights Reserved. |
| |
| Licensed under the Academic Free License version 2.1 or above OR the |
| modified BSD license. For more information on Dojo licensing, see: |
| |
| http://dojotoolkit.org/community/licensing.shtml |
| */ |
| |
| |
| |
| dojo.provide("dojo.lfx.Animation"); |
| dojo.require("dojo.lang.func"); |
| dojo.lfx.Line = function (start, end) { |
| this.start = start; |
| this.end = end; |
| if (dojo.lang.isArray(start)) { |
| var diff = []; |
| dojo.lang.forEach(this.start, function (s, i) { |
| diff[i] = this.end[i] - s; |
| }, this); |
| this.getValue = function (n) { |
| var res = []; |
| dojo.lang.forEach(this.start, function (s, i) { |
| res[i] = (diff[i] * n) + s; |
| }, this); |
| return res; |
| }; |
| } else { |
| var diff = end - start; |
| this.getValue = function (n) { |
| return (diff * n) + this.start; |
| }; |
| } |
| }; |
| if ((dojo.render.html.khtml) && (!dojo.render.html.safari)) { |
| dojo.lfx.easeDefault = function (n) { |
| return (parseFloat("0.5") + ((Math.sin((n + parseFloat("1.5")) * Math.PI)) / 2)); |
| }; |
| } else { |
| dojo.lfx.easeDefault = function (n) { |
| return (0.5 + ((Math.sin((n + 1.5) * Math.PI)) / 2)); |
| }; |
| } |
| dojo.lfx.easeIn = function (n) { |
| return Math.pow(n, 3); |
| }; |
| dojo.lfx.easeOut = function (n) { |
| return (1 - Math.pow(1 - n, 3)); |
| }; |
| dojo.lfx.easeInOut = function (n) { |
| return ((3 * Math.pow(n, 2)) - (2 * Math.pow(n, 3))); |
| }; |
| dojo.lfx.IAnimation = function () { |
| }; |
| dojo.lang.extend(dojo.lfx.IAnimation, {curve:null, duration:1000, easing:null, repeatCount:0, rate:10, handler:null, beforeBegin:null, onBegin:null, onAnimate:null, onEnd:null, onPlay:null, onPause:null, onStop:null, play:null, pause:null, stop:null, connect:function (evt, scope, newFunc) { |
| if (!newFunc) { |
| newFunc = scope; |
| scope = this; |
| } |
| newFunc = dojo.lang.hitch(scope, newFunc); |
| var oldFunc = this[evt] || function () { |
| }; |
| this[evt] = function () { |
| var ret = oldFunc.apply(this, arguments); |
| newFunc.apply(this, arguments); |
| return ret; |
| }; |
| return this; |
| }, fire:function (evt, args) { |
| if (this[evt]) { |
| this[evt].apply(this, (args || [])); |
| } |
| return this; |
| }, repeat:function (count) { |
| this.repeatCount = count; |
| return this; |
| }, _active:false, _paused:false}); |
| dojo.lfx.Animation = function (handlers, duration, curve, easing, repeatCount, rate) { |
| dojo.lfx.IAnimation.call(this); |
| if (dojo.lang.isNumber(handlers) || (!handlers && duration.getValue)) { |
| rate = repeatCount; |
| repeatCount = easing; |
| easing = curve; |
| curve = duration; |
| duration = handlers; |
| handlers = null; |
| } else { |
| if (handlers.getValue || dojo.lang.isArray(handlers)) { |
| rate = easing; |
| repeatCount = curve; |
| easing = duration; |
| curve = handlers; |
| duration = null; |
| handlers = null; |
| } |
| } |
| if (dojo.lang.isArray(curve)) { |
| this.curve = new dojo.lfx.Line(curve[0], curve[1]); |
| } else { |
| this.curve = curve; |
| } |
| if (duration != null && duration > 0) { |
| this.duration = duration; |
| } |
| if (repeatCount) { |
| this.repeatCount = repeatCount; |
| } |
| if (rate) { |
| this.rate = rate; |
| } |
| if (handlers) { |
| dojo.lang.forEach(["handler", "beforeBegin", "onBegin", "onEnd", "onPlay", "onStop", "onAnimate"], function (item) { |
| if (handlers[item]) { |
| this.connect(item, handlers[item]); |
| } |
| }, this); |
| } |
| if (easing && dojo.lang.isFunction(easing)) { |
| this.easing = easing; |
| } |
| }; |
| dojo.inherits(dojo.lfx.Animation, dojo.lfx.IAnimation); |
| dojo.lang.extend(dojo.lfx.Animation, {_startTime:null, _endTime:null, _timer:null, _percent:0, _startRepeatCount:0, play:function (delay, gotoStart) { |
| if (gotoStart) { |
| clearTimeout(this._timer); |
| this._active = false; |
| this._paused = false; |
| this._percent = 0; |
| } else { |
| if (this._active && !this._paused) { |
| return this; |
| } |
| } |
| this.fire("handler", ["beforeBegin"]); |
| this.fire("beforeBegin"); |
| if (delay > 0) { |
| setTimeout(dojo.lang.hitch(this, function () { |
| this.play(null, gotoStart); |
| }), delay); |
| return this; |
| } |
| this._startTime = new Date().valueOf(); |
| if (this._paused) { |
| this._startTime -= (this.duration * this._percent / 100); |
| } |
| this._endTime = this._startTime + this.duration; |
| this._active = true; |
| this._paused = false; |
| var step = this._percent / 100; |
| var value = this.curve.getValue(step); |
| if (this._percent == 0) { |
| if (!this._startRepeatCount) { |
| this._startRepeatCount = this.repeatCount; |
| } |
| this.fire("handler", ["begin", value]); |
| this.fire("onBegin", [value]); |
| } |
| this.fire("handler", ["play", value]); |
| this.fire("onPlay", [value]); |
| this._cycle(); |
| return this; |
| }, pause:function () { |
| clearTimeout(this._timer); |
| if (!this._active) { |
| return this; |
| } |
| this._paused = true; |
| var value = this.curve.getValue(this._percent / 100); |
| this.fire("handler", ["pause", value]); |
| this.fire("onPause", [value]); |
| return this; |
| }, gotoPercent:function (pct, andPlay) { |
| clearTimeout(this._timer); |
| this._active = true; |
| this._paused = true; |
| this._percent = pct; |
| if (andPlay) { |
| this.play(); |
| } |
| return this; |
| }, stop:function (gotoEnd) { |
| clearTimeout(this._timer); |
| var step = this._percent / 100; |
| if (gotoEnd) { |
| step = 1; |
| } |
| var value = this.curve.getValue(step); |
| this.fire("handler", ["stop", value]); |
| this.fire("onStop", [value]); |
| this._active = false; |
| this._paused = false; |
| return this; |
| }, status:function () { |
| if (this._active) { |
| return this._paused ? "paused" : "playing"; |
| } else { |
| return "stopped"; |
| } |
| return this; |
| }, _cycle:function () { |
| clearTimeout(this._timer); |
| if (this._active) { |
| var curr = new Date().valueOf(); |
| var step = (curr - this._startTime) / (this._endTime - this._startTime); |
| if (step >= 1) { |
| step = 1; |
| this._percent = 100; |
| } else { |
| this._percent = step * 100; |
| } |
| if ((this.easing) && (dojo.lang.isFunction(this.easing))) { |
| step = this.easing(step); |
| } |
| var value = this.curve.getValue(step); |
| this.fire("handler", ["animate", value]); |
| this.fire("onAnimate", [value]); |
| if (step < 1) { |
| this._timer = setTimeout(dojo.lang.hitch(this, "_cycle"), this.rate); |
| } else { |
| this._active = false; |
| this.fire("handler", ["end"]); |
| this.fire("onEnd"); |
| if (this.repeatCount > 0) { |
| this.repeatCount--; |
| this.play(null, true); |
| } else { |
| if (this.repeatCount == -1) { |
| this.play(null, true); |
| } else { |
| if (this._startRepeatCount) { |
| this.repeatCount = this._startRepeatCount; |
| this._startRepeatCount = 0; |
| } |
| } |
| } |
| } |
| } |
| return this; |
| }}); |
| dojo.lfx.Combine = function (animations) { |
| dojo.lfx.IAnimation.call(this); |
| this._anims = []; |
| this._animsEnded = 0; |
| var anims = arguments; |
| if (anims.length == 1 && (dojo.lang.isArray(anims[0]) || dojo.lang.isArrayLike(anims[0]))) { |
| anims = anims[0]; |
| } |
| dojo.lang.forEach(anims, function (anim) { |
| this._anims.push(anim); |
| anim.connect("onEnd", dojo.lang.hitch(this, "_onAnimsEnded")); |
| }, this); |
| }; |
| dojo.inherits(dojo.lfx.Combine, dojo.lfx.IAnimation); |
| dojo.lang.extend(dojo.lfx.Combine, {_animsEnded:0, play:function (delay, gotoStart) { |
| if (!this._anims.length) { |
| return this; |
| } |
| this.fire("beforeBegin"); |
| if (delay > 0) { |
| setTimeout(dojo.lang.hitch(this, function () { |
| this.play(null, gotoStart); |
| }), delay); |
| return this; |
| } |
| if (gotoStart || this._anims[0].percent == 0) { |
| this.fire("onBegin"); |
| } |
| this.fire("onPlay"); |
| this._animsCall("play", null, gotoStart); |
| return this; |
| }, pause:function () { |
| this.fire("onPause"); |
| this._animsCall("pause"); |
| return this; |
| }, stop:function (gotoEnd) { |
| this.fire("onStop"); |
| this._animsCall("stop", gotoEnd); |
| return this; |
| }, _onAnimsEnded:function () { |
| this._animsEnded++; |
| if (this._animsEnded >= this._anims.length) { |
| this.fire("onEnd"); |
| } |
| return this; |
| }, _animsCall:function (funcName) { |
| var args = []; |
| if (arguments.length > 1) { |
| for (var i = 1; i < arguments.length; i++) { |
| args.push(arguments[i]); |
| } |
| } |
| var _this = this; |
| dojo.lang.forEach(this._anims, function (anim) { |
| anim[funcName](args); |
| }, _this); |
| return this; |
| }}); |
| dojo.lfx.Chain = function (animations) { |
| dojo.lfx.IAnimation.call(this); |
| this._anims = []; |
| this._currAnim = -1; |
| var anims = arguments; |
| if (anims.length == 1 && (dojo.lang.isArray(anims[0]) || dojo.lang.isArrayLike(anims[0]))) { |
| anims = anims[0]; |
| } |
| var _this = this; |
| dojo.lang.forEach(anims, function (anim, i, anims_arr) { |
| this._anims.push(anim); |
| if (i < anims_arr.length - 1) { |
| anim.connect("onEnd", dojo.lang.hitch(this, "_playNext")); |
| } else { |
| anim.connect("onEnd", dojo.lang.hitch(this, function () { |
| this.fire("onEnd"); |
| })); |
| } |
| }, this); |
| }; |
| dojo.inherits(dojo.lfx.Chain, dojo.lfx.IAnimation); |
| dojo.lang.extend(dojo.lfx.Chain, {_currAnim:-1, play:function (delay, gotoStart) { |
| if (!this._anims.length) { |
| return this; |
| } |
| if (gotoStart || !this._anims[this._currAnim]) { |
| this._currAnim = 0; |
| } |
| var currentAnimation = this._anims[this._currAnim]; |
| this.fire("beforeBegin"); |
| if (delay > 0) { |
| setTimeout(dojo.lang.hitch(this, function () { |
| this.play(null, gotoStart); |
| }), delay); |
| return this; |
| } |
| if (currentAnimation) { |
| if (this._currAnim == 0) { |
| this.fire("handler", ["begin", this._currAnim]); |
| this.fire("onBegin", [this._currAnim]); |
| } |
| this.fire("onPlay", [this._currAnim]); |
| currentAnimation.play(null, gotoStart); |
| } |
| return this; |
| }, pause:function () { |
| if (this._anims[this._currAnim]) { |
| this._anims[this._currAnim].pause(); |
| this.fire("onPause", [this._currAnim]); |
| } |
| return this; |
| }, playPause:function () { |
| if (this._anims.length == 0) { |
| return this; |
| } |
| if (this._currAnim == -1) { |
| this._currAnim = 0; |
| } |
| var currAnim = this._anims[this._currAnim]; |
| if (currAnim) { |
| if (!currAnim._active || currAnim._paused) { |
| this.play(); |
| } else { |
| this.pause(); |
| } |
| } |
| return this; |
| }, stop:function () { |
| var currAnim = this._anims[this._currAnim]; |
| if (currAnim) { |
| currAnim.stop(); |
| this.fire("onStop", [this._currAnim]); |
| } |
| return currAnim; |
| }, _playNext:function () { |
| if (this._currAnim == -1 || this._anims.length == 0) { |
| return this; |
| } |
| this._currAnim++; |
| if (this._anims[this._currAnim]) { |
| this._anims[this._currAnim].play(null, true); |
| } |
| return this; |
| }}); |
| dojo.lfx.combine = function (animations) { |
| var anims = arguments; |
| if (dojo.lang.isArray(arguments[0])) { |
| anims = arguments[0]; |
| } |
| if (anims.length == 1) { |
| return anims[0]; |
| } |
| return new dojo.lfx.Combine(anims); |
| }; |
| dojo.lfx.chain = function (animations) { |
| var anims = arguments; |
| if (dojo.lang.isArray(arguments[0])) { |
| anims = arguments[0]; |
| } |
| if (anims.length == 1) { |
| return anims[0]; |
| } |
| return new dojo.lfx.Chain(anims); |
| }; |
| |
