CanvasGraphic.js revision c09beb6ef319616edc832f6f6d137350d74096e0
0fdefaa9ca017edfb76b736c825b34186f33045aTripp * <a href="http://www.w3.org/TR/html5/the-canvas-element.html">Canvas</a> implementation of the `Graphic` class.
0fdefaa9ca017edfb76b736c825b34186f33045aTripp * `CanvasGraphic` is not intended to be used directly. Instead, use the <a href="Graphic.html">`Graphic`</a> class.
0fdefaa9ca017edfb76b736c825b34186f33045aTripp * If the browser lacks <a href="http://www.w3.org/TR/SVG/">SVG</a> capabilities but has
0fdefaa9ca017edfb76b736c825b34186f33045aTripp * <a href="http://www.w3.org/TR/html5/the-canvas-element.html">Canvas</a> capabilities, the <a href="Graphic.html">`Graphic`</a>
0fdefaa9ca017edfb76b736c825b34186f33045aTripp * class will point to the `CanvasGraphic` class.
a75ebc38c1de401b679953a9b87bd323f0f48d02Tripp * @module graphics
09688ec5ffb8b9cf9883a770e2f9ebd60b28888dTripp * @class CanvasGraphic
09688ec5ffb8b9cf9883a770e2f9ebd60b28888dTripp * @constructor
a89ad754cce3cfc8aee71760e10217b54020360dTripp CanvasGraphic.superclass.constructor.apply(this, arguments);
66ca16dd76367c074fe4df1dcf7b555489a9bf85Tripp * 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.
c093c1aed867e18aa4778708592e1ceb45d18cffTripp * @config render
66ca16dd76367c074fe4df1dcf7b555489a9bf85Tripp * @type Node | String
c7ba96d16d58075a9ab8d5c1e46c6c83ce11cb4eTripp * Unique id for class instance.
c093c1aed867e18aa4778708592e1ceb45d18cffTripp * @config id
c7ba96d16d58075a9ab8d5c1e46c6c83ce11cb4eTripp * @type String
c7ba96d16d58075a9ab8d5c1e46c6c83ce11cb4eTripp valueFn: function()
c7ba96d16d58075a9ab8d5c1e46c6c83ce11cb4eTripp return Y.guid();
a89ad754cce3cfc8aee71760e10217b54020360dTripp * Key value pairs in which a shape instance is associated with its id.
c093c1aed867e18aa4778708592e1ceb45d18cffTripp * @config shapes
a89ad754cce3cfc8aee71760e10217b54020360dTripp * @type Object
a89ad754cce3cfc8aee71760e10217b54020360dTripp * @readOnly
a89ad754cce3cfc8aee71760e10217b54020360dTripp getter: function()
a89ad754cce3cfc8aee71760e10217b54020360dTripp return this._shapes;
c7ba96d16d58075a9ab8d5c1e46c6c83ce11cb4eTripp * Object containing size and coordinate data for the content of a Graphic in relation to the graphic instance's position.
c093c1aed867e18aa4778708592e1ceb45d18cffTripp * @config contentBounds
a89ad754cce3cfc8aee71760e10217b54020360dTripp * @type Object
c7ba96d16d58075a9ab8d5c1e46c6c83ce11cb4eTripp * @readOnly
a89ad754cce3cfc8aee71760e10217b54020360dTripp getter: function()
c7ba96d16d58075a9ab8d5c1e46c6c83ce11cb4eTripp * The outermost html element of the Graphic instance.
c093c1aed867e18aa4778708592e1ceb45d18cffTripp * @config node
a89ad754cce3cfc8aee71760e10217b54020360dTripp * @type HTMLElement
c7ba96d16d58075a9ab8d5c1e46c6c83ce11cb4eTripp * @readOnly
a89ad754cce3cfc8aee71760e10217b54020360dTripp getter: function()
c7ba96d16d58075a9ab8d5c1e46c6c83ce11cb4eTripp return this._node;
66ca16dd76367c074fe4df1dcf7b555489a9bf85Tripp * Indicates the width of the `Graphic`.
c093c1aed867e18aa4778708592e1ceb45d18cffTripp * @config width
66ca16dd76367c074fe4df1dcf7b555489a9bf85Tripp * @type Number
66ca16dd76367c074fe4df1dcf7b555489a9bf85Tripp * Indicates the height of the `Graphic`.
c093c1aed867e18aa4778708592e1ceb45d18cffTripp * @config height
66ca16dd76367c074fe4df1dcf7b555489a9bf85Tripp * @type Number
c7ba96d16d58075a9ab8d5c1e46c6c83ce11cb4eTripp * Determines how the size of instance is calculated. If true, the width and height are determined by the size of the contents.
c7ba96d16d58075a9ab8d5c1e46c6c83ce11cb4eTripp * If false, the width and height values are either explicitly set or determined by the size of the parent node's dimensions.
c093c1aed867e18aa4778708592e1ceb45d18cffTripp * @config autoSize
c7ba96d16d58075a9ab8d5c1e46c6c83ce11cb4eTripp * @type Boolean
c7ba96d16d58075a9ab8d5c1e46c6c83ce11cb4eTripp * @default false
bf801d6851ecf7ed14742ef3639a077daecb5cf8Tripp * The contentBounds will resize to greater values but not smaller values. (for performance)
a4d2446149b07f9e5c32947091dcbcf4d2eee765Tripp * When resizing the contentBounds down is desirable, set the resizeDown value to true.
c093c1aed867e18aa4778708592e1ceb45d18cffTripp * @config resizeDown
c7ba96d16d58075a9ab8d5c1e46c6c83ce11cb4eTripp * @type Boolean
c7ba96d16d58075a9ab8d5c1e46c6c83ce11cb4eTripp getter: function()
c7ba96d16d58075a9ab8d5c1e46c6c83ce11cb4eTripp return this._resizeDown;
c7ba96d16d58075a9ab8d5c1e46c6c83ce11cb4eTripp * Indicates the x-coordinate for the instance.
c093c1aed867e18aa4778708592e1ceb45d18cffTripp * @config x
c7ba96d16d58075a9ab8d5c1e46c6c83ce11cb4eTripp * @type Number
c7ba96d16d58075a9ab8d5c1e46c6c83ce11cb4eTripp getter: function()
c7ba96d16d58075a9ab8d5c1e46c6c83ce11cb4eTripp return this._x;
c7ba96d16d58075a9ab8d5c1e46c6c83ce11cb4eTripp * Indicates the y-coordinate for the instance.
c093c1aed867e18aa4778708592e1ceb45d18cffTripp * @config y
c7ba96d16d58075a9ab8d5c1e46c6c83ce11cb4eTripp * @type Number
c7ba96d16d58075a9ab8d5c1e46c6c83ce11cb4eTripp getter: function()
c7ba96d16d58075a9ab8d5c1e46c6c83ce11cb4eTripp return this._y;
c7ba96d16d58075a9ab8d5c1e46c6c83ce11cb4eTripp * Indicates whether or not the instance will automatically redraw after a change is made to a shape.
c7ba96d16d58075a9ab8d5c1e46c6c83ce11cb4eTripp * This property will get set to false when batching operations.
c093c1aed867e18aa4778708592e1ceb45d18cffTripp * @config autoDraw
c7ba96d16d58075a9ab8d5c1e46c6c83ce11cb4eTripp * @type Boolean
c7ba96d16d58075a9ab8d5c1e46c6c83ce11cb4eTripp * @default true
66ca16dd76367c074fe4df1dcf7b555489a9bf85Tripp * Indicates whether the `Graphic` and its children are visible.
c093c1aed867e18aa4778708592e1ceb45d18cffTripp * @config visible
66ca16dd76367c074fe4df1dcf7b555489a9bf85Tripp * @type Boolean
66ca16dd76367c074fe4df1dcf7b555489a9bf85Tripp * Storage for `x` attribute.
66ca16dd76367c074fe4df1dcf7b555489a9bf85Tripp * @property _x
66ca16dd76367c074fe4df1dcf7b555489a9bf85Tripp * @type Number
66ca16dd76367c074fe4df1dcf7b555489a9bf85Tripp * Storage for `y` attribute.
66ca16dd76367c074fe4df1dcf7b555489a9bf85Tripp * @property _y
66ca16dd76367c074fe4df1dcf7b555489a9bf85Tripp * @type Number
c7ba96d16d58075a9ab8d5c1e46c6c83ce11cb4eTripp * Gets the current position of the graphic instance in page coordinates.
09688ec5ffb8b9cf9883a770e2f9ebd60b28888dTripp * @method getXY
09688ec5ffb8b9cf9883a770e2f9ebd60b28888dTripp * @return Array The XY position of the shape.
09688ec5ffb8b9cf9883a770e2f9ebd60b28888dTripp getXY: function()
66ca16dd76367c074fe4df1dcf7b555489a9bf85Tripp * Storage for `resizeDown` attribute.
c7ba96d16d58075a9ab8d5c1e46c6c83ce11cb4eTripp * @property _resizeDown
09688ec5ffb8b9cf9883a770e2f9ebd60b28888dTripp * @type Boolean
09688ec5ffb8b9cf9883a770e2f9ebd60b28888dTripp * Initializes the class.
09688ec5ffb8b9cf9883a770e2f9ebd60b28888dTripp * @method initializer
66ca16dd76367c074fe4df1dcf7b555489a9bf85Tripp * @param {Object} config Optional attributes
09688ec5ffb8b9cf9883a770e2f9ebd60b28888dTripp * Adds the graphics node to the dom.
09688ec5ffb8b9cf9883a770e2f9ebd60b28888dTripp * @method render
09688ec5ffb8b9cf9883a770e2f9ebd60b28888dTripp * @param {HTMLElement} parentNode node in which to render the graphics node into.
a89ad754cce3cfc8aee71760e10217b54020360dTripp w = this.get("width") || parseInt(parentNode.getComputedStyle("width"), 10),
a89ad754cce3cfc8aee71760e10217b54020360dTripp h = this.get("height") || parseInt(parentNode.getComputedStyle("height"), 10);
09688ec5ffb8b9cf9883a770e2f9ebd60b28888dTripp return this;
c7ba96d16d58075a9ab8d5c1e46c6c83ce11cb4eTripp * Removes all nodes.
c7ba96d16d58075a9ab8d5c1e46c6c83ce11cb4eTripp * @method destroy
c7ba96d16d58075a9ab8d5c1e46c6c83ce11cb4eTripp destroy: function()
09688ec5ffb8b9cf9883a770e2f9ebd60b28888dTripp * Generates a shape instance by type.
b57ff76ab2ce5f3017d61855f13ed04ab46a965cTripp * @method addShape
09688ec5ffb8b9cf9883a770e2f9ebd60b28888dTripp * @param {Object} cfg attributes for the shape
09688ec5ffb8b9cf9883a770e2f9ebd60b28888dTripp * @return Shape
c7ba96d16d58075a9ab8d5c1e46c6c83ce11cb4eTripp * Adds a shape instance to the graphic instance.
b57ff76ab2ce5f3017d61855f13ed04ab46a965cTripp * @method _appendShape
c7ba96d16d58075a9ab8d5c1e46c6c83ce11cb4eTripp * @param {Shape} shape The shape instance to be added to the graphic.
a89ad754cce3cfc8aee71760e10217b54020360dTripp * Removes a shape instance from from the graphic instance.
a89ad754cce3cfc8aee71760e10217b54020360dTripp * @method removeShape
66ca16dd76367c074fe4df1dcf7b555489a9bf85Tripp * @param {Shape|String} shape The instance or id of the shape to be removed.
a89ad754cce3cfc8aee71760e10217b54020360dTripp * Removes all shape instances from the dom.
a89ad754cce3cfc8aee71760e10217b54020360dTripp * @method removeAllShapes
c7ba96d16d58075a9ab8d5c1e46c6c83ce11cb4eTripp * Removes all child nodes.
c7ba96d16d58075a9ab8d5c1e46c6c83ce11cb4eTripp * @method _removeChildren
c7ba96d16d58075a9ab8d5c1e46c6c83ce11cb4eTripp * @param {HTMLElement} node
c7ba96d16d58075a9ab8d5c1e46c6c83ce11cb4eTripp * Toggles visibility
c7ba96d16d58075a9ab8d5c1e46c6c83ce11cb4eTripp * @method _toggleVisible
c7ba96d16d58075a9ab8d5c1e46c6c83ce11cb4eTripp * @param {Boolean} val indicates visibilitye
b57ff76ab2ce5f3017d61855f13ed04ab46a965cTripp * Returns a shape class. Used by `addShape`.
cec703a844d9691646231634fe709f4ea41d278aTripp * @method _getShapeClass
66ca16dd76367c074fe4df1dcf7b555489a9bf85Tripp * @param {Shape | String} val Indicates which shape class.
66ca16dd76367c074fe4df1dcf7b555489a9bf85Tripp * @return Function
b57ff76ab2ce5f3017d61855f13ed04ab46a965cTripp * Look up for shape classes. Used by `addShape` to retrieve a class for instantiation.
66ca16dd76367c074fe4df1dcf7b555489a9bf85Tripp * @property _shapeClass
66ca16dd76367c074fe4df1dcf7b555489a9bf85Tripp * @type Object
c7ba96d16d58075a9ab8d5c1e46c6c83ce11cb4eTripp * Returns a shape based on the id of its dom node.
c7ba96d16d58075a9ab8d5c1e46c6c83ce11cb4eTripp * @method getShapeById
c7ba96d16d58075a9ab8d5c1e46c6c83ce11cb4eTripp * @param {String} id Dom id of the shape's node attribute.
c7ba96d16d58075a9ab8d5c1e46c6c83ce11cb4eTripp * @return Shape
9eaaa502227248d304ac9170902697d02158c1d9Tripp * Allows for creating multiple shapes in order to batch appending and redraw operations.
9eaaa502227248d304ac9170902697d02158c1d9Tripp * @method batch
9eaaa502227248d304ac9170902697d02158c1d9Tripp * @param {Function} method Method to execute.
66ca16dd76367c074fe4df1dcf7b555489a9bf85Tripp * Returns a document fragment to for attaching shapes.
66ca16dd76367c074fe4df1dcf7b555489a9bf85Tripp * @method _getDocFrag
66ca16dd76367c074fe4df1dcf7b555489a9bf85Tripp * @return DocumentFragment
c7ba96d16d58075a9ab8d5c1e46c6c83ce11cb4eTripp return this._frag;
66ca16dd76367c074fe4df1dcf7b555489a9bf85Tripp * Redraws all shapes.
66ca16dd76367c074fe4df1dcf7b555489a9bf85Tripp * @method _redraw
c7ba96d16d58075a9ab8d5c1e46c6c83ce11cb4eTripp _redraw: function()
c7ba96d16d58075a9ab8d5c1e46c6c83ce11cb4eTripp var box = this.get("resizeDown") ? this._getUpdatedContentBounds() : this._contentBounds;
c7ba96d16d58075a9ab8d5c1e46c6c83ce11cb4eTripp this._frag = null;
0fdefaa9ca017edfb76b736c825b34186f33045aTripp * Adds a shape to the redraw queue and calculates the contentBounds. Used internally
0fdefaa9ca017edfb76b736c825b34186f33045aTripp * by `Shape` instances.
c7ba96d16d58075a9ab8d5c1e46c6c83ce11cb4eTripp * @method addToRedrawQueue
66ca16dd76367c074fe4df1dcf7b555489a9bf85Tripp * @param Shape shape The shape instance to add to the queue
0fdefaa9ca017edfb76b736c825b34186f33045aTripp * @protected
c7ba96d16d58075a9ab8d5c1e46c6c83ce11cb4eTripp box.left = box.left < shapeBox.left ? box.left : shapeBox.left;
c7ba96d16d58075a9ab8d5c1e46c6c83ce11cb4eTripp box.top = box.top < shapeBox.top ? box.top : shapeBox.top;
c7ba96d16d58075a9ab8d5c1e46c6c83ce11cb4eTripp box.right = box.right > shapeBox.right ? box.right : shapeBox.right;
c7ba96d16d58075a9ab8d5c1e46c6c83ce11cb4eTripp box.bottom = box.bottom > shapeBox.bottom ? box.bottom : shapeBox.bottom;
66ca16dd76367c074fe4df1dcf7b555489a9bf85Tripp * Recalculates and returns the `contentBounds` for the `Graphic` instance.
e0caea9528bfbb244d27129aa9dea5aebc07fc18Tripp * @method _getUpdatedContentBounds
66ca16dd76367c074fe4df1dcf7b555489a9bf85Tripp * @return {Object}