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

var IMPLEMENTATION = "canvas",

    SHAPE = "shape",

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

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

    DOCUMENT = Y.config.doc,

    Y_LANG = Y.Lang,

    AttributeLite = Y.AttributeLite,

	CanvasShape,

	CanvasPath,

	CanvasRect,

    CanvasEllipse,

	CanvasCircle,

    CanvasPieSlice,

    Y_DOM = Y.DOM,

    Y_Color = Y.Color,

    PARSE_INT = parseInt,

    PARSE_FLOAT = parseFloat,

    IS_NUMBER = Y_LANG.isNumber,

    RE = RegExp,

    TORGB = Y_Color.toRGB,

    TOHEX = Y_Color.toHex,

    _getClassName = Y.ClassNameManager.getClassName;

/**

 * <a href="http://www.w3.org/TR/html5/the-canvas-element.html">Canvas</a> implementation of the <a href="Drawing.html">`Drawing`</a> class.

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

 * If the browser lacks <a href="http://www.w3.org/TR/SVG/">SVG</a> capabilities but has

 * <a href="http://www.w3.org/TR/html5/the-canvas-element.html">Canvas</a> capabilities, the <a href="Drawing.html">`Drawing`</a>

 * class will point to the `CanvasDrawing` class.

 *

 * @module graphics

 * @class CanvasDrawing

 * @constructor

 */

function CanvasDrawing()

{

}

CanvasDrawing.prototype = {

    /**

     * 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,

    /**

     * Parses hex color string and alpha value to rgba

     *

     * @method _toRGBA

     * @param {Object} val Color value to parse. Can be hex string, rgb or name.

     * @param {Number} alpha Numeric value between 0 and 1 representing the alpha level.

     * @private

     */

    _toRGBA: function(val, alpha) {

        alpha = (alpha !== undefined) ? alpha : 1;

        if (!Y_Color.re_RGB.test(val)) {

            val = TOHEX(val);

        }

        if(Y_Color.re_hex.exec(val)) {

            val = 'rgba(' + [

                PARSE_INT(RE.$1, 16),

                PARSE_INT(RE.$2, 16),

                PARSE_INT(RE.$3, 16)

            ].join(',') + ',' + alpha + ')';

        }

        return val;

    },

    /**

     * Converts color to rgb format

     *

     * @method _toRGB

     * @param val Color value to convert.

     * @private

     */

    _toRGB: function(val) {

        return TORGB(val);

    },

    /**

     * Sets the size of the graphics object.

     *

     * @method setSize

     * @param w {Number} width to set for the instance.

     * @param h {Number} height to set for the instance.

     * @private

     */

	setSize: function(w, h) {

        if(this.get("autoSize"))

        {

            if(w > this.node.getAttribute("width"))

            {

                this.node.style.width = w + "px";

                this.node.setAttribute("width", w);

            }

            if(h > this.node.getAttribute("height"))

            {

                this.node.style.height = h + "px";

                this.node.setAttribute("height", h);

            }

        }

    },

	/**

     * Tracks coordinates. Used to calculate the start point of dashed lines.

     *

     * @method _updateCoords

     * @param {Number} x x-coordinate

     * @param {Number} y y-coordinate

	 * @private

	 */

    _updateCoords: function(x, y)

    {

        this._xcoords.push(x);

        this._ycoords.push(y);

        this._currentX = x;

        this._currentY = y;

    },

	/**

     * Clears the coordinate arrays. Called at the end of a drawing operation.

	 *

     * @method _clearAndUpdateCoords

     * @private

	 */

    _clearAndUpdateCoords: function()

    {

        var x = this._xcoords.pop() || 0,

            y = this._ycoords.pop() || 0;

        this._updateCoords(x, y);

    },

	/**

     * Moves the shape's dom node.

     *

     * @method _updateNodePosition

	 * @private

	 */

    _updateNodePosition: function()

    {

        var node = this.get("node"),

            x = this.get("x"),

            y = this.get("y");

        node.style.position = "absolute";

        node.style.left = (x + this._left) + "px";

        node.style.top = (y + this._top) + "px";

    },

    /**

     * Queues up a method to be executed when a shape redraws.

     *

     * @method _updateDrawingQueue

     * @param {Array} val An array containing data that can be parsed into a method and arguments. The value at zero-index

     * of the array is a string reference of the drawing method that will be called. All subsequent indices are argument for

     * that method. For example, `lineTo(10, 100)` would be structured as:

     * `["lineTo", 10, 100]`.

     * @private

     */

    _updateDrawingQueue: function(val)

    {

        this._methods.push(val);

    },

    /**

     * Draws a line segment 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 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,

            x,

            y,

            wt = this._stroke && this._strokeWeight ? this._strokeWeight : 0,

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

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

        if(!this._lineToMethods)

        {

            this._lineToMethods = [];

        }

        len = args.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]);

                x = x + relativeX;

                y = y + relativeY;

                this._updateDrawingQueue(["lineTo", x, y]);

                this._trackSize(x - wt, y - wt);

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

                this._updateCoords(x, y);

            }

        }

        else

        {

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

            {

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

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

                this._updateDrawingQueue(["lineTo", x, y]);

                this._lineToMethods[this._lineToMethods.length] = this._methods[this._methods.length - 1];

                this._trackSize(x - wt, y - wt);

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

                this._updateCoords(x, y);

            }

        }

        this._drawingComplete = false;

        return this;

    },

    /**

     * 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 wt = this._stroke && this._strokeWeight ? this._strokeWeight : 0,

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

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

            x = parseFloat(args[0]) + relativeX,

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

        this._updateDrawingQueue(["moveTo", x, y]);

        this._trackSize(x - wt, y - wt);

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

        this._updateCoords(x, y);

        this._drawingComplete = false;

        return this;

    },

    /**

     * 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,

            cp1x,

            cp1y,

            cp2x,

            cp2y,

            x,

            y,

            pts,

            right,

            left,

            bottom,

            top,

            i,

            len,

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

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

        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;