[dojo-contributors] dojo.fx.lite

Scott J. Miles sjmiles at turbophp.com
Fri Apr 21 18:44:56 EDT 2006


>> var comb = new dojo.fx.lite.Combine(anim1, anim2, anim3); comb.play();
>> anim1.chain(anim2.chain(anim3)).play(); 

I suggest we just have one syntax for combining/chaining. i.e.: 

new dojo.fx.Combine(anim1, anim2, anim3).play();
new dojo.fx.Chain(anim1, anim2, anim3).play();

a complex example might look like this:

new dojo.fx.Combine(anim1, new dojo.fx.Chain(new dojo.fx.Combine(anim2,
anim2b), anim3), anim4).play();

Parallelism helps memory-challenged individuals like myself.

Regards,
Scott J. Miles
TurboAjax Group
http://www.turboajax.com

-----Original Message-----
From: dojo-contributors-bounces at dojotoolkit.org
[mailto:dojo-contributors-bounces at dojotoolkit.org] On Behalf Of Bryan Forbes
Sent: Friday, April 21, 2006 8:26 AM
To: dojo dev.
Subject: [dojo-contributors] dojo.fx.lite

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

 
      

-- 
No virus found in this outgoing message.
Checked by AVG Free Edition.
Version: 7.1.385 / Virus Database: 268.4.5/321 - Release Date: 4/21/2006
 




More information about the dojo-contributors mailing list