var shapes = {};

(function() {
  function Ellipse(cx, cy, rx, ry) {
    this.cx = cx;
    this.cy = cy;
    this.rx = rx;
    this.ry = ry;
    this._context = null;
  }

  Ellipse.prototype.update = function(cx, cy, rx, ry) {
    this.cx = cx;
    this.cy = cy;
    this.rx = rx;
    this.ry = ry;

    return this;
  };

  Ellipse.prototype.context = function(canvas) {
    if (!arguments.length) return this._context;
    this._context = canvas.getContext("2d");
    return this;
  };

  Ellipse.prototype.cartesian = function(theta) {
    var x = this.rx * Math.cos(theta) + this.cx,
        y = this.ry * Math.sin(theta) + this.cy;
    return {x, y}
  };

  Ellipse.prototype.stroke = function() {
    var context = this.context(),
        theta = 0,
        dt = Math.PI/24,
        point = this.cartesian(theta);

    context.beginPath();
    context.moveTo(point.x, point.y);
    for (theta = dt; theta <= 2*Math.PI; theta += dt) {
      point = this.cartesian(theta);
      context.lineTo(point.x, point.y);
    }
    context.stroke();
    context.closePath();

    return this;
  };

  Ellipse.prototype.fill = function() {
    var context = this.context(),
        theta = 0,
        dt = Math.PI/24,
        point = this.cartesian(theta);

    context.beginPath();
    context.moveTo(point.x, point.y);
    for (theta = dt; theta <= 2*Math.PI; theta += dt) {
      point = this.cartesian(theta);
      context.lineTo(point.x, point.y);
    }
    context.fill();
    context.closePath();

    return this;
  };

  function Circle(cx, cy, r) {
    Ellipse.call(this, cx, cy, r, r);
  }

  Circle.prototype = Object.create(Ellipse.prototype);

  Circle.prototype.update = function(cx, cy, r) {
    this.cx = cx;
    this.cy = cy;
    this.rx = r;
    this.ry = r;

    return this;
  };

  shapes.ellipse = function(cx, cy, rx, ry) {
    var ellipse = new Ellipse(cx, cy, rx, ry);
    return ellipse;
  };

  shapes.circle = function(cx, cy, r) {
    var circle = new Circle(cx, cy, r);
    return circle;
  };
})();