Merged @zz85's branch.

Moved new extrude example into "webgl_geometry_extrude_uvs.html". This example still needs some work ...

Also added ArrowHelper to "webgl_geometries.html"

build/custom/ThreeWebGL.js

@@ -99,7 +99,7 @@ oa=new THREE.Vector3,ka=new THREE.Vector3,X=new THREE.Vector3;for(b=0,c=this.ver
 D=L[e],oa.copy(D),oa.subSelf(X.multiplyScalar(X.dot(D))).normalize(),ka.cross(g.vertexNormals[d],D),e=ka.dot(K[e]),e=0>e?-1:1,g.vertexTangents[d]=new THREE.Vector4(oa.x,oa.y,oa.z,e)}this.hasTangents=!0},computeBoundingBox:function(){if(!this.boundingBox)this.boundingBox={min:new THREE.Vector3,max:new THREE.Vector3};if(0<this.vertices.length){var a;a=this.vertices[0].position;this.boundingBox.min.copy(a);this.boundingBox.max.copy(a);for(var b=this.boundingBox.min,c=this.boundingBox.max,d=1,e=this.vertices.length;d<
 e;d++){a=this.vertices[d].position;if(a.x<b.x)b.x=a.x;else if(a.x>c.x)c.x=a.x;if(a.y<b.y)b.y=a.y;else if(a.y>c.y)c.y=a.y;if(a.z<b.z)b.z=a.z;else if(a.z>c.z)c.z=a.z}}else this.boundingBox.min.set(0,0,0),this.boundingBox.max.set(0,0,0)},computeBoundingSphere:function(){if(!this.boundingSphere)this.boundingSphere={radius:0};for(var a,b=0,c=0,d=this.vertices.length;c<d;c++)a=this.vertices[c].position.length(),a>b&&(b=a);this.boundingSphere.radius=b},mergeVertices:function(){var a={},b=[],c=[],d,e=Math.pow(10,
 4),g,h;for(g=0,h=this.vertices.length;g<h;g++)d=this.vertices[g].position,d=[Math.round(d.x*e),Math.round(d.y*e),Math.round(d.z*e)].join("_"),void 0===a[d]?(a[d]=g,b.push(this.vertices[g]),c[g]=b.length-1):c[g]=c[a[d]];for(g=0,h=this.faces.length;g<h;g++)if(a=this.faces[g],a instanceof THREE.Face3)a.a=c[a.a],a.b=c[a.b],a.c=c[a.c];else if(a instanceof THREE.Face4)a.a=c[a.a],a.b=c[a.b],a.c=c[a.c],a.d=c[a.d];this.vertices=b}};THREE.GeometryCount=0;
-THREE.Spline=function(a){function b(a,b,c,d,e,g,h){a=0.5*(c-a);d=0.5*(d-b);return(2*(b-c)+a+d)*h+(-3*(b-c)-2*a-d)*g+a*e+b}this.points=a;var c=[],d={x:0,y:0,z:0},e,g,h,i,m,k,j,n,l;this.initFromArray=function(a){this.points=[];for(var b=0;b<a.length;b++)this.points[b]={x:a[b][0],y:a[b][1],z:a[b][2]}};this.getPoint=function(a){e=(this.points.length-1)*a;g=Math.floor(e);h=e-g;c[0]=0===g?g:g-1;c[1]=g;c[2]=g>this.points.length-2?g:g+1;c[3]=g>this.points.length-3?g:g+2;k=this.points[c[0]];j=this.points[c[1]];
+THREE.Spline=function(a){function b(a,b,c,d,e,g,h){a=0.5*(c-a);d=0.5*(d-b);return(2*(b-c)+a+d)*h+(-3*(b-c)-2*a-d)*g+a*e+b}this.points=a;var c=[],d={x:0,y:0,z:0},e,g,h,i,m,k,j,n,l;this.initFromArray=function(a){this.points=[];for(var b=0;b<a.length;b++)this.points[b]={x:a[b][0],y:a[b][1],z:a[b][2]}};this.getPoint=function(q){e=(this.points.length-1)*q;g=Math.floor(e);h=e-g;c[0]=0===g?g:g-1;c[1]=g;c[2]=g>a.length-2?a.length-1:g+1;c[3]=g>a.length-3?a.length-1:g+2;k=this.points[c[0]];j=this.points[c[1]];
 n=this.points[c[2]];l=this.points[c[3]];i=h*h;m=h*i;d.x=b(k.x,j.x,n.x,l.x,h,i,m);d.y=b(k.y,j.y,n.y,l.y,h,i,m);d.z=b(k.z,j.z,n.z,l.z,h,i,m);return d};this.getControlPointsArray=function(){var a,b,c=this.points.length,d=[];for(a=0;a<c;a++)b=this.points[a],d[a]=[b.x,b.y,b.z];return d};this.getLength=function(a){var b,c,d,e=b=b=0,g=new THREE.Vector3,h=new THREE.Vector3,i=[],j=0;i[0]=0;a||(a=100);c=this.points.length*a;g.copy(this.points[0]);for(a=1;a<c;a++)b=a/c,d=this.getPoint(b),h.copy(d),j+=h.distanceTo(g),
 g.copy(d),b*=this.points.length-1,b=Math.floor(b),b!=e&&(i[b]=j,e=b);i[i.length]=j;return{chunks:i,total:j}};this.reparametrizeByArcLength=function(a){var b,c,d,e,g,h,i=[],j=new THREE.Vector3,k=this.getLength();i.push(j.copy(this.points[0]).clone());for(b=1;b<this.points.length;b++){c=k.chunks[b]-k.chunks[b-1];h=Math.ceil(a*c/k.total);e=(b-1)/(this.points.length-1);g=b/(this.points.length-1);for(c=1;c<h-1;c++)d=e+c*(1/h)*(g-e),d=this.getPoint(d),i.push(j.copy(d).clone());i.push(j.copy(this.points[b]).clone())}this.points=
 i}};THREE.Camera=function(){THREE.Object3D.call(this);this.matrixWorldInverse=new THREE.Matrix4;this.projectionMatrix=new THREE.Matrix4;this.projectionMatrixInverse=new THREE.Matrix4};THREE.Camera.prototype=new THREE.Object3D;THREE.Camera.prototype.constructor=THREE.Camera;THREE.Camera.prototype.lookAt=function(a){this.matrix.lookAt(this.position,a,this.up);this.rotationAutoUpdate&&this.rotation.getRotationFromMatrix(this.matrix)};

examples/webgl_geometries.html

@@ -111,6 +111,10 @@
 				object.scale.x = object.scale.y = object.scale.z = 0.5;
 				scene.add( object );
 
+				object = new THREE.ArrowHelper( new THREE.Vector3( 0, 1, 0 ), new THREE.Vector3( 0, 0, 0 ), 50 );
+				object.position.set( 200, 0, 400 );
+				scene.add( object );
+
 				renderer = new THREE.WebGLRenderer( { antialias: true } );
 				renderer.setSize( window.innerWidth, window.innerHeight );
 

examples/webgl_geometry_extrude_uvs.html

+<!doctype html>
+<html lang="en">
+	<head>
+		<meta charset="utf-8">
+		<title>three.js webgl - geometry extrude</title>
+
+	</head>
+
+	<body>
+
+	<script src="../build/Three.js"></script>
+	<script>
+
+		var TEXDATA = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgBAMAAACBVGfHAAAAMFB'+
+					  'MVEWcEFqcGGOlIWOlIWulKWutOXOtOXutQnu1SoS6Uo69Y5zMfrHWnMbepc7erdbntd6d+uwA'+
+					  'AAAAo0lEQVR42mNgoAL4jwaIEQDp405gYOBKYLjvwIAssIBhLwM7ssABhtUMXECB3Q0M3nsTG'+
+					  'Lr3fmTwYuABGbqAIf9/AsP6/z8YWBjskQV+A/X2IwTccv4CBfYjBBi4/6MLoKnIWotmxvr/v4'+
+					  'C2+CMLfGPwYOBHFvjAUAUyGW5t5gao02G2sME8BxcoYDgvwAgS2LVqPxCvWr1rFZAiKggJClA'+
+					  'BAAC+WuzCiXr+gwAAAABJRU5ErkJggg==';
+
+		var renderer, camera, scene, mesh, mesh2;
+		var angle = 0;
+
+		init();
+		animate();
+
+		function init() {
+
+			scene = new THREE.Scene();
+
+			camera = new THREE.PerspectiveCamera( 45, window.innerWidth / window.innerHeight, 1, 1000 );
+			scene.add( camera );
+
+			var light = new THREE.DirectionalLight( 0xffffff );
+			light.position.set( 0, 1, 2 ).normalize();
+			scene.add( light );
+
+
+			renderer = new THREE.WebGLRenderer( { antialias: true } );
+			renderer.setSize( window.innerWidth, window.innerHeight );
+			document.body.appendChild( renderer.domElement );
+
+			setupModel();
+
+		};
+
+		function createMesh( g, texture ) {
+
+			var m = new THREE.Mesh( g, new THREE.MeshFaceMaterial()) ;
+			g.materials =
+					[
+						new THREE.MeshBasicMaterial( { map: texture } ),
+						new THREE.MeshBasicMaterial( { color: 0xcc4488 } )
+					];
+
+			return m;
+
+		}
+
+		function setupModel() {
+
+			var img = new Image();
+			img.onload = function() { texture.needsUpdate = true; }
+			img.src = TEXDATA;
+			var texture = new THREE.Texture( img );
+
+			var s = new THREE.Shape();
+			s.moveTo( 0,0 );
+			s.lineTo( -4, -4 );
+			s.lineTo(  4, -4 );
+			s.lineTo(  5, 0 );
+			s.lineTo(  4, 4 );
+			s.lineTo( -4, 4 );
+
+			var ho = new THREE.Shape();
+			ho.moveTo( 0,0 );
+			ho.lineTo( 0, 2 );
+			ho.lineTo( 2, 0 );
+			ho.lineTo( -2,-2 );
+
+			s.holes.push(ho);
+
+			var s2 = new THREE.Shape();
+			s2.moveTo( 8+ 0,0 );
+			s2.lineTo( 8+ -2, -2 );
+			s2.lineTo( 8+  2, -2 );
+			s2.lineTo( 8+  2.5, 0 );
+			s2.lineTo( 8+  2, 2 );
+			s2.lineTo( 8+ -2, 2 );
+
+			var exoption = {
+				bevelEnabled: false,
+				bevelSize: 1,
+				amount: 6,
+				extrudeMaterial: 0,
+				material: 1
+			};
+
+			var geom = s.extrude( exoption );
+			mesh = createMesh( geom, texture );
+			mesh.position.set( -7, 0, -45 );
+			mesh.doubleSided = true;
+			scene.add( mesh );
+
+			var geom2 = new THREE.ExtrudeGeometry( [s,s2], exoption );
+			mesh2 = createMesh( geom2, texture );
+			mesh2.position.set( 7, 0, -45 );
+			mesh2.doubleSided = true;
+			scene.add( mesh2 );
+
+		}
+
+		function animate() {
+
+			requestAnimationFrame( animate );
+
+			render();
+
+		}
+
+		function render() {
+
+			angle = Date.now() * 0.001;
+
+			mesh.rotation.set( -3.2, angle, 0 );
+			mesh2.rotation.set( -3.2, angle, 0 );
+
+			renderer.render( scene, camera );
+
+		}
+
+	</script>
+
+	</body>
+</html>
\ No newline at end of file

examples/webgl_geometry_shapes.html

@@ -277,11 +277,11 @@
 				// Arc circle
 
 				var arcShape = new THREE.Shape();
-				arcShape.moveTo( 0, 0 );
+				arcShape.moveTo( 50, 10 );
 				arcShape.arc( 10, 10, 40, 0, Math.PI*2, false );
 
 				var holePath = new THREE.Path();
-				holePath.moveTo( 0, 0 );
+				holePath.moveTo( 20, 10 );
 				holePath.arc( 10, 10, 10, 0, Math.PI*2, true );
 				arcShape.holes.push( holePath );
 
@@ -293,16 +293,16 @@
 				// Smiley
 
 				var smileyShape = new THREE.Shape();
-				smileyShape.moveTo( 0, 0 );
+				smileyShape.moveTo( 80, 40 );
 				smileyShape.arc( 40, 40, 40, 0, Math.PI*2, false );
 
 				var smileyEye1Path = new THREE.Path();
-				smileyEye1Path.moveTo( 0, 0 );
+				smileyEye1Path.moveTo( 35, 20 );
 				smileyEye1Path.arc( 25, 20, 10, 0, Math.PI*2, true );
 				smileyShape.holes.push( smileyEye1Path );
 
 				var smileyEye2Path = new THREE.Path();
-				smileyEye2Path.moveTo( 0, 0 );
+				smileyEye2Path.moveTo( 65, 20 );
 				smileyEye2Path.arc( 55, 20, 10, 0, Math.PI*2, true );
 				smileyShape.holes.push( smileyEye2Path );
 

src/core/Spline.js

@@ -34,8 +34,8 @@ THREE.Spline = function ( points ) {
 
 		c[ 0 ] = intPoint === 0 ? intPoint : intPoint - 1;
 		c[ 1 ] = intPoint;
-		c[ 2 ] = intPoint > this.points.length - 2 ? intPoint : intPoint + 1;
-		c[ 3 ] = intPoint > this.points.length - 3 ? intPoint : intPoint + 2;
+		c[ 2 ] = intPoint  > points.length - 2 ? points.length -1 : intPoint + 1;
+		c[ 3 ] = intPoint  > points.length - 3 ? points.length -1 : intPoint + 2;
 
 		pa = this.points[ c[ 0 ] ];
 		pb = this.points[ c[ 1 ] ];

src/extras/core/Curve.js

@@ -23,6 +23,7 @@
  * THREE.QuadraticBezierCurve3
  * THREE.CubicBezierCurve3
  * THREE.SplineCurve3
+ * THREE.ClosedSplineCurve3
  *
  **/
 
@@ -103,15 +104,19 @@ THREE.Curve.prototype.getLength = function () {
 
 THREE.Curve.prototype.getLengths = function ( divisions ) {
 
-	if ( !divisions ) divisions = 200;
+	if ( !divisions ) divisions = (this.__arcLengthDivisions) ? (this.__arcLengthDivisions): 200;
 
-	if ( this.cacheArcLengths && ( this.cacheArcLengths.length == divisions + 1 ) ) {
+	if ( this.cacheArcLengths 
+		&& ( this.cacheArcLengths.length == divisions + 1 ) 
+		&& !this.needsUpdate) {
 
 		//console.log( "cached", this.cacheArcLengths );
 		return this.cacheArcLengths;
 
 	}
 
+	this.needsUpdate = false;
+
 	var cache = [];
 	var current, last = this.getPoint( 0 );
 	var p, sum = 0;
@@ -133,6 +138,12 @@ THREE.Curve.prototype.getLengths = function ( divisions ) {
 
 };
 
+
+THREE.Curve.prototype.updateArcLengths = function() {
+	this.needsUpdate = true;
+	this.getLengths();
+};
+
 // Given u ( 0 .. 1 ), get a t to find p. This gives you points which are equi distance
 
 THREE.Curve.prototype.getUtoTmapping = function ( u, distance ) {
@@ -244,7 +255,7 @@ THREE.Curve.prototype.getTangent = function( t ) {
 	var pt1 = this.getPoint( t1 );
 	var pt2 = this.getPoint( t2 );
 	
-	var vec = pt1.clone().subSelf(pt2);
+	var vec = pt2.clone().subSelf(pt1);
 	return vec.normalize();
 
 };
@@ -457,8 +468,8 @@ THREE.SplineCurve.prototype.getPoint = function ( t ) {
 
 	c[ 0 ] = intPoint == 0 ? intPoint : intPoint - 1;
 	c[ 1 ] = intPoint;
-	c[ 2 ] = intPoint > points.length - 2 ? intPoint : intPoint + 1;
-	c[ 3 ] = intPoint > points.length - 3 ? intPoint : intPoint + 2;
+	c[ 2 ] = intPoint  > points.length - 2 ? points.length -1 : intPoint + 1;
+	c[ 3 ] = intPoint  > points.length - 3 ? points.length -1 : intPoint + 2;
 
 	v.x = THREE.Curve.Utils.interpolate( points[ c[ 0 ] ].x, points[ c[ 1 ] ].x, points[ c[ 2 ] ].x, points[ c[ 3 ] ].x, weight );
 	v.y = THREE.Curve.Utils.interpolate( points[ c[ 0 ] ].y, points[ c[ 1 ] ].y, points[ c[ 2 ] ].y, points[ c[ 3 ] ].y, weight );
@@ -706,15 +717,89 @@ THREE.SplineCurve3 = THREE.Curve.create(
 
 		c[ 0 ] = intPoint == 0 ? intPoint : intPoint - 1;
 		c[ 1 ] = intPoint;
-		c[ 2 ] = intPoint > points.length - 2 ? intPoint : intPoint + 1;
-		c[ 3 ] = intPoint > points.length - 3 ? intPoint : intPoint + 2;
+		c[ 2 ] = intPoint  > points.length - 2 ? points.length - 1 : intPoint + 1;
+		c[ 3 ] = intPoint  > points.length - 3 ? points.length - 1 : intPoint + 2;
 
-		v.x = THREE.Curve.Utils.interpolate( points[ c[ 0 ] ].x, points[ c[ 1 ] ].x, points[ c[ 2 ] ].x, points[ c[ 3 ] ].x, weight );
-		v.y = THREE.Curve.Utils.interpolate( points[ c[ 0 ] ].y, points[ c[ 1 ] ].y, points[ c[ 2 ] ].y, points[ c[ 3 ] ].y, weight );
-		v.z = THREE.Curve.Utils.interpolate( points[ c[ 0 ] ].z, points[ c[ 1 ] ].z, points[ c[ 2 ] ].z, points[ c[ 3 ] ].z, weight );
+		var pt0 = points[ c[0] ],
+			pt1 = points[ c[1] ],
+			pt2 = points[ c[2] ],
+			pt3 = points[ c[3] ];
+
+		v.x = THREE.Curve.Utils.interpolate(pt0.x, pt1.x, pt2.x, pt3.x, weight);
+		v.y = THREE.Curve.Utils.interpolate(pt0.y, pt1.y, pt2.y, pt3.y, weight);
+		v.z = THREE.Curve.Utils.interpolate(pt0.z, pt1.z, pt2.z, pt3.z, weight);
 
 		return v;
 
 	}
 
 );
+
+
+// THREE.SplineCurve3.prototype.getTangent = function(t) {
+// 		var v = new THREE.Vector3();
+// 		var c = [];
+// 		var points = this.points, point, intPoint, weight;
+// 		point = ( points.length - 1 ) * t;
+
+// 		intPoint = Math.floor( point );
+// 		weight = point - intPoint;
+
+// 		c[ 0 ] = intPoint == 0 ? intPoint : intPoint - 1;
+// 		c[ 1 ] = intPoint;
+// 		c[ 2 ] = intPoint  > points.length - 2 ? points.length - 1 : intPoint + 1;
+// 		c[ 3 ] = intPoint  > points.length - 3 ? points.length - 1 : intPoint + 2;
+
+// 		var pt0 = points[ c[0] ],
+// 			pt1 = points[ c[1] ],
+// 			pt2 = points[ c[2] ],
+// 			pt3 = points[ c[3] ];
+
+// 	// t = weight;
+// 	v.x = THREE.Curve.Utils.tangentSpline( t, pt0.x, pt1.x, pt2.x, pt3.x );
+// 	v.y = THREE.Curve.Utils.tangentSpline( t, pt0.y, pt1.y, pt2.y, pt3.y );
+// 	v.z = THREE.Curve.Utils.tangentSpline( t, pt0.z, pt1.z, pt2.z, pt3.z );
+
+// 	return v;
+		
+// }
+
+/**************************************************************
+ *	Closed Spline 3D curve
+ **************************************************************/
+
+
+THREE.ClosedSplineCurve3 = THREE.Curve.create(
+
+	function ( points /* array of Vector3 */) {
+
+		this.points = (points == undefined) ? [] : points;
+
+	},
+
+    function ( t ) {
+
+        var v = new THREE.Vector3();
+        var c = [];
+        var points = this.points, point, intPoint, weight;
+        point = ( points.length - 0 ) * t;
+            // This needs to be from 0-length +1
+
+        intPoint = Math.floor( point );
+        weight = point - intPoint;
+            
+        intPoint += intPoint > 0 ? 0 : ( Math.floor( Math.abs( intPoint ) / points.length ) + 1 ) * points.length;
+        c[ 0 ] = ( intPoint - 1 ) % points.length;
+        c[ 1 ] = ( intPoint ) % points.length;
+        c[ 2 ] = ( intPoint + 1 ) % points.length;
+        c[ 3 ] = ( intPoint + 2 ) % points.length;
+
+        v.x = THREE.Curve.Utils.interpolate( points[ c[ 0 ] ].x, points[ c[ 1 ] ].x, points[ c[ 2 ] ].x, points[ c[ 3 ] ].x, weight );
+        v.y = THREE.Curve.Utils.interpolate( points[ c[ 0 ] ].y, points[ c[ 1 ] ].y, points[ c[ 2 ] ].y, points[ c[ 3 ] ].y, weight );
+        v.z = THREE.Curve.Utils.interpolate( points[ c[ 0 ] ].z, points[ c[ 1 ] ].z, points[ c[ 2 ] ].z, points[ c[ 3 ] ].z, weight );
+        
+        return v;
+
+    }
+
+);
\ No newline at end of file

src/extras/core/Path.js

@@ -140,12 +140,39 @@ THREE.Path.prototype.arc = function ( aX, aY, aRadius,
 
 	var args = Array.prototype.slice.call( arguments );
 
+	var laste = this.actions[ this.actions.length - 1];
+
+	var curve = new THREE.ArcCurve( laste.x + aX, laste.y + aY, aRadius,
+									aStartAngle, aEndAngle, aClockwise );
+	this.curves.push( curve );
+
+	// 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 } );
+
+ };
+
+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 } );
 
  };
@@ -199,7 +226,7 @@ THREE.Path.prototype.getPoints = function( divisions, closedPath ) {
 
 		case THREE.PathActions.MOVE_TO:
 
-			// points.push( new THREE.Vector2( args[ 0 ], args[ 1 ] ) );
+			points.push( new THREE.Vector2( args[ 0 ], args[ 1 ] ) );
 
 			break;
 
@@ -317,15 +344,6 @@ THREE.Path.prototype.getPoints = function( divisions, closedPath ) {
 				aStartAngle = args[ 3 ], aEndAngle = args[ 4 ],
 				aClockwise = !!args[ 5 ];
 
-			var lastx = laste[ laste.length - 2 ],
-				lasty = laste[ laste.length - 1 ];
-
-			if ( laste.length == 0 ) {
-
-				lastx = lasty = 0;
-
-			}
-
 
 			var deltaAngle = aEndAngle - aStartAngle;
 			var angle;
@@ -343,8 +361,8 @@ THREE.Path.prototype.getPoints = function( divisions, closedPath ) {
 
 				angle = aStartAngle + t * deltaAngle;
 
-				tx = lastx + aX + aRadius * Math.cos( angle );
-				ty = lasty + aY + aRadius * Math.sin( angle );
+				tx = aX + aRadius * Math.cos( angle );
+				ty = aY + aRadius * Math.sin( angle );
 
 				//console.log('t', t, 'angle', angle, 'tx', tx, 'ty', ty);
 
@@ -360,6 +378,14 @@ THREE.Path.prototype.getPoints = function( divisions, closedPath ) {
 
 	}
 
+
+
+	// Normalize to remove the closing point by default.
+	var lastPoint = points[ points.length - 1];
+	var EPSILON = 0.0000000001;
+	if ( Math.abs(lastPoint.x - points[ 0 ].x) < EPSILON &&
+             Math.abs(lastPoint.y - points[ 0 ].y) < EPSILON)
+		points.splice( points.length - 1, 1);
 	if ( closedPath ) {
 
 		points.push( points[ 0 ] );

src/extras/geometries/ExtrudeGeometry.js

@@ -31,28 +31,17 @@
 THREE.ExtrudeGeometry = function( shapes, options ) {
 
 	if ( typeof( shapes ) === "undefined" ) {
-
 		shapes = [];
 		return;
-
 	}
 
 	THREE.Geometry.call( this );
 
 	shapes = shapes instanceof Array ? shapes : [ shapes ];
 
-	var shape, s, sl = shapes.length;
-
-	this.shapebb = shapes[ sl - 1 ].getBoundingBox();
-
-	for ( s = 0; s < sl; s ++ ) {
-
-		shape = shapes[ s ];
-
-		this.addShape( shape, options );
-
-	}
+	this.shapebb = shapes[ shapes.length - 1 ].getBoundingBox();
 
+	this.addShapeList( shapes, options );
 
 	this.computeCentroids();
 	this.computeFaceNormals();
@@ -70,6 +59,14 @@ THREE.ExtrudeGeometry = function( shapes, options ) {
 THREE.ExtrudeGeometry.prototype = new THREE.Geometry();
 THREE.ExtrudeGeometry.prototype.constructor = THREE.ExtrudeGeometry;
 
+THREE.ExtrudeGeometry.prototype.addShapeList = function(shapes, options) {
+	var sl = shapes.length;
+	
+	for ( var s = 0; s < sl; s ++ ) {
+		var shape = shapes[ s ];
+		this.addShape( shape, options );
+	}
+};
 
 THREE.ExtrudeGeometry.prototype.addShape = function( shape, options ) {
 
@@ -517,90 +514,87 @@ THREE.ExtrudeGeometry.prototype.addShape = function( shape, options ) {
 
 	}
 
+	// set UV generator
+	var uvgen = THREE.ExtrudeGeometry.WorldUVGenerator;
 
 	////
 	///   Handle Faces
 	////
 
-	// Bottom faces
-
-	if ( bevelEnabled ) {
-
-		var layer = 0 ; // steps + 1
-		var offset = vlen * layer;
+	// Top and bottom faces
+	buildLidFaces();
 
-		for ( i = 0; i < flen; i ++ ) {
-
-			face = faces[ i ];
-			f3( face[ 2 ]+ offset, face[ 1 ]+ offset, face[ 0 ] + offset );
-
-		}
+	// Sides faces
+	buildSideFaces();
 
-		layer = steps + bevelSegments * 2;
-		offset = vlen * layer;
 
-		// Top faces
+	/////  Internal functions
 
-		for ( i = 0; i < flen; i ++ ) {
+	function buildLidFaces() {
+		if ( bevelEnabled ) {
 
-			face = faces[ i ];
-			f3( face[ 0 ] + offset, face[ 1 ] + offset, face[ 2 ] + offset );
+			var layer = 0 ; // steps + 1
+			var offset = vlen * layer;
 
-		}
+			// Bottom faces
+			
+			for ( i = 0; i < flen; i ++ ) {
 
-	} else {
+				face = faces[ i ];
+				f3( face[ 2 ]+ offset, face[ 1 ]+ offset, face[ 0 ] + offset, true );
 
-		for ( i = 0; i < flen; i++ ) {
+			}
 
-			face = faces[ i ];
-			f3( face[ 2 ], face[ 1 ], face[ 0 ] );
+			layer = steps + bevelSegments * 2;
+			offset = vlen * layer;
 
-		}
+			// Top faces
 
-		// Top faces
+			for ( i = 0; i < flen; i ++ ) {
+				face = faces[ i ];
+				f3( face[ 0 ] + offset, face[ 1 ] + offset, face[ 2 ] + offset, false );
+			}
+		} else {
+		
+			// Bottom faces
 
-		for ( i = 0; i < flen; i ++ ) {
+			for ( i = 0; i < flen; i++ ) {
+				face = faces[ i ];
+				f3( face[ 2 ], face[ 1 ], face[ 0 ], true );
+			}
 
-			face = faces[ i ];
-			f3( face[ 0 ] + vlen * steps, face[ 1 ] + vlen * steps, face[ 2 ] + vlen * steps );
+			// Top faces
 
+			for ( i = 0; i < flen; i ++ ) {
+				face = faces[ i ];
+				f3( face[ 0 ] + vlen * steps, face[ 1 ] + vlen * steps, face[ 2 ] + vlen * steps, false );
+			}
 		}
-
 	}
 
-	var tmpPt;
-	var j, k, l, m;
-
-	var layeroffset = 0;
-
-	// Sides faces
-
-	sidewalls( contour );
-	layeroffset += contour.length;
-
-	for ( h = 0, hl = holes.length;  h < hl; h ++ ) {
+	// Create faces for the z-sides of the shape
 
-		ahole = holes[ h ];
-		sidewalls( ahole );
+	function buildSideFaces() {
+		var layeroffset = 0;
+		sidewalls( contour, layeroffset );
+		layeroffset += contour.length;
 
-		//, true
-		layeroffset += ahole.length;
+		for ( h = 0, hl = holes.length;  h < hl; h ++ ) {
+			ahole = holes[ h ];
+			sidewalls( ahole, layeroffset );
 
+			//, true
+			layeroffset += ahole.length;
+		}
 	}
 
-	// Create faces for the z-sides of the shape
-
-	function sidewalls( contour ) {
-
+	function sidewalls( contour, layeroffset ) {
+		var j, k;
 		i = contour.length;
 
 		while ( --i >= 0 ) {
-
-			tmpPt = contour[ i ];
-
 			j = i;
 			k = i - 1;
-
 			if ( k < 0 ) k = contour.length - 1;
 
 			//console.log('b', i,j, i-1, k,vertices.length);
@@ -608,7 +602,6 @@ THREE.ExtrudeGeometry.prototype.addShape = function( shape, options ) {
 			var s = 0, sl = steps  + bevelSegments * 2;
 
 			for ( s = 0; s < sl; s ++ ) {
-
 				var slen1 = vlen * s;
 				var slen2 = vlen * ( s + 1 );
 				var a = layeroffset + j + slen1,
@@ -616,46 +609,17 @@ THREE.ExtrudeGeometry.prototype.addShape = function( shape, options ) {
 					c = layeroffset + k + slen2,
 					d = layeroffset + j + slen2;
 
-				f4( a, b, c, d );
-
-				if ( extrudeMaterial !== undefined ) {
-
-					var v1 = s / sl;
-					var v2 = ( s + 1 ) / sl;
-
-					var ztol = ( amount + bevelThickness * 2 );
-
-					var u1 = ( scope.vertices[ a ].position.z + bevelThickness ) / ztol;
-					var u2 = ( scope.vertices[ d ].position.z + bevelThickness ) / ztol;
-
-					//console.log(vy1, vy2);
-					/*
-					scope.faceVertexUvs[ 0 ].push( [
-						new THREE.UV( u1, v1 ),
-						new THREE.UV( u2, v1 ),
-						new THREE.UV( u2, v2 ),
-						new THREE.UV( u1, v2 )
-					] );
-					*/
-
-				}
-
-
+				f4( a, b, c, d, contour, s, sl );
 			}
-
 		}
-
 	}
 
 
 	function v( x, y, z ) {
-
 		scope.vertices.push( new THREE.Vertex( new THREE.Vector3( x, y, z ) ) );
-
 	}
 
-	function f3( a, b, c ) {
-
+	function f3( a, b, c, isBottom ) {
 		a += shapesOffset;
 		b += shapesOffset;
 		c += shapesOffset;
@@ -663,80 +627,86 @@ THREE.ExtrudeGeometry.prototype.addShape = function( shape, options ) {
 												   // normal, color, material
 		scope.faces.push( new THREE.Face3( a, b, c, null, null, material ) );
 
-		var ax = scope.vertices[ a ].position.x,
-			ay = scope.vertices[ a ].position.y,
-
-			bx = scope.vertices[ b ].position.x,
-			by = scope.vertices[ b ].position.y,
-
-			cx = scope.vertices[ c ].position.x,
-			cy = scope.vertices[ c ].position.y;
-
-		scope.faceVertexUvs[ 0 ].push( [
-
-			new THREE.UV( ax, 1 - ay ),
-			new THREE.UV( bx, 1 - by ),
-			new THREE.UV( cx, 1 - cy )
-
-		] );
-
+		var uvs = isBottom ? uvgen.generateBottomUV( scope, shape, options, a, b, c)
+		                   : uvgen.generateTopUV( scope, shape, options, a, b, c);
 
+ 		scope.faceVertexUvs[ 0 ].push(uvs);
 	}
 
-	function f4( a, b, c, d ) {
-
+	function f4( a, b, c, d, wallContour, stepIndex, stepsLength ) {
 		a += shapesOffset;
 		b += shapesOffset;
 		c += shapesOffset;
 		d += shapesOffset;
 
  		scope.faces.push( new THREE.Face4( a, b, c, d, null, null, extrudeMaterial ) );
+ 
+ 		var uvs = uvgen.generateSideWallUV( scope, shape, wallContour, options, a, b, c, d, stepIndex, stepsLength);
+ 		scope.faceVertexUvs[ 0 ].push(uvs);
+	}
 
-		var ax = scope.vertices[ a ].position.x,
-			ay = scope.vertices[ a ].position.y,
-			az = scope.vertices[ a ].position.z,
-
-			bx = scope.vertices[ b ].position.x,
-			by = scope.vertices[ b ].position.y,
-			bz = scope.vertices[ b ].position.z,
+};
 
-			cx = scope.vertices[ c ].position.x,
-			cy = scope.vertices[ c ].position.y,
-			cz = scope.vertices[ c ].position.z,
 
-			dx = scope.vertices[ d ].position.x,
-			dy = scope.vertices[ d ].position.y,
-			dz = scope.vertices[ d ].position.z;
 
-		if ( Math.abs( ay - by ) < 0.01 ) {
+THREE.ExtrudeGeometry.WorldUVGenerator = {
+	generateTopUV: function( geometry, extrudedShape, extrudeOptions, indexA, indexB, indexC) {
+		var ax = geometry.vertices[ indexA ].position.x,
+			ay = geometry.vertices[ indexA ].position.y,
 
-			scope.faceVertexUvs[ 0 ].push( [
+			bx = geometry.vertices[ indexB ].position.x,
+			by = geometry.vertices[ indexB ].position.y,
 
+			cx = geometry.vertices[ indexC ].position.x,
+			cy = geometry.vertices[ indexC ].position.y;
+			
+		return [
+			new THREE.UV( ax, 1 - ay ),
+			new THREE.UV( bx, 1 - by ),
+			new THREE.UV( cx, 1 - cy )
+		];
+	},
+
+	generateBottomUV: function( geometry, extrudedShape, extrudeOptions, indexA, indexB, indexC) {
+		return this.generateTopUV( geometry, extrudedShape, extrudeOptions, indexA, indexB, indexC );
+	},
+
+	generateSideWallUV: function( geometry, extrudedShape, wallContour, extrudeOptions,
+	                              indexA, indexB, indexC, indexD, stepIndex, stepsLength) {
+		var ax = geometry.vertices[ indexA ].position.x,
+			ay = geometry.vertices[ indexA ].position.y,
+			az = geometry.vertices[ indexA ].position.z,
+
+			bx = geometry.vertices[ indexB ].position.x,
+			by = geometry.vertices[ indexB ].position.y,
+			bz = geometry.vertices[ indexB ].position.z,
+
+			cx = geometry.vertices[ indexC ].position.x,
+			cy = geometry.vertices[ indexC ].position.y,
+			cz = geometry.vertices[ indexC ].position.z,
+
+			dx = geometry.vertices[ indexD ].position.x,
+			dy = geometry.vertices[ indexD ].position.y,
+			dz = geometry.vertices[ indexD ].position.z;
+		
+		if ( Math.abs( ay - by ) < 0.01 ) {
+			return [
 				new THREE.UV( ax, az ),
 				new THREE.UV( bx, bz ),
 				new THREE.UV( cx, cz ),
 				new THREE.UV( dx, dz )
-
-			] );
-
+			];
 		} else {
-
-			scope.faceVertexUvs[ 0 ].push( [
-
+			return [
 				new THREE.UV( ay, az ),
 				new THREE.UV( by, bz ),
 				new THREE.UV( cy, cz ),
 				new THREE.UV( dy, dz )
-
-			] );
-
+			];
 		}
-
 	}
-
 };
 
-
 THREE.ExtrudeGeometry.__v1 = new THREE.Vector2();
 THREE.ExtrudeGeometry.__v2 = new THREE.Vector2();
 THREE.ExtrudeGeometry.__v3 = new THREE.Vector2();

src/extras/helpers/ArrowHelper.js

 /**
  * @author WestLangley / https://github.com/WestLangley
  * @author zz85 / https://github.com/zz85
+ *
+ * Creates an arrow for visualizing directions
+ *
+ * Parameters:
+ *  dir - Vector3
+ *  origin - Vector3
+ *  length - Number
+ *  hex - color in hex value
  */
- 
-THREE.ArrowHelper = function ( origin, dir, length, hex ) {
+
+THREE.ArrowHelper = function ( dir, origin, length, hex ) {
 
     THREE.Object3D.call( this );
 
+    if ( hex === undefined ) hex = 0xffff00;
+    if ( length === undefined ) length = 20;
+
     var lineGeometry = new THREE.Geometry();
-    lineGeometry.vertices.push( new THREE.Vertex() );
+    lineGeometry.vertices.push( new THREE.Vertex( new THREE.Vector3( 0, 0, 0 ) ) );
     lineGeometry.vertices.push( new THREE.Vertex( new THREE.Vector3( 0, 1, 0 ) ) );
-    
-    line = new THREE.Line( lineGeometry, new THREE.LineBasicMaterial( { color : hex } ) );
-    this.add( line );
-    
+
+    this.line = new THREE.Line( lineGeometry, new THREE.LineBasicMaterial( { color : hex } ) );
+    this.add( this.line );
+
     var coneGeometry = new THREE.CylinderGeometry( 0, 0.05, 0.25, 5, 1 );
-    
-    cone = new THREE.Mesh( coneGeometry, new THREE.MeshBasicMaterial( { color : hex } ) );
-    cone.position.set( 0, 1, 0 );
-    this.add( cone );
-    
-    this.position = origin;
-    
+
+    this.cone = new THREE.Mesh( coneGeometry, new THREE.MeshBasicMaterial( { color : hex } ) );
+    this.cone.position.set( 0, 1, 0 );
+    this.add( this.cone );
+
+    if ( origin instanceof THREE.Vector3 ) {
+
+        this.position = origin;
+
+    }
+
     this.setDirection( dir );
-    
     this.setLength( length );
 
 };
@@ -34,13 +48,13 @@ THREE.ArrowHelper.prototype.constructor = THREE.ArrowHelper;
 THREE.ArrowHelper.prototype.setDirection = function( dir ) {
 
     var axis = new THREE.Vector3( 0, 1, 0 ).crossSelf( dir );
-    
+
     var radians = Math.acos( new THREE.Vector3( 0, 1, 0 ).dot( dir.clone().normalize() ) );
-    
+
     this.matrix = new THREE.Matrix4().setRotationAxis( axis.normalize(), radians );
-            
+
     this.rotation.getRotationFromMatrix( this.matrix, this.scale );
-    
+
 };
 
 THREE.ArrowHelper.prototype.setLength = function( length ) {
@@ -51,10 +65,7 @@ THREE.ArrowHelper.prototype.setLength = function( length ) {
 
 THREE.ArrowHelper.prototype.setColor = function( hex ) {
 
-    this.children[0].material.color.setHex( hex );
-    this.children[1].material.color.setHex( hex );
+    this.line.material.color.setHex( hex );
+    this.cone.material.color.setHex( hex );
 
 };
-
-
-

utils/build.py

@@ -121,6 +121,7 @@ EXTRAS_FILES = [
 'extras/geometries/OctahedronGeometry.js',
 'extras/geometries/TetrahedronGeometry.js',
 'extras/helpers/AxisHelper.js',
+'extras/helpers/ArrowHelper.js',
 'extras/helpers/CameraHelper.js',
 'extras/modifiers/SubdivisionModifier.js',
 'extras/loaders/Loader.js',