graphics/js/VMLGraphic.js

	VMLGraphic.js revision a75ebc38c1de401b679953a9b87bd323f0f48d02
011173392d3a1a59092095d5a24857134cb16f93Adam Moore/**
011173392d3a1a59092095d5a24857134cb16f93Adam Moore * <a href="http://www.w3.org/TR/NOTE-VML">VML</a> implementation of the <a href="Graphic.html">`Graphic`</a> class.
011173392d3a1a59092095d5a24857134cb16f93Adam Moore * `VMLGraphic` is not intended to be used directly. Instead, use the <a href="Graphic.html">`Graphic`</a> class.
011173392d3a1a59092095d5a24857134cb16f93Adam Moore * If the browser lacks <a href="http://www.w3.org/TR/SVG/">SVG</a> and <a href="http://www.w3.org/TR/html5/the-canvas-element.html">Canvas</a>
011173392d3a1a59092095d5a24857134cb16f93Adam Moore * capabilities, the <a href="Graphic.html">`Graphic`</a> class will point to the `VMLGraphic` class.
011173392d3a1a59092095d5a24857134cb16f93Adam Moore *
011173392d3a1a59092095d5a24857134cb16f93Adam Moore * @module graphics
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith * @class VMLGraphic
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith * @constructor
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith */
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke SmithVMLGraphic = function() {
011173392d3a1a59092095d5a24857134cb16f93Adam Moore    VMLGraphic.superclass.constructor.apply(this, arguments);
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith};
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke SmithVMLGraphic.NAME = "vmlGraphic";
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke SmithVMLGraphic.ATTRS = {
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith    /**
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith     * Whether or not to render the `Graphic` automatically after to a specified parent node after init. This can be a Node instance or a CSS selector string.
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith     *
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith     * @config render
011173392d3a1a59092095d5a24857134cb16f93Adam Moore     * @type Node | String
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith     */
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith    render: {},
011173392d3a1a59092095d5a24857134cb16f93Adam Moore
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith    /**
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith     * Unique id for class instance.
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith     *
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith     * @config id
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith     * @type String
011173392d3a1a59092095d5a24857134cb16f93Adam Moore     */
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith    id: {
011173392d3a1a59092095d5a24857134cb16f93Adam Moore        valueFn: function()
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith        {
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith            return Y.guid();
011173392d3a1a59092095d5a24857134cb16f93Adam Moore        },
011173392d3a1a59092095d5a24857134cb16f93Adam Moore
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith        setter: function(val)
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith        {
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith            var node = this._node;
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith            if(node)
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith            {
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith                node.setAttribute("id", val);
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith            }
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith            return val;
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith        }
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith    },
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith    /**
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith     * Key value pairs in which a shape instance is associated with its id.
011173392d3a1a59092095d5a24857134cb16f93Adam Moore     *
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith     *  @config shapes
011173392d3a1a59092095d5a24857134cb16f93Adam Moore     *  @type Object
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith     *  @readOnly
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith     */
011173392d3a1a59092095d5a24857134cb16f93Adam Moore    shapes: {
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith        readOnly: true,
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith        getter: function()
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith        {
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith            return this._shapes;
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith        }
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith    },
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith    /**
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith     *  Object containing size and coordinate data for the content of a Graphic in relation to the coordSpace node.
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith     *
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith     *  @config contentBounds
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith     *  @type Object
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith     */
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith    contentBounds: {
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith        readOnly: true,
011173392d3a1a59092095d5a24857134cb16f93Adam Moore
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith        getter: function()
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith        {
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith            return this._contentBounds;
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith        }
772f655fcf57e58b97fa46b6a8d3fc772b83f743Adam Moore    },
772f655fcf57e58b97fa46b6a8d3fc772b83f743Adam Moore
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith    /**
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith     *  The html element that represents to coordinate system of the Graphic instance.
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith     *
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith     *  @config node
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith     *  @type HTMLElement
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith     */
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith    node: {
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith        readOnly: true,
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith        getter: function()
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith        {
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith            return this._node;
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith        }
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith    },
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith    /**
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith     * Indicates the width of the `Graphic`.
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith     *
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith     * @config width
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith     * @type Number
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith     */
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith    width: {
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith        setter: function(val)
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith        {
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith            if(this._node)
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith            {
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith                this._node.style.width = val + "px";
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith            }
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith            return val;
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith        }
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith    },
22efc9d4ee55a01a5ab27b1bd8325e1bfc8e550aAdam Moore
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith    /**
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith     * Indicates the height of the `Graphic`.
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith     *
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith     * @config height
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith     * @type Number
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith     */
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith    height: {
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith        setter: function(val)
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith        {
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith            if(this._node)
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith            {
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith                this._node.style.height = val + "px";
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith            }
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith            return val;
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith        }
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith    },
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith    /**
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith     *  Determines how the size of instance is calculated. If true, the width and height are determined by the size of the contents.
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith     *  If false, the width and height values are either explicitly set or determined by the size of the parent node's dimensions.
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith     *
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith     *  @config autoSize
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith     *  @type Boolean
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith     *  @default false
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith     */
22efc9d4ee55a01a5ab27b1bd8325e1bfc8e550aAdam Moore    autoSize: {
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith        value: false
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith    },
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith    /**
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith     * The contentBounds will resize to greater values but not values. (for performance)
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith     * When resizing the contentBounds down is desirable, set the resizeDown value to true.
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith     *
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith     * @config resizeDown
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith     * @type Boolean
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith     */
011173392d3a1a59092095d5a24857134cb16f93Adam Moore    resizeDown: {
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith        getter: function()
011173392d3a1a59092095d5a24857134cb16f93Adam Moore        {
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith            return this._resizeDown;
011173392d3a1a59092095d5a24857134cb16f93Adam Moore        },
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith        setter: function(val)
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith        {
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith            this._resizeDown = val;
011173392d3a1a59092095d5a24857134cb16f93Adam Moore            this._redraw();
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith            return val;
011173392d3a1a59092095d5a24857134cb16f93Adam Moore        }
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith    },
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith
011173392d3a1a59092095d5a24857134cb16f93Adam Moore    /**
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith     * Indicates the x-coordinate for the instance.
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith     *
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith     * @config x
011173392d3a1a59092095d5a24857134cb16f93Adam Moore     * @type Number
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith     */
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith    x: {
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith        getter: function()
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith        {
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith            return this._x;
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith        },
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith        setter: function(val)
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith        {
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith            this._x = val;
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith            if(this._node)
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith            {
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith                this._node.style.left = val + "px";
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith            }
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith            return val;
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith        }
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith    },
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith    /**
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith     * Indicates the y-coordinate for the instance.
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith     *
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith     * @config y
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith     * @type Number
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith     */
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith    y: {
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith        getter: function()
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith        {
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith            return this._y;
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith        },
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith        setter: function(val)
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith        {
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith            this._y = val;
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith            if(this._node)
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith            {
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith                this._node.style.top = val + "px";
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith            }
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith            return val;
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith        }
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith    },
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith    /**
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith     * Indicates whether or not the instance will automatically redraw after a change is made to a shape.
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith     * This property will get set to false when batching operations.
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith     *
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith     * @config autoDraw
011173392d3a1a59092095d5a24857134cb16f93Adam Moore     * @type Boolean
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith     * @default true
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith     * @private
011173392d3a1a59092095d5a24857134cb16f93Adam Moore     */
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith    autoDraw: {
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith        value: true
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith    },
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith    visible: {
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith        value: true,
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith        setter: function(val)
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith        {
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith            this._toggleVisible(val);
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith            return val;
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith        }
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith    }
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith};
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke SmithY.extend(VMLGraphic, Y.BaseGraphic, {
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith    /**
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith     * Storage for `x` attribute.
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith     *
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith     * @property _x
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith     * @type Number
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith     * @private
011173392d3a1a59092095d5a24857134cb16f93Adam Moore     */
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith    _x: 0,
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith    /**
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith     * Storage for `y` attribute.
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith     *
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith     * @property _y
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith     * @type Number
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith     * @private
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith     */
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith    _y: 0,
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith    /**
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith     * Gets the current position of the graphic instance in page coordinates.
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith     *
c64978b48fe561f13e3d68afc70d7c528946359bAdam Moore     * @method getXY
466e89e60fbad15b099068ee771d408bc06f14c1Adam Moore     * @return Array The XY position of the shape.
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith     */
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith    getXY: function()
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith    {
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith        var node = Y.one(this._node),
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith            xy;
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith        if(node)
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith        {
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith            xy = node.getXY();
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith        }
cfdfb15e991f069dc5a2c3a724d378a6395d4eacLuke Smith        return xy;
772f655fcf57e58b97fa46b6a8d3fc772b83f743Adam Moore    },

    /**
     * @private
     * @property _resizeDown
     * @type Boolean
     */
    _resizeDown: false,

    /**
     * Initializes the class.
     *
     * @method initializer
     * @private
     */
    initializer: function(config) {
        var render = this.get("render");
        this._shapes = {};
        this._contentBounds = {
            left: 0,
            top: 0,
            right: 0,
            bottom: 0
        };
        this._node = this._createGraphic();
        this._node.setAttribute("id", this.get("id"));
        if(render)
        {
            this.render(render);
        }
    },

    /**
     * Adds the graphics node to the dom.
     *
     * @method render
     * @param {HTMLElement} parentNode node in which to render the graphics node into.
     */
    render: function(render) {
        var parentNode = Y.one(render),
            w = this.get("width") || parseInt(parentNode.getComputedStyle("width"), 10),
            h = this.get("height") || parseInt(parentNode.getComputedStyle("height"), 10);
        parentNode = parentNode || DOCUMENT.body;
        parentNode.appendChild(this._node);
        this.setSize(w, h);
        this.parentNode = parentNode;
        this.set("width", w);
        this.set("height", h);
        return this;
    },

    /**
     * Removes all nodes.
     *
     * @method destroy
     */
    destroy: function()
    {
        this.clear();
        this._node.parentNode.removeChild(this._node);
    },

    /**
     * Generates a shape instance by type.
     *
     * @method addShape
     * @param {Object} cfg attributes for the shape
     * @return Shape
     */
    addShape: function(cfg)
    {
        cfg.graphic = this;
        var shapeClass = this._getShapeClass(cfg.type),
            shape = new shapeClass(cfg);
        this._appendShape(shape);
        return shape;
    },

    /**
     * Adds a shape instance to the graphic instance.
     *
     * @method _appendShape
     * @param {Shape} shape The shape instance to be added to the graphic.
     * @private
     */
    _appendShape: function(shape)
    {
        var node = shape.node,
            parentNode = this._frag || this._node;
        if(this.get("autoDraw"))
        {
            parentNode.appendChild(node);
        }
        else
        {
            this._getDocFrag().appendChild(node);
        }
    },

    /**
     * Removes a shape instance from from the graphic instance.
     *
     * @method removeShape
     * @param {Shape|String} shape The instance or id of the shape to be removed.
     */
    removeShape: function(shape)
    {
        if(!shape instanceof VMLShape)
        {
            if(Y_LANG.isString(shape))
            {
                shape = this._shapes[shape];
            }
        }
        if(shape && shape instanceof VMLShape)
        {
            shape.destroy();
            delete this._shapes[shape.get("id")];
        }
        if(this.get("autoDraw"))
        {
            this._redraw();
        }
    },

    /**
     * Removes all shape instances from the dom.
     *
     * @method removeAllShapes
     */
    removeAllShapes: function()
    {
        var shapes = this._shapes,
            i;
        for(i in shapes)
        {
            if(shapes.hasOwnProperty(i))
            {
                shapes[i].destroy();
            }
        }
        this._shapes = {};
    },

    /**
     * Removes all child nodes.
     *
     * @method _removeChildren
     * @param node
     * @private
     */
    _removeChildren: function(node)
    {
        if(node.hasChildNodes())
        {
            var child;
            while(node.firstChild)
            {
                child = node.firstChild;
                this._removeChildren(child);
                node.removeChild(child);
            }
        }
    },

    /**
     * Clears the graphics object.
     *
     * @method clear
     */
    clear: function() {
        this._removeAllShapes();
        this._removeChildren(this._node);
    },

    /**
     * Toggles visibility
     *
     * @method _toggleVisible
     * @param {Boolean} val indicates visibilitye
     * @private
     */
    _toggleVisible: function(val)
    {
        var i,
            shapes = this._shapes,
            visibility = val ? "visible" : "hidden";
        if(shapes)
        {
            for(i in shapes)
            {
                if(shapes.hasOwnProperty(i))
                {
                    shapes[i].set("visible", val);
                }
            }
        }
        this._node.style.visibility = visibility;
    },

    /**
     * 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.
     */
    setSize: function(w, h) {
        w = Math.round(w);
        h = Math.round(h);
        this._node.style.width = w + 'px';
        this._node.style.height = h + 'px';
        this._node.coordSize = w + ' ' + h;
    },

    /**
     * Sets the positon of the graphics object.
     *
     * @method setPosition
     * @param {Number} x x-coordinate for the object.
     * @param {Number} y y-coordinate for the object.
     */
    setPosition: function(x, y)
    {
        x = Math.round(x);
        y = Math.round(y);
        this._node.style.left = x + "px";
        this._node.style.top = y + "px";
    },

    /**
     * Creates a group element
     *
     * @method _createGraphic
     * @private
     */
    _createGraphic: function() {
        var group = DOCUMENT.createElement('<group xmlns="urn:schemas-microsft.com:vml" style="behavior:url(#default#VML);display:block;zoom:1;" />');
        group.style.display = "block";
        group.style.position = 'absolute';
        return group;
    },

    /**
     * Creates a graphic node
     *
     * @method _createGraphicNode
     * @param {String} type node type to create
     * @param {String} pe specified pointer-events value
     * @return HTMLElement
     * @private
     */
    _createGraphicNode: function(type)
    {
        return DOCUMENT.createElement('<' + type + ' xmlns="urn:schemas-microsft.com:vml" style="behavior:url(#default#VML);display:inline-block;zoom:1;" />');

    },

    /**
     * Returns a shape based on the id of its dom node.
     *
     * @method getShapeById
     * @param {String} id Dom id of the shape's node attribute.
     * @return Shape
     */
    getShapeById: function(id)
    {
        return this._shapes[id];
    },

    /**
     * Returns a shape class. Used by `addShape`.
     *
     * @method _getShapeClass
     * @param {Shape | String} val Indicates which shape class.
     * @return Function
     * @private
     */
    _getShapeClass: function(val)
    {
        var shape = this._shapeClass[val];
        if(shape)
        {
            return shape;
        }
        return val;
    },

    /**
     * Look up for shape classes. Used by `addShape` to retrieve a class for instantiation.
     *
     * @property _shapeClass
     * @type Object
     * @private
     */
    _shapeClass: {
        circle: Y.VMLCircle,
        rect: Y.VMLRect,
        path: Y.VMLPath,
        ellipse: Y.VMLEllipse,
        pieslice: Y.VMLPieSlice
    },

    /**
     * Allows for creating multiple shapes in order to batch appending and redraw operations.
     *
     * @method batch
     * @param {Function} method Method to execute.
     */
    batch: function(method)
    {
        var autoDraw = this.get("autoDraw");
        this.set("autoDraw", false);
        method.apply();
        this._redraw();
        this.set("autoDraw", autoDraw);
    },

    /**
     * Returns a document fragment to for attaching shapes.
     *
     * @method _getDocFrag
     * @return DocumentFragment
     * @private
     */
    _getDocFrag: function()
    {
        if(!this._frag)
        {
            this._frag = DOCUMENT.createDocumentFragment();
        }
        return this._frag;
    },

    /**
     * Adds a shape to the redraw queue and calculates the contentBounds.
     *
     * @method addToRedrawQueue
     * @param shape {VMLShape}
     * @protected
     */
    addToRedrawQueue: function(shape)
    {
        var shapeBox,
            box;
        this._shapes[shape.get("id")] = shape;
        if(!this.get("resizeDown"))
        {
            shapeBox = shape.getBounds();
            box = this._contentBounds;
            box.left = box.left < shapeBox.left ? box.left : shapeBox.left;
            box.top = box.top < shapeBox.top ? box.top : shapeBox.top;
            box.right = box.right > shapeBox.right ? box.right : shapeBox.right;
            box.bottom = box.bottom > shapeBox.bottom ? box.bottom : shapeBox.bottom;
            box.width = box.right - box.left;
            box.height = box.bottom - box.top;
            this._contentBounds = box;
        }
        if(this.get("autoDraw"))
        {
            this._redraw();
        }
    },

    /**
     * Redraws all shapes.
     *
     * @method _redraw
     * @private
     */
    _redraw: function()
    {
        var box = this.get("resizeDown") ? this._getUpdatedContentBounds() : this._contentBounds;
        if(this.get("autoSize"))
        {
            this.setSize(box.right, box.bottom);
        }
        if(this._frag)
        {
            this._node.appendChild(this._frag);
            this._frag = null;
        }
    },

    /**
     * Recalculates and returns the `contentBounds` for the `Graphic` instance.
     *
     * @method _getUpdatedContentBounds
     * @return {Object}
     * @private
     */
    _getUpdatedContentBounds: function()
    {
        var bounds,
            i,
            shape,
            queue = this._shapes,
            box = {
                left: 0,
                top: 0,
                right: 0,
                bottom: 0
            };
        for(i in queue)
        {
            if(queue.hasOwnProperty(i))
            {
                shape = queue[i];
                bounds = shape.getBounds();
                box.left = Math.min(box.left, bounds.left);
                box.top = Math.min(box.top, bounds.top);
                box.right = Math.max(box.right, bounds.right);
                box.bottom = Math.max(box.bottom, bounds.bottom);
            }
        }
        box.width = box.right - box.left;
        box.height = box.bottom - box.top;
        this._contentBounds = box;
        return box;
    }
});
Y.VMLGraphic = VMLGraphic;