source: Dev/trunk/src/client/dojox/charting/axis2d/common.js @ 532

define(["dojo/_base/lang", "dojo/_base/window", "dojo/dom-geometry", "dojox/gfx", "dojo/has"],
        function(lang, win, domGeom, g, has){

        var common = lang.getObject("dojox.charting.axis2d.common", true);
        
        var clearNode = function(s){
                s.marginLeft   = "0px";
                s.marginTop    = "0px";
                s.marginRight  = "0px";
                s.marginBottom = "0px";
                s.paddingLeft   = "0px";
                s.paddingTop    = "0px";
                s.paddingRight  = "0px";
                s.paddingBottom = "0px";
                s.borderLeftWidth   = "0px";
                s.borderTopWidth    = "0px";
                s.borderRightWidth  = "0px";
                s.borderBottomWidth = "0px";
        };

        var getBoxWidth = function(n){
                // marginBox is incredibly slow, so avoid it if we can
                if(n["getBoundingClientRect"]){
                        var bcr = n.getBoundingClientRect();
                        return bcr.width || (bcr.right - bcr.left);
                }else{
                        return domGeom.getMarginBox(n).w;
                }
        };

        return lang.mixin(common, {
                // summary:
                //              Common methods to be used by any axis.  This is considered "static".
                createText: {
                        gfx: function(chart, creator, x, y, align, text, font, fontColor){
                                // summary:
                                //              Use dojox.gfx to create any text.
                                // chart: dojox.charting.Chart
                                //              The chart to create the text into.
                                // creator: dojox.gfx.Surface
                                //              The graphics surface to use for creating the text.
                                // x: Number
                                //              Where to create the text along the x axis (CSS left).
                                // y: Number
                                //              Where to create the text along the y axis (CSS top).
                                // align: String
                                //              How to align the text.  Can be "left", "right", "center".
                                // text: String
                                //              The text to render.
                                // font: String
                                //              The font definition, a la CSS "font".
                                // fontColor: String|dojo.Color
                                //              The color of the resultant text.
                                // returns: dojox.gfx.Text
                                //              The resultant GFX object.
                                return creator.createText({
                                        x: x, y: y, text: text, align: align
                                }).setFont(font).setFill(fontColor);    //      dojox.gfx.Text
                        },
                        html: function(chart, creator, x, y, align, text, font, fontColor, labelWidth){
                                // summary:
                                //              Use the HTML DOM to create any text.
                                // chart: dojox.charting.Chart
                                //              The chart to create the text into.
                                // creator: dojox.gfx.Surface
                                //              The graphics surface to use for creating the text.
                                // x: Number
                                //              Where to create the text along the x axis (CSS left).
                                // y: Number
                                //              Where to create the text along the y axis (CSS top).
                                // align: String
                                //              How to align the text.  Can be "left", "right", "center".
                                // text: String
                                //              The text to render.
                                // font: String
                                //              The font definition, a la CSS "font".
                                // fontColor: String|dojo.Color
                                //              The color of the resultant text.
                                // labelWidth: Number?
                                //              The maximum width of the resultant DOM node.
                                // returns: DOMNode
                                //              The resultant DOMNode (a "div" element).

                                // setup the text node
                                var p = win.doc.createElement("div"), s = p.style, boxWidth;
                                // bidi support, if this function exists the module was loaded 
                                if(chart.getTextDir){
                                        p.dir = chart.getTextDir(text);
                                }
                                clearNode(s);
                                s.font = font;
                                p.innerHTML = String(text).replace(/\s/g, " ");
                                s.color = fontColor;
                                // measure the size
                                s.position = "absolute";
                                s.left = "-10000px";
                                win.body().appendChild(p);
                                var size = g.normalizedLength(g.splitFontString(font).size);

                                // do we need to calculate the label width?
                                if(!labelWidth){
                                        boxWidth = getBoxWidth(p);
                                }
                                // when the textDir is rtl, but the UI ltr needs
                                // to recalculate the starting point
                                if(p.dir == "rtl"){
                                        x += labelWidth ? labelWidth : boxWidth;
                                }

                                // new settings for the text node
                                win.body().removeChild(p);

                                s.position = "relative";
                                if(labelWidth){
                                        s.width = labelWidth + "px";
                                        // s.border = "1px dotted grey";
                                        switch(align){
                                                case "middle":
                                                        s.textAlign = "center";
                                                        s.left = (x - labelWidth / 2) + "px";
                                                        break;
                                                case "end":
                                                        s.textAlign = "right";
                                                        s.left = (x - labelWidth) + "px";
                                                        break;
                                                default:
                                                        s.left = x + "px";
                                                        s.textAlign = "left";
                                                        break;
                                        }
                                }else{
                                        switch(align){
                                                case "middle":
                                                        s.left = Math.floor(x - boxWidth / 2) + "px";
                                                        // s.left = Math.floor(x - p.offsetWidth / 2) + "px";
                                                        break;
                                                case "end":
                                                        s.left = Math.floor(x - boxWidth) + "px";
                                                        // s.left = Math.floor(x - p.offsetWidth) + "px";
                                                        break;
                                                //case "start":
                                                default:
                                                        s.left = Math.floor(x) + "px";
                                                        break;
                                        }
                                }
                                s.top = Math.floor(y - size) + "px";
                                s.whiteSpace = "nowrap";        // hack for WebKit
                                // setup the wrapper node
                                var wrap = win.doc.createElement("div"), w = wrap.style;
                                clearNode(w);
                                w.width = "0px";
                                w.height = "0px";
                                // insert nodes
                                wrap.appendChild(p);
                                chart.node.insertBefore(wrap, chart.node.firstChild);
                                if(has("dojo-bidi")){
                                        chart.htmlElementsRegistry.push([wrap, x, y, align, text, font, fontColor]);
                                }
                                return wrap;    //      DOMNode
                        }
                }
        });
});