Commit initial support for Shape class.

Hit testing is still missing.

src/item/Shape.js

@@ -0,0 +1,92 @@
+/*
+ * Paper.js - The Swiss Army Knife of Vector Graphics Scripting.
+ * http://paperjs.org/
+ *
+ * Copyright (c) 2011 - 2013, Juerg Lehni & Jonathan Puckey
+ * http://lehni.org/ & http://jonathanpuckey.com/
+ *
+ * Distributed under the MIT license. See LICENSE file for details.
+ *
+ * All rights reserved.
+ */
+
+/**
+ * @name Shape
+ *
+ * @class
+ *
+ * @extends Item
+ */
+var Shape = this.Shape = Item.extend(/** @lends Shape# */{
+	_class: 'Shape',
+
+	initialize: function(type, size) {
+		this.base();
+		this._type = type;
+		this._size = size;
+	},
+
+	_draw: function(ctx, param) {
+		var style = this._style,
+			size = this._size,
+			width = size.width,
+			height = size.height,
+			fillColor = style._fillColor,
+			strokeColor = style._strokeColor;
+		if (fillColor || strokeColor || param.clip) {
+			ctx.beginPath();
+			switch (this._type) {
+			case 'rect':
+				ctx.rect(-width / 2, -height / 2, width, height);
+				break;
+			case 'circle':
+				ctx.arc(0, 0, width, 0, Math.PI * 2, true);
+				break;
+			case 'ellipse':
+				var kappa = Numerical.KAPPA,
+					cx = width * kappa,
+					cy = height * kappa,
+					mx = width / 2,
+					my = height / 2;
+				ctx.moveTo(0, my);
+				ctx.bezierCurveTo(0, my - cy, mx - cx, 0, mx, 0);
+				ctx.bezierCurveTo(mx + cx, 0, width, my - cy, width, my);
+				ctx.bezierCurveTo(width, my + cy, mx + cx, height, mx, height);
+				ctx.bezierCurveTo(mx - cx, height, 0, my + cy, 0, my);
+				break;
+			}
+		}
+		if (!param.clip && (fillColor || strokeColor)) {
+			this._setStyles(ctx);
+			if (fillColor)
+				ctx.fill();
+			if (strokeColor)
+				ctx.stroke();
+		}
+	},
+
+	_getBounds: function(getter, matrix) {
+		var rect = new Rectangle(this._size).setCenter(0, 0);
+		return matrix ? matrix._transformBounds(rect) : rect;
+	},
+
+	statics: {
+		Circle: function(/* center, radius */) {
+			var center = Point.readNamed(arguments, 'center'),
+				radius = Base.readNamed(arguments, 'radius');
+			return new Shape('circle', new Size(radius)).translate(center);
+		},
+
+		Rectangle: function(/* rectangle */) {
+			var rect = Rectangle.readNamed(arguments, 'rectangle');
+			return new Shape('rect', rect.getSize(true)).translate(
+					rect.getCenter(true));
+		},
+
+		Ellipse: function(/* rectangle */) {
+			var rect = Rectangle.readNamed(arguments, 'rectangle');
+			return new Shape('ellipse', rect.getSize(true)).translate(
+					rect.getCenter(true));
+		}
+	}
+});

src/paper.js

@@ -62,6 +62,7 @@ var paper = new function() {
 /*#*/ include('item/Item.js');
 /*#*/ include('item/Group.js');
 /*#*/ include('item/Layer.js');
+/*#*/ include('item/Shape.js');
 /*#*/ include('item/Raster.js');
 /*#*/ include('item/PlacedSymbol.js');
 /*#*/ include('item/HitResult.js');

src/path/Path.Constructors.js

@@ -20,7 +20,7 @@ Path.inject({ statics: new function() {
 		return path;
 	}
 
-	function createRectangle(/* rect */) {
+	function createRectangle(/* rectangle */) {
 		var rect = Rectangle.readNamed(arguments, 'rectangle'),
 			radius = Size.readNamed(arguments, 'radius', 0, 0, false, true), // readNull
 			bl = rect.getBottomLeft(true),
@@ -65,7 +65,7 @@ Path.inject({ statics: new function() {
 		new Segment([0.5, 1], [kappa, 0 ], [-kappa, 0])
 	];
 
-	function createEllipse(/* rect */) {
+	function createEllipse(/* rectangle */) {
 		var rect = Rectangle.readNamed(arguments, 'rectangle'),
 			path = createPath(arguments),
 			point = rect.getPoint(true),

src/path/Path.js

@@ -1831,8 +1831,8 @@ var Path = this.Path = PathItem.extend(/** @lends Path# */{
 
 			// Prepare the canvas path if we have any situation that requires it
 			// to be defined.
-			if (param.compound || param.clip || fillColor || strokeColor
-					&& !drawDash)
+			if (fillColor || strokeColor && !drawDash || param.compound
+					|| param.clip)
 				drawSegments(ctx, this);
 
 			if (this._closed)