animation.js

Implements basic animation framework, as well as some pre-defined animation effects.

Ojbects

• Animation(animationStructure, delay)

Methods

• Animation::start()
• Animation::stop()

Functions

• AnimationStructure.generate(element, type, paramsObj)

Constants

• AnimationData.FADEIN
• AnimationData.FADEOUT
• AnimationData.RESIZE
• AnimationData.MOVE

Animation(animationStructure, delay)

Creates animation. Animation effect is specified via animationStructure, executed with delay of delay. User may specify a callback to be executed when animation ends, via endFunction property.

Animation::start()

Starts the animation.

Animation::stop()

Stops the animation.

AnimationStructure.generate(element, type, paramsObj)

Creates an animationStructure, which describes current animation effect. This animation will be applied to DOM node element, its type is specified as a constant, and further arguments can be set in paramsObj, depending on current type:

• AnimationData.FADEIN - paramsObj = {max:"maximum opacity [0,1]", step:"one step [0,1]"}
• AnimationData.FADEOUT - paramsObj = {min:"minimum opacity [0,1]", step:"one step [0,1]"}
• AnimationData.RESIZE - paramsObj = {w:"final width", h:"final height", dist:"diagonal distance per step"}
• AnimationData.MOVE - paramsObj = {x:"final left coordinate", y:"final top coordinate", dist:"diagonal distance per step", tol:"tolerance for end detection"}

var div = Dom.create("div");
var as = AnimationStructure.generate(div, AnimationData.FADEOUT, {min:0.5, step: 0.02});
var a = new Animation(as, 50);
a.start(); // will slowly make <div> element 50% transparent