]> git.pond.sub.org Git - eow/blobdiff - static/dojo-release-1.1.1/dojo/NodeList-fx.js
add Dojo 1.1.1
[eow] / static / dojo-release-1.1.1 / dojo / NodeList-fx.js
diff --git a/static/dojo-release-1.1.1/dojo/NodeList-fx.js b/static/dojo-release-1.1.1/dojo/NodeList-fx.js
new file mode 100644 (file)
index 0000000..ede0a89
--- /dev/null
@@ -0,0 +1,137 @@
+if(!dojo._hasResource["dojo.NodeList-fx"]){ //_hasResource checks added by build. Do not use _hasResource directly in your code.
+dojo._hasResource["dojo.NodeList-fx"] = true;
+dojo.provide("dojo.NodeList-fx");
+dojo.require("dojo.fx");
+
+/*=====
+dojo["NodeList-fx"] = {
+       // summary: Adds dojo.fx animation support to dojo.query()
+};
+=====*/
+
+dojo.extend(dojo.NodeList, {
+       _anim: function(obj, method, args){
+               args = args||{};
+               return dojo.fx.combine(
+                       this.map(function(item){
+                               var tmpArgs = { node: item };
+                               dojo.mixin(tmpArgs, args);
+                               return obj[method](tmpArgs);
+                       })
+               ); // dojo._Animation
+       },
+
+       wipeIn: function(args){
+               //      summary:
+               //              wipe in all elements of this NodeList. Returns an instance of dojo._Animation
+               //      example:
+               //              Fade in all tables with class "blah":
+               //              |       dojo.query("table.blah").wipeIn().play();
+               return this._anim(dojo.fx, "wipeIn", args); // dojo._Animation
+       },
+
+       wipeOut: function(args){
+               //      summary:
+               //              wipe out all elements of this NodeList. Returns an instance of dojo._Animation
+               //      example:
+               //              Wipe out all tables with class "blah":
+               //              |       dojo.query("table.blah").wipeOut().play();
+               return this._anim(dojo.fx, "wipeOut", args); // dojo._Animation
+       },
+
+       slideTo: function(args){
+               //      summary:
+               //              slide all elements of the node list to the specified place.
+               //              Returns an instance of dojo._Animation
+               //      example:
+               //              |       Move all tables with class "blah" to 300/300:
+               //              |       dojo.query("table.blah").slideTo({
+               //              |               left: 40,
+               //              |               top: 50
+               //              |       }).play();
+               return this._anim(dojo.fx, "slideTo", args); // dojo._Animation
+       },
+
+
+       fadeIn: function(args){
+               //      summary:
+               //              fade in all elements of this NodeList. Returns an instance of dojo._Animation
+               //      example:
+               //              Fade in all tables with class "blah":
+               //              |       dojo.query("table.blah").fadeIn().play();
+               return this._anim(dojo, "fadeIn", args); // dojo._Animation
+       },
+
+       fadeOut: function(args){
+               //      summary:
+               //              fade out all elements of this NodeList. Returns an instance of dojo._Animation
+               //      example:
+               //              Fade out all elements with class "zork":
+               //              |       dojo.query(".zork").fadeOut().play();
+               //      example:
+               //              Fade them on a delay and do something at the end:
+               //              |       var fo = dojo.query(".zork").fadeOut();
+               //              |       dojo.connect(fo, "onEnd", function(){ /*...*/ });
+               //              |       fo.play();
+               return this._anim(dojo, "fadeOut", args); // dojo._Animation
+       },
+
+       animateProperty: function(args){
+               //      summary:
+               //              see dojo.animateProperty(). Animate all elements of this
+               //              NodeList across the properties specified.
+               //      example:
+               //      |       dojo.query(".zork").animateProperty({
+               //      |               duration: 500,
+               //      |               properties: { 
+               //      |                       color:          { start: "black", end: "white" },
+               //      |                       left:           { end: 300 } 
+               //      |               } 
+               //      |       }).play();
+               return this._anim(dojo, "animateProperty", args); // dojo._Animation
+       },
+
+       anim: function( /*Object*/                      properties, 
+                                       /*Integer?*/            duration, 
+                                       /*Function?*/           easing, 
+                                       /*Function?*/           onEnd,
+                                       /*Integer?*/            delay){
+               //      summary:
+               //              Animate one or more CSS properties for all nodes in this list.
+               //              The returned animation object will already be playing when it
+               //              is returned. See the docs for `dojo.anim` for full details.
+               //      properties: Object
+               //              the properties to animate
+               //      duration: Integer?
+               //              Optional. The time to run the animations for
+               //      easing: Function?
+               //              Optional. The easing function to use.
+               //      onEnd: Function?
+               //              A function to be called when the animation ends
+               //      delay:
+               //              how long to delay playing the returned animation
+               //      example:
+               //              Another way to fade out:
+               //      |       dojo.query(".thinger").anim({ opacity: 0 });
+               //      example:
+               //              animate all elements with the "thigner" class to a width of 500
+               //              pixels over half a second
+               //      |       dojo.query(".thinger").anim({ width: 500 }, 700);
+               var canim = dojo.fx.combine(
+                       this.map(function(item){
+                               return dojo.animateProperty({
+                                       node: item,
+                                       properties: properties,
+                                       duration: duration||350,
+                                       easing: easing
+                               });
+                       })
+               ); 
+               if(onEnd){
+                       dojo.connect(canim, "onEnd", onEnd);
+               }
+               return canim.play(delay||0); // dojo._Animation
+       }
+});
+
+}