brought back Ellipse and ellipse tests

Gruntfile.js

@@ -17,6 +17,7 @@ module.exports = function(grunt) {
     // shapes
     'src/shapes/Rect.js', 
     'src/shapes/Circle.js', 
+    'src/shapes/Ellipse.js',
     'src/shapes/Wedge.js', 
     'src/shapes/Image.js', 
     'src/shapes/Polygon.js', 
@@ -54,6 +55,7 @@ module.exports = function(grunt) {
     'tests/js/unit/ddTests.js', 
     'tests/js/unit/shapes/rectTests.js', 
     'tests/js/unit/shapes/circleTests.js', 
+    'tests/js/unit/shapes/ellipseTests.js', 
     'tests/js/unit/shapes/wedgeTests.js', 
     'tests/js/unit/shapes/imageTests.js',
     'tests/js/unit/shapes/polygonTests.js',

src/shapes/Ellipse.js

@@ -0,0 +1,82 @@
+(function() {
+    // the 0.0001 offset fixes a bug in Chrome 27
+    var PIx2 = (Math.PI * 2) - 0.0001,
+        ELLIPSE = 'Ellipse';
+
+    /**
+     * Ellipse constructor
+     * @constructor
+     * @augments Kinetic.Shape
+     * @param {Object} config
+     * @param {Number|Array|Object} config.radius defines x and y radius
+     * {{ShapeParams}}
+     * {{NodeParams}}
+     */
+    Kinetic.Ellipse = function(config) {
+        this._initEllipse(config);
+    };
+
+    Kinetic.Ellipse.prototype = {
+        _initEllipse: function(config) {
+            this.createAttrs();
+
+            // call super constructor
+            Kinetic.Shape.call(this, config);
+            this.className = ELLIPSE;
+            this._setDrawFuncs();
+        },
+        drawFunc: function(canvas) {
+            var context = canvas.getContext(), r = this.getRadius();
+            context.beginPath();
+            context.save();
+            if(r.x !== r.y) {
+                context.scale(1, r.y / r.x);
+            }
+            context.arc(0, 0, r.x, 0, PIx2, false);
+            context.restore();
+            context.closePath();
+            canvas.fillStroke(this);
+        },
+        getWidth: function() {
+            return this.getRadius().x * 2;
+        },
+        getHeight: function() {
+            return this.getRadius().y * 2;
+        },
+        setWidth: function(width) {
+            Kinetic.Node.prototype.setWidth.call(this, width);
+            this.setRadius({
+                x: width / 2
+            });
+        },
+        setHeight: function(height) {
+            Kinetic.Node.prototype.setHeight.call(this, height);
+            this.setRadius({
+                y: height / 2
+            });
+        }
+    };
+    Kinetic.Util.extend(Kinetic.Ellipse, Kinetic.Shape);
+
+    // add getters setters
+    Kinetic.Node.addPointGetterSetter(Kinetic.Ellipse, 'radius', 0);
+
+    /**
+     * set radius
+     * @name setRadius
+     * @methodOf Kinetic.Ellipse.prototype
+     * @param {Object|Array} radius
+     *  radius can be a number, in which the ellipse becomes a circle,
+     *  it can be an object with an x and y component, or it
+     *  can be an array in which the first element is the x component
+     *  and the second element is the y component.  The x component
+     *  defines the horizontal radius and the y component
+     *  defines the vertical radius
+     */
+
+    /**
+     * get radius
+     * @name getRadius
+     * @methodOf Kinetic.Ellipse.prototype
+     */
+})();

tests/js/unit/shapes/ellipseTests.js

@@ -0,0 +1,21 @@
+Test.Modules.ELLIPSE = {
+    'add ellipse': function(containerId) {
+        var stage = new Kinetic.Stage({
+            container: containerId,
+            width: 578,
+            height: 200
+        });
+        var layer = new Kinetic.Layer();
+        var ellipse = new Kinetic.Ellipse({
+            x: stage.getWidth() / 2,
+            y: stage.getHeight() / 2,
+            radius: [70, 35],
+            fill: 'green',
+            stroke: 'black',
+            strokeWidth: 8
+        });
+        layer.add(ellipse);
+        stage.add(layer);
+        test(ellipse.getClassName() === 'Ellipse', 'shape type should be Ellipse');
+    }
+};