Implemented Path.ellipse

src/extras/core/Curve.js

@@ -437,17 +437,18 @@ THREE.SplineCurve.prototype.getPoint = function ( t ) {
 };
 
 /**************************************************************
- *	Arc curve
+ *	Ellipse curve
  **************************************************************/
 
-THREE.ArcCurve = function ( aX, aY, aRadius,
+THREE.EllipseCurve = function ( aX, aY, xRadius, yRadius,
 							aStartAngle, aEndAngle,
 							aClockwise ) {
 
 	this.aX = aX;
 	this.aY = aY;
 
-	this.aRadius = aRadius;
+	this.xRadius = xRadius;
+	this.yRadius = yRadius;
 
 	this.aStartAngle = aStartAngle;
 	this.aEndAngle = aEndAngle;
@@ -456,10 +457,10 @@ THREE.ArcCurve = function ( aX, aY, aRadius,
 
 };
 
-THREE.ArcCurve.prototype = new THREE.Curve();
-THREE.ArcCurve.prototype.constructor = THREE.ArcCurve;
+THREE.EllipseCurve.prototype = new THREE.Curve();
+THREE.EllipseCurve.prototype.constructor = THREE.EllipseCurve;
 
-THREE.ArcCurve.prototype.getPoint = function ( t ) {
+THREE.EllipseCurve.prototype.getPoint = function ( t ) {
 
 	var deltaAngle = this.aEndAngle - this.aStartAngle;
 
@@ -471,13 +472,29 @@ THREE.ArcCurve.prototype.getPoint = function ( t ) {
 
 	var angle = this.aStartAngle + t * deltaAngle;
 
-	var tx = this.aX + this.aRadius * Math.cos( angle );
-	var ty = this.aY + this.aRadius * Math.sin( angle );
+	var tx = this.aX + this.xRadius * Math.cos( angle );
+	var ty = this.aY + this.yRadius * Math.sin( angle );
 
 	return new THREE.Vector2( tx, ty );
 
 };
 
+/**************************************************************
+ *	Arc curve
+ **************************************************************/
+
+THREE.ArcCurve = function ( aX, aY, aRadius,
+							aStartAngle, aEndAngle,
+							aClockwise ) {
+
+	THREE.EllipseCurve.call(this, aX, aY, aRadius, aRadius,
+		aStartAngle, aEndAngle, aClockwise);
+};
+
+THREE.ArcCurve.prototype = new THREE.EllipseCurve();
+THREE.ArcCurve.prototype.constructor = THREE.ArcCurve;
+
+
 /**************************************************************
  *	Utils
  **************************************************************/

src/extras/core/Path.js

@@ -29,8 +29,8 @@ THREE.PathActions = {
 	QUADRATIC_CURVE_TO: 'quadraticCurveTo', // Bezier quadratic curve
 	BEZIER_CURVE_TO: 'bezierCurveTo', 		// Bezier cubic curve
 	CSPLINE_THRU: 'splineThru',				// Catmull-rom spline
-	ARC: 'arc'								// Circle
-
+	ARC: 'arc',								// Circle
+	ELLIPSE: 'ellipse'
 };
 
 // TODO Clean up PATH API
@@ -133,16 +133,31 @@ THREE.Path.prototype.splineThru = function( pts /*Array of Vector*/ ) {
 };
 
 // FUTURE: Change the API or follow canvas API?
-// TODO ARC ( x, y, x - radius, y - radius, startAngle, endAngle )
 
-THREE.Path.prototype.arc = function ( aX, aY, aRadius,
+THREE.Path.prototype.ellipse = function ( aX, aY, xRadius, yRadius,
 									  aStartAngle, aEndAngle, aClockwise ) {
 
-	var args = Array.prototype.slice.call( arguments );
+	var laste = this.actions[ this.actions.length - 1];
+	this.absellipse(laste.x + aX, laste.y + aY, xRadius, yRadius,
+									aStartAngle, aEndAngle, aClockwise );
+ };
+ 
+THREE.Path.prototype.arc = function ( aX, aY, aRadius,
+									  aStartAngle, aEndAngle, aClockwise ) {
 
 	var laste = this.actions[ this.actions.length - 1];
+	this.absarc(laste.x + aX, laste.y + aY, aRadius,
+									aStartAngle, aEndAngle, aClockwise );
+ };
+ 
+
+
+THREE.Path.prototype.absellipse = function ( aX, aY, xRadius, yRadius,
+									  aStartAngle, aEndAngle, aClockwise ) {
+
+	var args = Array.prototype.slice.call( arguments );
 
-	var curve = new THREE.ArcCurve( laste.x + aX, laste.y + aY, aRadius,
+	var curve = new THREE.EllipseCurve( aX, aY, xRadius, yRadius,
 									aStartAngle, aEndAngle, aClockwise );
 	this.curves.push( curve );
 
@@ -152,29 +167,14 @@ THREE.Path.prototype.arc = function ( aX, aY, aRadius,
 	args.push(lastPoint.x);
 	args.push(lastPoint.y);
 
-	this.actions.push( { action: THREE.PathActions.ARC, args: args } );
+	this.actions.push( { action: THREE.PathActions.ELLIPSE, args: args } );
 
  };
 
 THREE.Path.prototype.absarc = function ( aX, aY, aRadius,
 									  aStartAngle, aEndAngle, aClockwise ) {
-
-	var args = Array.prototype.slice.call( arguments );
-
-	var curve = new THREE.ArcCurve( aX, aY, aRadius,
-									aStartAngle, aEndAngle, aClockwise );
-	this.curves.push( curve );
-
-	// console.log( 'arc', args );
-
-        // All of the other actions look to the last two elements in the list to
-        // find the ending point, so we need to append them.
-        var lastPoint = curve.getPoint(aClockwise ? 1 : 0);
-        args.push(lastPoint.x);
-        args.push(lastPoint.y);
-
-	this.actions.push( { action: THREE.PathActions.ARC, args: args } );
-
+	this.absellipse(aX, aY, aRadius, aRadius,
+		aStartAngle, aEndAngle, aClockwise);
  };
 
 
@@ -342,8 +342,6 @@ THREE.Path.prototype.getPoints = function( divisions, closedPath ) {
 
 		case THREE.PathActions.ARC:
 
-			laste = this.actions[ i - 1 ].args;
-
 			var aX = args[ 0 ], aY = args[ 1 ],
 				aRadius = args[ 2 ],
 				aStartAngle = args[ 3 ], aEndAngle = args[ 4 ],
@@ -378,6 +376,44 @@ THREE.Path.prototype.getPoints = function( divisions, closedPath ) {
 			//console.log(points);
 
 		  break;
+		  
+		case THREE.PathActions.ELLIPSE:
+
+			var aX = args[ 0 ], aY = args[ 1 ],
+				xRadius = args[ 2 ],
+				yRadius = args[3]
+				aStartAngle = args[ 4 ], aEndAngle = args[ 5 ],
+				aClockwise = !!args[ 6 ];
+
+
+			var deltaAngle = aEndAngle - aStartAngle;
+			var angle;
+			var tdivisions = divisions * 2;
+
+			for ( j = 1; j <= tdivisions; j ++ ) {
+
+				t = j / tdivisions;
+
+				if ( ! aClockwise ) {
+
+					t = 1 - t;
+
+				}
+
+				angle = aStartAngle + t * deltaAngle;
+
+				tx = aX + xRadius * Math.cos( angle );
+				ty = aY + yRadius * Math.sin( angle );
+
+				//console.log('t', t, 'angle', angle, 'tx', tx, 'ty', ty);
+
+				points.push( new THREE.Vector2( tx, ty ) );
+
+			}
+
+			//console.log(points);
+
+		  break;
 
 		} // end switch