Subversion Repositories Applications.papyrus

Rev

Blame | Last modification | View Log | RSS feed

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

dojo.require("dijit._Widget");
dojo.require("dijit._Templated");

dojo.declare(
        "dijit._MasterTooltip",
        [dijit._Widget, dijit._Templated],
        {
                // summary
                //              Internal widget that holds the actual tooltip markup,
                //              which occurs once per page.
                //              Called by Tooltip widgets which are just containers to hold
                //              the markup

                // duration: Integer
                //              Milliseconds to fade in/fade out
                duration: 200,

                templateString:"<div class=\"dijitTooltip dijitTooltipLeft\" id=\"dojoTooltip\">\n\t<div class=\"dijitTooltipContainer dijitTooltipContents\" dojoAttachPoint=\"containerNode\" waiRole='alert'></div>\n\t<div class=\"dijitTooltipConnector\"></div>\n</div>\n",

                postCreate: function(){
                        dojo.body().appendChild(this.domNode);

                        this.bgIframe = new dijit.BackgroundIframe(this.domNode);

                        // Setup fade-in and fade-out functions.
                        this.fadeIn = dojo.fadeIn({ node: this.domNode, duration: this.duration, onEnd: dojo.hitch(this, "_onShow") });
                        this.fadeOut = dojo.fadeOut({ node: this.domNode, duration: this.duration, onEnd: dojo.hitch(this, "_onHide") });

                },

                show: function(/*String*/ innerHTML, /*DomNode*/ aroundNode){
                        // summary:
                        //      Display tooltip w/specified contents to right specified node
                        //      (To left if there's no space on the right, or if LTR==right)

                        if(this.aroundNode && this.aroundNode === aroundNode){
                                return;
                        }

                        if(this.fadeOut.status() == "playing"){
                                // previous tooltip is being hidden; wait until the hide completes then show new one
                                this._onDeck=arguments;
                                return;
                        }
                        this.containerNode.innerHTML=innerHTML;

                        // Firefox bug. when innerHTML changes to be shorter than previous
                        // one, the node size will not be updated until it moves.
                        this.domNode.style.top = (this.domNode.offsetTop + 1) + "px";

                        // position the element and change CSS according to position    
                        var align = this.isLeftToRight() ? {'BR': 'BL', 'BL': 'BR'} : {'BL': 'BR', 'BR': 'BL'};
                        var pos = dijit.placeOnScreenAroundElement(this.domNode, aroundNode, align);
                        this.domNode.className="dijitTooltip dijitTooltip" + (pos.corner=='BL' ? "Right" : "Left");//FIXME: might overwrite class

                        // show it
                        dojo.style(this.domNode, "opacity", 0);
                        this.fadeIn.play();
                        this.isShowingNow = true;
                        this.aroundNode = aroundNode;
                },

                _onShow: function(){
                        if(dojo.isIE){
                                // the arrow won't show up on a node w/an opacity filter
                                this.domNode.style.filter="";
                        }
                },

                hide: function(aroundNode){
                        // summary: hide the tooltip
                        if(!this.aroundNode || this.aroundNode !== aroundNode){
                                return;
                        }
                        if(this._onDeck){
                                // this hide request is for a show() that hasn't even started yet;
                                // just cancel the pending show()
                                this._onDeck=null;
                                return;
                        }
                        this.fadeIn.stop();
                        this.isShowingNow = false;
                        this.aroundNode = null;
                        this.fadeOut.play();
                },

                _onHide: function(){
                        this.domNode.style.cssText="";  // to position offscreen again
                        if(this._onDeck){
                                // a show request has been queued up; do it now
                                this.show.apply(this, this._onDeck);
                                this._onDeck=null;
                        }
                }

        }
);

dijit.showTooltip = function(/*String*/ innerHTML, /*DomNode*/ aroundNode){
        // summary:
        //      Display tooltip w/specified contents to right specified node
        //      (To left if there's no space on the right, or if LTR==right)
        if(!dijit._masterTT){ dijit._masterTT = new dijit._MasterTooltip(); }
        return dijit._masterTT.show(innerHTML, aroundNode);
};

dijit.hideTooltip = function(aroundNode){
        // summary: hide the tooltip
        if(!dijit._masterTT){ dijit._masterTT = new dijit._MasterTooltip(); }
        return dijit._masterTT.hide(aroundNode);
};

dojo.declare(
        "dijit.Tooltip",
        dijit._Widget,
        {
                // summary
                //              Pops up a tooltip (a help message) when you hover over a node.

                // label: String
                //              Text to display in the tooltip.
                //              Specified as innerHTML when creating the widget from markup.
                label: "",

                // showDelay: Integer
                //              Number of milliseconds to wait after hovering over/focusing on the object, before
                //              the tooltip is displayed.
                showDelay: 400,

                // connectId: String[]
                //              Id(s) of domNodes to attach the tooltip to.
                //              When user hovers over any of the specified dom nodes, the tooltip will appear.
                connectId: [],

                postCreate: function(){
                        if(this.srcNodeRef){
                                this.srcNodeRef.style.display = "none";
                        }

                        this._connectNodes = [];
                        
                        dojo.forEach(this.connectId, function(id) {
                                var node = dojo.byId(id);
                                if (node) {
                                        this._connectNodes.push(node);
                                        dojo.forEach(["onMouseOver", "onMouseOut", "onFocus", "onBlur", "onHover", "onUnHover"], function(event){
                                                this.connect(node, event.toLowerCase(), "_"+event);
                                        }, this);
                                        if(dojo.isIE){
                                                // BiDi workaround
                                                node.style.zoom = 1;
                                        }
                                }
                        }, this);
                },

                _onMouseOver: function(/*Event*/ e){
                        this._onHover(e);
                },

                _onMouseOut: function(/*Event*/ e){
                        if(dojo.isDescendant(e.relatedTarget, e.target)){
                                // false event; just moved from target to target child; ignore.
                                return;
                        }
                        this._onUnHover(e);
                },

                _onFocus: function(/*Event*/ e){
                        this._focus = true;
                        this._onHover(e);
                },
                
                _onBlur: function(/*Event*/ e){
                        this._focus = false;
                        this._onUnHover(e);
                },

                _onHover: function(/*Event*/ e){
                        if(!this._showTimer){
                                var target = e.target;
                                this._showTimer = setTimeout(dojo.hitch(this, function(){this.open(target)}), this.showDelay);
                        }
                },

                _onUnHover: function(/*Event*/ e){
                        // keep a tooltip open if the associated element has focus
                        if(this._focus){ return; }
                        if(this._showTimer){
                                clearTimeout(this._showTimer);
                                delete this._showTimer;
                        }
                        this.close();
                },

                open: function(/*DomNode*/ target){
                        // summary: display the tooltip; usually not called directly.
                        target = target || this._connectNodes[0];
                        if(!target){ return; }

                        if(this._showTimer){
                                clearTimeout(this._showTimer);
                                delete this._showTimer;
                        }
                        dijit.showTooltip(this.label || this.domNode.innerHTML, target);
                        
                        this._connectNode = target;
                },

                close: function(){
                        // summary: hide the tooltip; usually not called directly.
                        dijit.hideTooltip(this._connectNode);
                        delete this._connectNode;
                        if(this._showTimer){
                                clearTimeout(this._showTimer);
                                delete this._showTimer;
                        }
                },

                uninitialize: function(){
                        this.close();
                }
        }
);

}