CanvasPath.js revision 66ca16dd76367c074fe4df1dcf7b555489a9bf85
fb1ecdf65fd4106deb62da339763f2e7670ca0f6Matt Sweeney/**
fb1ecdf65fd4106deb62da339763f2e7670ca0f6Matt Sweeney * The CanvasPath class creates a graphic object with editable
bb82d389f8b12cd4366603113b2fc397561c0b9dJeff Conniff * properties.
fb1ecdf65fd4106deb62da339763f2e7670ca0f6Matt Sweeney *
fb1ecdf65fd4106deb62da339763f2e7670ca0f6Matt Sweeney * @class CanvasPath
fb1ecdf65fd4106deb62da339763f2e7670ca0f6Matt Sweeney * @extends CanvasShape
fb1ecdf65fd4106deb62da339763f2e7670ca0f6Matt Sweeney */
fb1ecdf65fd4106deb62da339763f2e7670ca0f6Matt SweeneyCanvasPath = function(cfg)
fb1ecdf65fd4106deb62da339763f2e7670ca0f6Matt Sweeney{
fb1ecdf65fd4106deb62da339763f2e7670ca0f6Matt Sweeney CanvasPath.superclass.constructor.apply(this, arguments);
fb1ecdf65fd4106deb62da339763f2e7670ca0f6Matt Sweeney};
fb1ecdf65fd4106deb62da339763f2e7670ca0f6Matt SweeneyCanvasPath.NAME = "canvasPath";
bb82d389f8b12cd4366603113b2fc397561c0b9dJeff ConniffY.extend(CanvasPath, Y.CanvasShape, {
bb82d389f8b12cd4366603113b2fc397561c0b9dJeff Conniff /**
bb82d389f8b12cd4366603113b2fc397561c0b9dJeff Conniff * Indicates the type of shape
bb82d389f8b12cd4366603113b2fc397561c0b9dJeff Conniff *
bb82d389f8b12cd4366603113b2fc397561c0b9dJeff Conniff * @property _type
bb82d389f8b12cd4366603113b2fc397561c0b9dJeff Conniff * @readOnly
fb1ecdf65fd4106deb62da339763f2e7670ca0f6Matt Sweeney * @type String
fb1ecdf65fd4106deb62da339763f2e7670ca0f6Matt Sweeney */
fb1ecdf65fd4106deb62da339763f2e7670ca0f6Matt Sweeney _type: "path",
bb82d389f8b12cd4366603113b2fc397561c0b9dJeff Conniff
fb1ecdf65fd4106deb62da339763f2e7670ca0f6Matt Sweeney /**
bb82d389f8b12cd4366603113b2fc397561c0b9dJeff Conniff * Draws the shape.
fb1ecdf65fd4106deb62da339763f2e7670ca0f6Matt Sweeney *
fb1ecdf65fd4106deb62da339763f2e7670ca0f6Matt Sweeney * @method _draw
fb1ecdf65fd4106deb62da339763f2e7670ca0f6Matt Sweeney * @private
bb82d389f8b12cd4366603113b2fc397561c0b9dJeff Conniff */
bb82d389f8b12cd4366603113b2fc397561c0b9dJeff Conniff _draw: function()
bb82d389f8b12cd4366603113b2fc397561c0b9dJeff Conniff {
bb82d389f8b12cd4366603113b2fc397561c0b9dJeff Conniff this._paint();
bb82d389f8b12cd4366603113b2fc397561c0b9dJeff Conniff },
bb82d389f8b12cd4366603113b2fc397561c0b9dJeff Conniff
bb82d389f8b12cd4366603113b2fc397561c0b9dJeff Conniff /**
fb1ecdf65fd4106deb62da339763f2e7670ca0f6Matt Sweeney * Creates the dom node for the shape.
bb82d389f8b12cd4366603113b2fc397561c0b9dJeff Conniff *
bb82d389f8b12cd4366603113b2fc397561c0b9dJeff Conniff * @private
bb82d389f8b12cd4366603113b2fc397561c0b9dJeff Conniff * @return HTMLElement
bb82d389f8b12cd4366603113b2fc397561c0b9dJeff Conniff */
bb82d389f8b12cd4366603113b2fc397561c0b9dJeff Conniff createNode: function()
bb82d389f8b12cd4366603113b2fc397561c0b9dJeff Conniff {
bb82d389f8b12cd4366603113b2fc397561c0b9dJeff Conniff var node = Y.config.doc.createElement('canvas'),
bb82d389f8b12cd4366603113b2fc397561c0b9dJeff Conniff id = this.get("id");
bb82d389f8b12cd4366603113b2fc397561c0b9dJeff Conniff this._context = node.getContext('2d');
bb82d389f8b12cd4366603113b2fc397561c0b9dJeff Conniff node.setAttribute("overflow", "visible");
fb1ecdf65fd4106deb62da339763f2e7670ca0f6Matt Sweeney node.setAttribute("pointer-events", "none");
fb1ecdf65fd4106deb62da339763f2e7670ca0f6Matt Sweeney node.style.pointerEvents = "none";
fb1ecdf65fd4106deb62da339763f2e7670ca0f6Matt Sweeney node.style.overflow = "visible";
5d6d6a5b6cfcb06add1a3948b3d07087bff7f130Luke Smith node.setAttribute("class", "yui3-" + SHAPE);
5d6d6a5b6cfcb06add1a3948b3d07087bff7f130Luke Smith node.setAttribute("class", "yui3-" + this.name);
bb82d389f8b12cd4366603113b2fc397561c0b9dJeff Conniff node.setAttribute("id", id);
bb82d389f8b12cd4366603113b2fc397561c0b9dJeff Conniff id = "#" + id;
bb82d389f8b12cd4366603113b2fc397561c0b9dJeff Conniff this.node = node;
5d6d6a5b6cfcb06add1a3948b3d07087bff7f130Luke Smith },
bb82d389f8b12cd4366603113b2fc397561c0b9dJeff Conniff
fb1ecdf65fd4106deb62da339763f2e7670ca0f6Matt Sweeney /**
fb1ecdf65fd4106deb62da339763f2e7670ca0f6Matt Sweeney * Completes a drawing operation.
fb1ecdf65fd4106deb62da339763f2e7670ca0f6Matt Sweeney *
* @method end
*/
end: function()
{
this._draw();
}
});
CanvasPath.ATTRS = Y.merge(Y.CanvasShape.ATTRS, {
/**
* Indicates the width of the shape
*
* @attribute width
* @type Number
*/
width: {
getter: function()
{
var offset = this._stroke && this._strokeWeight ? (this._strokeWeight * 2) : 0;
return this._width - offset;
},
setter: function(val)
{
this._width = val;
return val;
}
},
/**
* Indicates the height of the shape
*
* @attribute height
* @type Number
*/
height: {
getter: function()
{
var offset = this._stroke && this._strokeWeight ? (this._strokeWeight * 2) : 0;
return this._height - offset;
},
setter: function(val)
{
this._height = val;
return val;
}
},
/**
* Indicates the path used for the node.
*
* @attribute path
* @type String
*/
path: {
readOnly: true,
getter: function()
{
return this._path;
}
}
});
Y.CanvasPath = CanvasPath;