Subversion Repositories Applications.papyrus

Rev

Blame | Last modification | View Log | RSS feed

if(!dojo._hasResource["dojo.fx"]){ //_hasResource checks added by build. Do not use _hasResource directly in your code.
dojo._hasResource["dojo.fx"] = true;
dojo.provide("dojo.fx");
dojo.provide("dojo.fx.Toggler");

dojo.fx.chain = function(/*dojo._Animation[]*/ animations){
        // summary: Chain a list of dojo._Animation s to run in sequence
        // example:
        //      |       dojo.fx.chain([
        //      |               dojo.fadeIn({ node:node }),
        //      |               dojo.fadeOut({ node:otherNode })
        //      |       ]).play();
        //
        var first = animations.shift();
        var previous = first;
        dojo.forEach(animations, function(current){
                dojo.connect(previous, "onEnd", current, "play");
                previous = current;
        });
        return first; // dojo._Animation
};

dojo.fx.combine = function(/*dojo._Animation[]*/ animations){
        // summary: Combine a list of dojo._Animation s to run in parallel
        // example:
        //      |       dojo.fx.combine([
        //      |               dojo.fadeIn({ node:node }),
        //      |               dojo.fadeOut({ node:otherNode })
        //      |       ]).play();
        var ctr = new dojo._Animation({ curve: [0, 1] });
        if(!animations.length){ return ctr; }
        // animations.sort(function(a, b){ return a.duration-b.duration; });
        ctr.duration = animations[0].duration;
        dojo.forEach(animations, function(current){
                dojo.forEach([ "play", "pause", "stop" ],
                        function(e){
                                if(current[e]){
                                        dojo.connect(ctr, e, current, e);
                                }
                        }
                );
        });
        return ctr; // dojo._Animation
};

dojo.declare("dojo.fx.Toggler", null, {
        // summary:
        //              class constructor for an animation toggler. It accepts a packed
        //              set of arguments about what type of animation to use in each
        //              direction, duration, etc.
        //
        // example:
        //      |       var t = new dojo.fx.Toggler({
        //      |               node: "nodeId",
        //      |               showDuration: 500,
        //      |               // hideDuration will default to "200"
        //      |               showFunc: dojo.wipeIn, 
        //      |               // hideFunc will default to "fadeOut"
        //      |       });
        //      |       t.show(100); // delay showing for 100ms
        //      |       // ...time passes...
        //      |       t.hide();

        // FIXME: need a policy for where the toggler should "be" the next
        // time show/hide are called if we're stopped somewhere in the
        // middle.

        constructor: function(args){
                var _t = this;

                dojo.mixin(_t, args);
                _t.node = args.node;
                _t._showArgs = dojo.mixin({}, args);
                _t._showArgs.node = _t.node;
                _t._showArgs.duration = _t.showDuration;
                _t.showAnim = _t.showFunc(_t._showArgs);

                _t._hideArgs = dojo.mixin({}, args);
                _t._hideArgs.node = _t.node;
                _t._hideArgs.duration = _t.hideDuration;
                _t.hideAnim = _t.hideFunc(_t._hideArgs);

                dojo.connect(_t.showAnim, "beforeBegin", dojo.hitch(_t.hideAnim, "stop", true));
                dojo.connect(_t.hideAnim, "beforeBegin", dojo.hitch(_t.showAnim, "stop", true));
        },

        // node: DomNode
        //      the node to toggle
        node: null,

        // showFunc: Function
        //      The function that returns the dojo._Animation to show the node
        showFunc: dojo.fadeIn,

        // hideFunc: Function   
        //      The function that returns the dojo._Animation to hide the node
        hideFunc: dojo.fadeOut,

        // showDuration:
        //      Time in milliseconds to run the show Animation
        showDuration: 200,

        // hideDuration:
        //      Time in milliseconds to run the hide Animation
        hideDuration: 200,

        /*=====
        _showArgs: null,
        _showAnim: null,

        _hideArgs: null,
        _hideAnim: null,

        _isShowing: false,
        _isHiding: false,
        =====*/

        show: function(delay){
                // summary: Toggle the node to showing
                return this.showAnim.play(delay || 0);
        },

        hide: function(delay){
                // summary: Toggle the node to hidden
                return this.hideAnim.play(delay || 0);
        }
});

dojo.fx.wipeIn = function(/*Object*/ args){
        // summary
        //              Returns an animation that will expand the
        //              node defined in 'args' object from it's current height to
        //              it's natural height (with no scrollbar).
        //              Node must have no margin/border/padding.
        args.node = dojo.byId(args.node);
        var node = args.node, s = node.style;

        var anim = dojo.animateProperty(dojo.mixin({
                properties: {
                        height: {
                                // wrapped in functions so we wait till the last second to query (in case value has changed)
                                start: function(){
                                        // start at current [computed] height, but use 1px rather than 0
                                        // because 0 causes IE to display the whole panel
                                        s.overflow="hidden";
                                        if(s.visibility=="hidden"||s.display=="none"){
                                                s.height="1px";
                                                s.display="";
                                                s.visibility="";
                                                return 1;
                                        }else{
                                                var height = dojo.style(node, "height");
                                                return Math.max(height, 1);
                                        }
                                },
                                end: function(){
                                        return node.scrollHeight;
                                }
                        }
                }
        }, args));

        dojo.connect(anim, "onEnd", function(){ 
                s.height = "auto";
        });

        return anim; // dojo._Animation
}

dojo.fx.wipeOut = function(/*Object*/ args){
        // summary
        //              Returns an animation that will shrink node defined in "args"
        //              from it's current height to 1px, and then hide it.
        var node = args.node = dojo.byId(args.node);
        var s = node.style;

        var anim = dojo.animateProperty(dojo.mixin({
                properties: {
                        height: {
                                end: 1 // 0 causes IE to display the whole panel
                        }
                }
        }, args));

        dojo.connect(anim, "beforeBegin", function(){
                s.overflow = "hidden";
                s.display = "";
        });
        dojo.connect(anim, "onEnd", function(){
                s.height = "auto";
                s.display = "none";
        });

        return anim; // dojo._Animation
}

dojo.fx.slideTo = function(/*Object?*/ args){
        // summary
        //              Returns an animation that will slide "node" 
        //              defined in args Object from its current position to
        //              the position defined by (args.left, args.top).
        // example:
        //      |       dojo.fx.slideTo({ node: node, left:"40", top:"50", unit:"px" }).play()

        var node = (args.node = dojo.byId(args.node));
        
        var top = null;
        var left = null;
        
        var init = (function(n){
                return function(){
                        var cs = dojo.getComputedStyle(n);
                        var pos = cs.position;
                        top = (pos == 'absolute' ? n.offsetTop : parseInt(cs.top) || 0);
                        left = (pos == 'absolute' ? n.offsetLeft : parseInt(cs.left) || 0);
                        if(pos != 'absolute' && pos != 'relative'){
                                var ret = dojo.coords(n, true);
                                top = ret.y;
                                left = ret.x;
                                n.style.position="absolute";
                                n.style.top=top+"px";
                                n.style.left=left+"px";
                        }
                };
        })(node);
        init();

        var anim = dojo.animateProperty(dojo.mixin({
                properties: {
                        top: { end: args.top||0 },
                        left: { end: args.left||0 }
                }
        }, args));
        dojo.connect(anim, "beforeBegin", anim, init);

        return anim; // dojo._Animation
}

}