[dojo-contributors] dojo.fx.lite

Bryan Forbes bryan at reigndropsfall.net
Fri Apr 21 11:25:34 EDT 2006


Dear fellow developers,
     About 2 or 3 weeks ago, I was charged with the task (ok, I took the 
task on voluntarily) of coming up with a lite version of our animation 
library.  Attached is what I have come up with after consulting both 
Alex and Tom.  I have tried to make this as powerful as possible, while 
keeping the syntax simple.  With the help of Dan Pupius (through Alex), 
I have also added some simple easing functions to this animation library 
and I've tried to make it easy to use your own easing functions.  The 
real workhorse of this animation library is 
dojo.fx.lite.propertyAnimation.  The syntax is as follows:

dojo.fx.lite.propertyAnimation([
	{ property: /*String naming the property to change*/ prop,
	  node: /*DOMNode*/ node,
	  handlers: /*Object of event functions*/ handlers,
	  start: /*starting value*/ start,
	  end: /*ending value*/ end,
	  units: /*String (defaults to "px")*/ units,
	  curve: /*an optional curve object*/,
	  repeatCount: /*int*/,
	  rate: /*int*/ }, ...],
	duration, easing);

     For an example of how this is used, check out dojo.fx.lite.fadeIn 
or any of the other animations defined in lite.js.

     One other thing I have included is the ability to easily combine 
and chain animations together.  Basically, it is as follows:

To combine two or more animations together:
var comb = new dojo.fx.lite.Combine(anim1, anim2, anim3);
comb.play();

To chain (play one after another) animations together:
anim1.chain(anim2.chain(anim3)).play();

To combine with a chain:
anim1.chain(anim2, anim3.chain(anim4)).play();

The last one will play the animations in this order:
anim1 -> anim2 + (anim3 -> anim4)

     Both combine and chain can take either a Combine or an Animation so 
there is no need to convert from one to another.  Please take a look at 
this and let me know what you think.  There is a working demo at 
http://www.reigndropsfall.net/fx.lite/test.html.  As you can see, this 
only pulls in 8 files (excluding fx/lite.js and fx/lite/Animation.js).
     Another thing that need to be discussed is a new namespace for 
dojo.fx.lite (since that's not a very lite namespace).  Alex suggested 
to me dojo.ngfx (for Next Generation FX) or dojo.lfx.  I was thinking 
dojo.lx, but I'd like to hear some more ideas.  Anyway, take a look at 
the code I have attached (the .zip should be extracted into src/fx) give 
me some feedback.  Thanks!

-Bryan Forbes
-------------- next part --------------
A non-text attachment was scrubbed...
Name: fx.lite.zip
Type: application/octet-stream
Size: 4415 bytes
Desc: not available
Url : http://mail.dojotoolkit.org/pipermail/dojo-contributors/attachments/20060421/8e48fffd/attachment.dll 
-------------- next part --------------
An HTML attachment was scrubbed...
URL: http://mail.dojotoolkit.org/pipermail/dojo-contributors/attachments/20060421/8e48fffd/attachment.html 


More information about the dojo-contributors mailing list