Proyectos de Subversion Moodle

YUI.add('graphics-svg', function (Y, NAME) {

var IMPLEMENTATION = "svg",

    SHAPE = "shape",

	SPLITPATHPATTERN = /[a-z][^a-z]*/ig,

    SPLITARGSPATTERN = /[\-]?[0-9]*[0-9|\.][0-9]*/g,

    Y_LANG = Y.Lang,

	AttributeLite = Y.AttributeLite,

	SVGGraphic,

    SVGShape,

	SVGCircle,

	SVGRect,

	SVGPath,

	SVGEllipse,

    SVGPieSlice,

    DOCUMENT = Y.config.doc,

    _getClassName = Y.ClassNameManager.getClassName;

function SVGDrawing(){}

/**

 * <a href="http://www.w3.org/TR/SVG/">SVG</a> implementation of the <a href="Drawing.html">`Drawing`</a> class.

 * `SVGDrawing` is not intended to be used directly. Instead, use the <a href="Drawing.html">`Drawing`</a> class.

 * If the browser has <a href="http://www.w3.org/TR/SVG/">SVG</a> capabilities, the <a href="Drawing.html">`Drawing`</a>

 * class will point to the `SVGDrawing` class.

 *

 * @module graphics

 * @class SVGDrawing

 * @constructor

 */

SVGDrawing.prototype = {

    /**

     * Rounds a value to the nearest hundredth.

     *

     * @method _round

     * @param {Number} val Value to be rounded.

     * @return Number

     * @private

     */

    _round: function(val) {

        return Math.round(val * 100)/100;

    },

    /**

     * Maps path to methods

     *

     * @property _pathSymbolToMethod

     * @type Object

     * @private

     */

    _pathSymbolToMethod: {

        M: "moveTo",

        m: "relativeMoveTo",

        L: "lineTo",

        l: "relativeLineTo",

        C: "curveTo",

        c: "relativeCurveTo",

        Q: "quadraticCurveTo",

        q: "relativeQuadraticCurveTo",

        z: "closePath",

        Z: "closePath"

    },

    /**

     * Current x position of the drawing.

     *

     * @property _currentX

     * @type Number

     * @private

     */

    _currentX: 0,

    /**

     * Current y position of the drqwing.

     *

     * @property _currentY

     * @type Number

     * @private

     */

    _currentY: 0,

    /**

     * Indicates the type of shape

     *

     * @private

     * @property _type

     * @readOnly

     * @type String

     */

    _type: "path",

    /**

     * Draws a bezier curve.

     *

     * @method curveTo

     * @param {Number} cp1x x-coordinate for the first control point.

     * @param {Number} cp1y y-coordinate for the first control point.

     * @param {Number} cp2x x-coordinate for the second control point.

     * @param {Number} cp2y y-coordinate for the second control point.

     * @param {Number} x x-coordinate for the end point.

     * @param {Number} y y-coordinate for the end point.

     * @chainable

     */

    curveTo: function() {

        this._curveTo.apply(this, [Y.Array(arguments), false]);

        return this;

    },

    /**

     * Draws a bezier curve relative to the current coordinates.

     *

     * @method relativeCurveTo

     * @param {Number} cp1x x-coordinate for the first control point.

     * @param {Number} cp1y y-coordinate for the first control point.

     * @param {Number} cp2x x-coordinate for the second control point.

     * @param {Number} cp2y y-coordinate for the second control point.

     * @param {Number} x x-coordinate for the end point.

     * @param {Number} y y-coordinate for the end point.

     * @chainable

     */

    relativeCurveTo: function() {

        this._curveTo.apply(this, [Y.Array(arguments), true]);

        return this;

    },

    /**

     * Implements curveTo methods.

     *

     * @method _curveTo

     * @param {Array} args The arguments to be used.

     * @param {Boolean} relative Indicates whether or not to use relative coordinates.

     * @private

     */

    _curveTo: function(args, relative) {

        var w,

            h,

            pts,

            cp1x,

            cp1y,

            cp2x,

            cp2y,

            x,

            y,

            right,

            left,

            bottom,

            top,

            i,

            len,

            pathArrayLen,

            currentArray,

            command = relative ? "c" : "C",

            relativeX = relative ? parseFloat(this._currentX) : 0,

            relativeY = relative ? parseFloat(this._currentY) : 0;

        this._pathArray = this._pathArray || [];

        if(this._pathType !== command)

        {

            this._pathType = command;

            currentArray = [command];

            this._pathArray.push(currentArray);

        }

        else

        {

            currentArray = this._pathArray[Math.max(0, this._pathArray.length - 1)];

            if(!currentArray)

            {

                currentArray = [];

                this._pathArray.push(currentArray);

            }

        }

        pathArrayLen = this._pathArray.length - 1;

        this._pathArray[pathArrayLen] = this._pathArray[pathArrayLen].concat(args);

        len = args.length - 5;

        for(i = 0; i < len; i = i + 6)

        {

            cp1x = parseFloat(args[i]) + relativeX;

            cp1y = parseFloat(args[i + 1]) + relativeY;

            cp2x = parseFloat(args[i + 2]) + relativeX;

            cp2y = parseFloat(args[i + 3]) + relativeY;

            x = parseFloat(args[i + 4]) + relativeX;

            y = parseFloat(args[i + 5]) + relativeY;

            right = Math.max(x, Math.max(cp1x, cp2x));

            bottom = Math.max(y, Math.max(cp1y, cp2y));

            left = Math.min(x, Math.min(cp1x, cp2x));

            top = Math.min(y, Math.min(cp1y, cp2y));

            w = Math.abs(right - left);

            h = Math.abs(bottom - top);

            pts = [[this._currentX, this._currentY] , [cp1x, cp1y], [cp2x, cp2y], [x, y]];

            this._setCurveBoundingBox(pts, w, h);

            this._currentX = x;

            this._currentY = y;

        }

    },

    /**

     * Draws a quadratic bezier curve.

     *

     * @method quadraticCurveTo

     * @param {Number} cpx x-coordinate for the control point.

     * @param {Number} cpy y-coordinate for the control point.

     * @param {Number} x x-coordinate for the end point.

     * @param {Number} y y-coordinate for the end point.

     * @chainable

     */

    quadraticCurveTo: function() {

        this._quadraticCurveTo.apply(this, [Y.Array(arguments), false]);

        return this;

    },

    /**

     * Draws a quadratic bezier curve relative to the current position.

     *

     * @method quadraticCurveTo

     * @param {Number} cpx x-coordinate for the control point.

     * @param {Number} cpy y-coordinate for the control point.

     * @param {Number} x x-coordinate for the end point.

     * @param {Number} y y-coordinate for the end point.

     * @chainable

     */

    relativeQuadraticCurveTo: function() {

        this._quadraticCurveTo.apply(this, [Y.Array(arguments), true]);

        return this;

    },

    /**

     * Implements quadraticCurveTo methods.

     *

     * @method _quadraticCurveTo

     * @param {Array} args The arguments to be used.

     * @param {Boolean} relative Indicates whether or not to use relative coordinates.

     * @private

     */

    _quadraticCurveTo: function(args, relative) {

        var cpx,

            cpy,

            x,

            y,

            pathArrayLen,

            currentArray,

            w,

            h,

            pts,

            right,

            left,

            bottom,

            top,

            i,

            len,

            command = relative ? "q" : "Q",

            relativeX = relative ? parseFloat(this._currentX) : 0,

            relativeY = relative ? parseFloat(this._currentY) : 0;

        this._pathArray = this._pathArray || [];

        if(this._pathType !== command)

        {

            this._pathType = command;

            currentArray = [command];

            this._pathArray.push(currentArray);

        }

        else

        {

            currentArray = this._pathArray[Math.max(0, this._pathArray.length - 1)];

            if(!currentArray)

            {

                currentArray = [];

                this._pathArray.push(currentArray);

            }

        }

        pathArrayLen = this._pathArray.length - 1;

        this._pathArray[pathArrayLen] = this._pathArray[pathArrayLen].concat(args);

        len = args.length - 3;

        for(i = 0; i < len; i = i + 4)

        {

            cpx = parseFloat(args[i]) + relativeX;

            cpy = parseFloat(args[i + 1]) + relativeY;

            x = parseFloat(args[i + 2]) + relativeX;

            y = parseFloat(args[i + 3]) + relativeY;

            right = Math.max(x, cpx);

            bottom = Math.max(y, cpy);

            left = Math.min(x, cpx);

            top = Math.min(y, cpy);

            w = Math.abs(right - left);

            h = Math.abs(bottom - top);

            pts = [[this._currentX, this._currentY] , [cpx, cpy], [x, y]];

            this._setCurveBoundingBox(pts, w, h);

            this._currentX = x;

            this._currentY = y;

        }

    },

    /**

     * Draws a rectangle.

     *

     * @method drawRect

     * @param {Number} x x-coordinate

     * @param {Number} y y-coordinate

     * @param {Number} w width

     * @param {Number} h height

     * @chainable

     */

    drawRect: function(x, y, w, h) {

        this.moveTo(x, y);

        this.lineTo(x + w, y);

        this.lineTo(x + w, y + h);

        this.lineTo(x, y + h);

        this.lineTo(x, y);

        return this;

    },

    /**

     * Draws a rectangle with rounded corners.

     *

     * @method drawRoundRect

     * @param {Number} x x-coordinate

     * @param {Number} y y-coordinate

     * @param {Number} w width

     * @param {Number} h height

     * @param {Number} ew width of the ellipse used to draw the rounded corners

     * @param {Number} eh height of the ellipse used to draw the rounded corners

     * @chainable

     */

    drawRoundRect: function(x, y, w, h, ew, eh) {

        this.moveTo(x, y + eh);

        this.lineTo(x, y + h - eh);

        this.quadraticCurveTo(x, y + h, x + ew, y + h);

        this.lineTo(x + w - ew, y + h);

        this.quadraticCurveTo(x + w, y + h, x + w, y + h - eh);

        this.lineTo(x + w, y + eh);

        this.quadraticCurveTo(x + w, y, x + w - ew, y);

        this.lineTo(x + ew, y);

        this.quadraticCurveTo(x, y, x, y + eh);

        return this;

	},

    /**

     * Draws a circle.

     *

     * @method drawCircle

     * @param {Number} x y-coordinate

     * @param {Number} y x-coordinate

     * @param {Number} r radius

     * @chainable

     * @protected

     */

	drawCircle: function(x, y, radius) {

        var circum = radius * 2;

        this._drawingComplete = false;

        this._trackSize(x, y);

        this._trackSize(x + circum, y + circum);

        this._pathArray = this._pathArray || [];

        this._pathArray.push(["M", x + radius, y]);

        this._pathArray.push(["A",  radius, radius, 0, 1, 0, x + radius, y + circum]);

        this._pathArray.push(["A",  radius, radius, 0, 1, 0, x + radius, y]);

        this._currentX = x;

        this._currentY = y;

        return this;

    },

    /**

     * Draws an ellipse.

     *

     * @method drawEllipse

     * @param {Number} x x-coordinate

     * @param {Number} y y-coordinate

     * @param {Number} w width

     * @param {Number} h height

     * @chainable

     * @protected

     */

	drawEllipse: function(x, y, w, h) {

        var radius = w * 0.5,

            yRadius = h * 0.5;

        this._drawingComplete = false;

        this._trackSize(x, y);

        this._trackSize(x + w, y + h);

        this._pathArray = this._pathArray || [];

        this._pathArray.push(["M", x + radius, y]);

        this._pathArray.push(["A",  radius, yRadius, 0, 1, 0, x + radius, y + h]);

        this._pathArray.push(["A",  radius, yRadius, 0, 1, 0, x + radius, y]);

        this._currentX = x;

        this._currentY = y;

        return this;

    },

    /**

     * Draws a diamond.

     *

     * @method drawDiamond

     * @param {Number} x y-coordinate

     * @param {Number} y x-coordinate

     * @param {Number} width width

     * @param {Number} height height

     * @chainable

     * @protected

     */

    drawDiamond: function(x, y, width, height)

    {

        var midWidth = width * 0.5,

            midHeight = height * 0.5;

        this.moveTo(x + midWidth, y);

        this.lineTo(x + width, y + midHeight);

        this.lineTo(x + midWidth, y + height);

        this.lineTo(x, y + midHeight);

        this.lineTo(x + midWidth, y);

        return this;

    },

    /**

     * Draws a wedge.

     *

     * @method drawWedge

     * @param {Number} x x-coordinate of the wedge's center point

     * @param {Number} y y-coordinate of the wedge's center point

     * @param {Number} startAngle starting angle in degrees

     * @param {Number} arc sweep of the wedge. Negative values draw clockwise.

     * @param {Number} radius radius of wedge. If [optional] yRadius is defined, then radius is the x radius.

     * @param {Number} yRadius [optional] y radius for wedge.

     * @chainable

     * @private

     */

    drawWedge: function(x, y, startAngle, arc, radius, yRadius)

    {

        var segs,

            segAngle,

            theta,

            angle,

            angleMid,

            ax,

            ay,

            bx,

            by,

            cx,

            cy,

            i,

            diameter = radius * 2,

            currentArray,

            pathArrayLen;

        this._pathArray = this._pathArray || [];

        yRadius = yRadius || radius;

        if(this._pathType !== "M")

        {

            this._pathType = "M";

            currentArray = ["M"];

            this._pathArray.push(currentArray);

        }

        else

        {

            currentArray = this._getCurrentArray();

        }

        pathArrayLen = this._pathArray.length - 1;

        this._pathArray[pathArrayLen].push(x);

        this._pathArray[pathArrayLen].push(x);

        // limit sweep to reasonable numbers

        if(Math.abs(arc) > 360)

        {

            arc = 360;

        }

        // First we calculate how many segments are needed

        // for a smooth arc.

        segs = Math.ceil(Math.abs(arc) / 45);

        // Now calculate the sweep of each segment.

        segAngle = arc / segs;

        // The math requires radians rather than degrees. To convert from degrees

        // use the formula (degrees/180)*Math.PI to get radians.

        theta = -(segAngle / 180) * Math.PI;

        // convert angle startAngle to radians

        angle = (startAngle / 180) * Math.PI;

        if(segs > 0)

        {

            // draw a line from the center to the start of the curve

            ax = x + Math.cos(startAngle / 180 * Math.PI) * radius;

            ay = y + Math.sin(startAngle / 180 * Math.PI) * yRadius;

            this._pathType = "L";

            pathArrayLen++;

            this._pathArray[pathArrayLen] = ["L"];

            this._pathArray[pathArrayLen].push(this._round(ax));

            this._pathArray[pathArrayLen].push(this._round(ay));

            pathArrayLen++;

            this._pathType = "Q";

            this._pathArray[pathArrayLen] = ["Q"];

            for(i = 0; i < segs; ++i)

            {

                angle += theta;

                angleMid = angle - (theta / 2);

                bx = x + Math.cos(angle) * radius;

                by = y + Math.sin(angle) * yRadius;

                cx = x + Math.cos(angleMid) * (radius / Math.cos(theta / 2));

                cy = y + Math.sin(angleMid) * (yRadius / Math.cos(theta / 2));

                this._pathArray[pathArrayLen].push(this._round(cx));

                this._pathArray[pathArrayLen].push(this._round(cy));

                this._pathArray[pathArrayLen].push(this._round(bx));

                this._pathArray[pathArrayLen].push(this._round(by));

            }

        }

        this._currentX = x;

        this._currentY = y;

        this._trackSize(diameter, diameter);

        return this;

    },

    /**

     * Draws a line segment using the current line style from the current drawing position to the specified x and y coordinates.

     *

     * @method lineTo

     * @param {Number} point1 x-coordinate for the end point.

     * @param {Number} point2 y-coordinate for the end point.

     * @chainable

     */

    lineTo: function()

    {

        this._lineTo.apply(this, [Y.Array(arguments), false]);

        return this;

    },

    /**

     * Draws a line segment using the current line style from the current drawing position to the relative x and y coordinates.

     *

     * @method relativeLineTo

     * @param {Number} point1 x-coordinate for the end point.

     * @param {Number} point2 y-coordinate for the end point.

     * @chainable

     */

    relativeLineTo: function()

    {

        this._lineTo.apply(this, [Y.Array(arguments), true]);

        return this;

    },

    /**

     * Implements lineTo methods.

     *

     * @method _lineTo

     * @param {Array} args The arguments to be used.

     * @param {Boolean} relative Indicates whether or not to use relative coordinates.

     * @private

     */

    _lineTo: function(args, relative) {

        var point1 = args[0],

            i,

            len,

            pathArrayLen,

            currentArray,

            x,

            y,

            command = relative ? "l" : "L",

            relativeX = relative ? parseFloat(this._currentX) : 0,

            relativeY = relative ? parseFloat(this._currentY) : 0;

        this._pathArray = this._pathArray || [];

        this._shapeType = "path";

        len = args.length;

        if(this._pathType !== command)

        {

            this._pathType = command;

            currentArray = [command];

            this._pathArray.push(currentArray);

        }

        else

        {

            currentArray = this._getCurrentArray();

        }

        pathArrayLen = this._pathArray.length - 1;

        if (typeof point1 === 'string' || typeof point1 === 'number') {

            for (i = 0; i < len; i = i + 2) {

                x = parseFloat(args[i]);

                y = parseFloat(args[i + 1]);

                this._pathArray[pathArrayLen].push(x);

                this._pathArray[pathArrayLen].push(y);

                x = x + relativeX;

                y = y + relativeY;

                this._currentX = x;

                this._currentY = y;

                this._trackSize.apply(this, [x, y]);

            }

        }

        else

        {

            for (i = 0; i < len; ++i) {

                x = parseFloat(args[i][0]);

                y = parseFloat(args[i][1]);

                this._pathArray[pathArrayLen].push(x);

                this._pathArray[pathArrayLen].push(y);

                this._currentX = x;

                this._currentY = y;

                x = x + relativeX;

                y = y + relativeY;

                this._trackSize.apply(this, [x, y]);

            }

        }

    },

    /**

     * Moves the current drawing position to specified x and y coordinates.

     *

     * @method moveTo

     * @param {Number} x x-coordinate for the end point.

     * @param {Number} y y-coordinate for the end point.

     * @chainable

     */

    moveTo: function()

    {

        this._moveTo.apply(this, [Y.Array(arguments), false]);

        return this;

    },

    /**

     * Moves the current drawing position relative to specified x and y coordinates.

     *

     * @method relativeMoveTo

     * @param {Number} x x-coordinate for the end point.

     * @param {Number} y y-coordinate for the end point.

     * @chainable

     */

    relativeMoveTo: function()

    {

        this._moveTo.apply(this, [Y.Array(arguments), true]);

        return this;

    },

    /**

     * Implements moveTo methods.

     *

     * @method _moveTo

     * @param {Array} args The arguments to be used.

     * @param {Boolean} relative Indicates whether or not to use relative coordinates.

     * @private

     */

    _moveTo: function(args, relative) {

        var pathArrayLen,

            currentArray,

            x = parseFloat(args[0]),

            y = parseFloat(args[1]),

            command = relative ? "m" : "M",

            relativeX = relative ? parseFloat(this._currentX) : 0,

            relativeY = relative ? parseFloat(this._currentY) : 0;

        this._pathArray = this._pathArray || [];

        this._pathType = command;

        currentArray = [command];

        this._pathArray.push(currentArray);

        pathArrayLen = this._pathArray.length - 1;

        this._pathArray[pathArrayLen] = this._pathArray[pathArrayLen].concat([x, y]);

        x = x + relativeX;

        y = y + relativeY;

        this._currentX = x;

        this._currentY = y;

        this._trackSize(x, y);

    },

    /**

     * Completes a drawing operation.

     *

     * @method end

     * @chainable

     */

    end: function()

    {

        this._closePath();

        return this;

    },

    /**

     * Clears the path.

     *

     * @method clear

     * @chainable

     */

    clear: function()

    {

        this._currentX = 0;

        this._currentY = 0;

        this._width = 0;

        this._height = 0;

        this._left = 0;

        this._right = 0;

        this._top = 0;

        this._bottom = 0;

        this._pathArray = [];

        this._path = "";

        this._pathType = "";

        return this;

    },

    /**

     * Draws the path.

     *

     * @method _closePath

     * @private

     */

    _closePath: function()

    {

        var pathArray,

            segmentArray,

            pathType,

            len,

            val,

            i,

            path = "",

            node = this.node,

            left = parseFloat(this._left),

            top = parseFloat(this._top),

            fill = this.get("fill");

        if(this._pathArray)

        {

            pathArray = this._pathArray.concat();

            while(pathArray && pathArray.length > 0)

            {

                segmentArray = pathArray.shift();

                len = segmentArray.length;

                pathType = segmentArray[0];

                if(pathType === "A")

                {

                    path += pathType + segmentArray[1] + "," + segmentArray[2];

                }

                else if(pathType === "z" || pathType === "Z")

                {

                    path += " z ";

                }

                else if(pathType === "C" || pathType === "c")

                {

                    path += pathType + (segmentArray[1] - left)+ "," + (segmentArray[2] - top);

                }

                else

                {

                    path += " " + pathType + parseFloat(segmentArray[1] - left);

                }

                switch(pathType)

                {

                    case "L" :

                    case "l" :

                    case "M" :

                    case "m" :

                    case "Q" :

                    case "q" :

                        for(i = 2; i < len; ++i)

                        {

                            val = (i % 2 === 0) ? top : left;

                            val = segmentArray[i] - val;

                            path += ", " + parseFloat(val);

                        }

                    break;

                    case "A" :

                        val = " " + parseFloat(segmentArray[3]) + " " + parseFloat(segmentArray[4]);

                        val += "," + parseFloat(segmentArray[5]) + " " + parseFloat(segmentArray[6] - left);

                        val += "," + parseFloat(segmentArray[7] - top);

                        path += " " + val;

                    break;

                    case "C" :

                    case "c" :

                        for(i = 3; i < len - 1; i = i + 2)

                        {

                            val = parseFloat(segmentArray[i] - left);

                            val = val + ", ";

                            val = val + parseFloat(segmentArray[i + 1] - top);

                            path += " " + val;

                        }

                    break;

                }

            }

            if(fill && fill.color)

            {

                path += 'z';

            }

            Y.Lang.trim(path);

            if(path)

            {

                node.setAttribute("d", path);

            }

            this._path = path;

            this._fillChangeHandler();

            this._strokeChangeHandler();

            this._updateTransform();

        }

    },

    /**

     * Ends a fill and stroke

     *

     * @method closePath

     * @chainable

     */

    closePath: function()

    {

        this._pathArray.push(["z"]);

        return this;

    },

    /**

     * Returns the current array of drawing commands.

     *

     * @method _getCurrentArray

     * @return Array

     * @private

     */

    _getCurrentArray: function()

    {

        var currentArray = this._pathArray[Math.max(0, this._pathArray.length - 1)];

        if(!currentArray)

        {

            currentArray = [];

            this._pathArray.push(currentArray);

        }

        return currentArray;

    },

    /**

     * Returns the points on a curve

     *

     * @method getBezierData

     * @param Array points Array containing the begin, end and control points of a curve.

     * @param Number t The value for incrementing the next set of points.

     * @return Array

     * @private

     */

    getBezierData: function(points, t) {

        var n = points.length,

            tmp = [],

            i,

            j;

        for (i = 0; i < n; ++i){

            tmp[i] = [points[i][0], points[i][1]]; // save input

        }

        for (j = 1; j < n; ++j) {

            for (i = 0; i < n - j; ++i) {

                tmp[i][0] = (1 - t) * tmp[i][0] + t * tmp[parseInt(i + 1, 10)][0];

                tmp[i][1] = (1 - t) * tmp[i][1] + t * tmp[parseInt(i + 1, 10)][1];

            }

        }

        return [ tmp[0][0], tmp[0][1] ];

    },

    /**

     * Calculates the bounding box for a curve

     *

     * @method _setCurveBoundingBox

     * @param Array pts Array containing points for start, end and control points of a curve.

     * @param Number w Width used to calculate the number of points to describe the curve.

     * @param Number h Height used to calculate the number of points to describe the curve.

     * @private

     */

    _setCurveBoundingBox: function(pts, w, h)

    {

        var i,

            left = this._currentX,

            right = left,

            top = this._currentY,

            bottom = top,

            len = Math.round(Math.sqrt((w * w) + (h * h))),

            t = 1/len,

            xy;

        for(i = 0; i < len; ++i)

        {

            xy = this.getBezierData(pts, t * i);

            left = isNaN(left) ? xy[0] : Math.min(xy[0], left);

            right = isNaN(right) ? xy[0] : Math.max(xy[0], right);

            top = isNaN(top) ? xy[1] : Math.min(xy[1], top);

            bottom = isNaN(bottom) ? xy[1] : Math.max(xy[1], bottom);

        }

        left = Math.round(left * 10)/10;

        right = Math.round(right * 10)/10;

        top = Math.round(top * 10)/10;

        bottom = Math.round(bottom * 10)/10;

        this._trackSize(right, bottom);

        this._trackSize(left, top);

    },

    /**

     * Updates the size of the graphics object

     *

     * @method _trackSize

     * @param {Number} w width

     * @param {Number} h height

     * @private

     */

    _trackSize: function(w, h) {

        if (w > this._right) {

            this._right = w;

        }

        if(w < this._left)

        {

            this._left = w;

        }

        if (h < this._top)

        {

            this._top = h;

        }

        if (h > this._bottom)

        {

            this._bottom = h;

        }

        this._width = this._right - this._left;

        this._height = this._bottom - this._top;

    }

};

Y.SVGDrawing = SVGDrawing;

/**

 * <a href="http://www.w3.org/TR/SVG/">SVG</a> implementation of the <a href="Shape.html">`Shape`</a> class.

 * `SVGShape` is not intended to be used directly. Instead, use the <a href="Shape.html">`Shape`</a> class.

 * If the browser has <a href="http://www.w3.org/TR/SVG/">SVG</a> capabilities, the <a href="Shape.html">`Shape`</a>

 * class will point to the `SVGShape` class.

 *

 * @module graphics

 * @class SVGShape

 * @constructor

 * @param {Object} cfg (optional) Attribute configs

 */

SVGShape = function()

{

    this._transforms = [];

    this.matrix = new Y.Matrix();

    this._normalizedMatrix = new Y.Matrix();

    SVGShape.superclass.constructor.apply(this, arguments);

};

SVGShape.NAME = "shape";

Y.extend(SVGShape, Y.GraphicBase, Y.mix({

    /**

     * Storage for x attribute.

     *

     * @property _x

     * @protected

     */

    _x: 0,

    /**

     * Storage for y attribute.

     *

     * @property _y

     * @protected

     */

    _y: 0,

    /**

     * Init method, invoked during construction.

     * Calls `initializer` method.

     *

     * @method init

     * @protected

     */

	init: function()

	{

		this.initializer.apply(this, arguments);

	},

	/**

	 * Initializes the shape

	 *

	 * @private

	 * @method initializer

	 */

	initializer: function(cfg)

	{

		var host = this,

            graphic = cfg.graphic,

            data = this.get("data");

		host.createNode();

		if(graphic)

        {

            host._setGraphic(graphic);

        }

        if(data)

        {

            host._parsePathData(data);

        }

        host._updateHandler();

	},

    /**

     * Set the Graphic instance for the shape.

     *

     * @method _setGraphic

     * @param {Graphic | Node | HTMLElement | String} render This param is used to determine the graphic instance. If it is a

     * `Graphic` instance, it will be assigned to the `graphic` attribute. Otherwise, a new Graphic instance will be created

     * and rendered into the dom element that the render represents.

     * @private

     */

    _setGraphic: function(render)

    {

        var graphic;

        if(render instanceof Y.SVGGraphic)

        {

            this._graphic = render;

        }

        else

        {

            graphic = new Y.SVGGraphic({

                render: render