Home Explore Help
Sign In
javascript
/
three.js
mirror of https://github.com/tazdij/three.js.git
2
0
Fork 0
Files Issues 0 Wiki
Browse Source

Merge remote-tracking branch 'zz85/experimental' into dev

Mr.doob 14 years ago
parent
087b6090b0 1cdc3cd2b7
commit
3e3c203402
3 changed files with 213 additions and 417 deletions
Unified View Show Diff Stats
  1. 203 0
      examples/webgl_lod_text.html
  2. 1 55
      src/extras/geometries/ExtrudeGeometry.js
  3. 9 362
      src/extras/geometries/TextGeometry.js

+ 203 - 0
examples/webgl_lod_text.html
View File 

@@ -0,0 +1,203 @@
 
+<!DOCTYPE HTML>
 
+<html lang="en">
 
+	<head>
 
+		<title>three.js webgl - level-of-details</title>
 
+		<meta charset="utf-8">
 
+		<style type="text/css">
 
+			body {
 
+				background:#000;
 
+				color:#fff;
 
+				padding:0;
 
+				margin:0;
 
+				font-weight: bold;
 
+				overflow:hidden;
 
+			}
 
+
 
+			#info {
 
+				position: absolute;
 
+				top: 0px; width: 100%;
 
+				color: #ffffff;
 
+				padding: 5px;
 
+				font-family: Monospace;
 
+				font-size: 13px;
 
+				text-align: center;
 
+				z-index:100;
 
+			}
 
+
 
+			a { color:red }
 
+
 
+		</style>
 
+	</head>
 
+
 
+	<body>
 
+		<div id="info">
 
+			<a href="http://github.com/mrdoob/three.js" target="_blank">three.js</a> - level-of-details WebGL example
 
+		</div>
 
+
 
+
 
+		<script type="text/javascript" src="../build/Three.js"></script>
 
+
 
+		<script type="text/javascript" src="js/Detector.js"></script>
 
+		<script type="text/javascript" src="js/RequestAnimationFrame.js"></script>
 
+		<script type="text/javascript" src="js/Stats.js"></script>
 
+		
+		<!--
 
+		<script type="text/javascript" src="../src/extras/geometries/Curve.js"></script>
 
+		<script type="text/javascript" src="../src/extras/geometries/CurvePath.js"></script>
 
+		<script type="text/javascript" src="../src/extras/geometries/Path.js"></script>
 
+		<script type="text/javascript" src="../src/extras/geometries/Shape.js"></script>
 
+		<script type="text/javascript" src="../src/extras/geometries/TextPath.js"></script>		
+		<script type="text/javascript" src="../src/extras/geometries/ExtrudeGeometry.js"></script>
 
+		<script type="text/javascript" src="../src/extras/geometries/TextGeometry.js"></script>
 
+		-->
 
+
 
+
 
+		<!-- load the font file from canvas-text -->
 
+
 
+		<script type="text/javascript" src="fonts/helvetiker_regular.typeface.js"></script>
 
+
 
+		<script type="text/javascript">
 
+
 
+			if ( ! Detector.webgl ) Detector.addGetWebGLMessage();
 
+
 
+			var container, stats;
 
+
 
+			var camera, scene, renderer;
 
+
 
+			var geometry, objects;
 
+
 
+			var mouseX = 0, mouseY = 0;
 
+
 
+			var windowHalfX = window.innerWidth / 2;
 
+			var windowHalfY = window.innerHeight / 2;
 
+
 
+			document.addEventListener( 'mousemove', onDocumentMouseMove, false );
 
+
 
+			init();
 
+			animate();
 
+
 
+			function init() {
 
+
 
+				container = document.createElement( 'div' );
 
+				document.body.appendChild( container );
 
+
 
+				camera = new THREE.Camera( 45, window.innerWidth / window.innerHeight, 1, 15000 );
 
+				camera.position.z = 1000;
 
+
 
+				scene = new THREE.Scene();
 
+				scene.fog = new THREE.Fog( 0x000000, 1, 15000 );
 
+
 
+				var light = new THREE.PointLight( 0xff2200 );
 
+				light.position.set( 0, 0, 0 );
 
+				scene.addLight( light );
 
+
 
+				var light = new THREE.DirectionalLight( 0xffffff );
 
+				light.position.set( 0, 0, 1 );
 
+				light.position.normalize();
 
+				scene.addLight( light );
 
+
 
+				var wireMaterial = new THREE.MeshLambertMaterial( { color: 0x000000, wireframe: true } );
 
+				
+				function getOptionsWithSegments(x,b, bevel) {
 
+					return {
 
+
 
+						size: 80,
 
+						height: 20,
 
+						curveSegments: x,
 
+						font: "helvetiker",
 
+						bevelSegments: b,
 
+						bevelEnabled: bevel,
 
+						bevelThickness:8,
 
+						bevelSize: 3,
 
+						steps: 1, 
+						amount: 20,
 
+
 
+					};
 
+				};
 
+				
+				var theText = "&"; // Try $ :)
 
+				
+				// we could use TextPath and ExtrudeGeometry if we wish to optimize stuff futher
 
+				var geometry = [
 
+
 
+					[ new THREE.TextGeometry( theText, getOptionsWithSegments(8, 6, true)), 
+						300, [ new THREE.MeshPhongMaterial( { color: 0xffee00 } ), wireMaterial ] ],
 
+					[ new THREE.TextGeometry( theText, getOptionsWithSegments(5,2, true)), 
+						800, [ new THREE.MeshLambertMaterial( { color: 0xffaa00 } ), wireMaterial ]],
 
+					[ new THREE.TextGeometry( theText, getOptionsWithSegments(2,1, true)),
 
+						1000, [ new THREE.MeshLambertMaterial( { color: 0x005500 } ), wireMaterial ] ],
 
+					[ new THREE.TextGeometry( theText, getOptionsWithSegments(2,1,false)), 
+						2000, [ new THREE.MeshLambertMaterial( { color: 0x0055ff } ), wireMaterial ]],
 
+					[ new THREE.TextGeometry( theText, getOptionsWithSegments(1,1, false)),
 
+						10000, [ new THREE.MeshLambertMaterial( { color: 0xff1100 } ), wireMaterial ]]
 
+						
+				];
 
+
 
+				var i, j, mesh, lod;
 
+
 
+				for ( j = 0; j < 1000; j ++ ) {
 
+
 
+					lod = new THREE.LOD();
 
+
 
+					for ( i = 0; i < geometry.length; i++ ) {
 
+
 
+						mesh = new THREE.Mesh( geometry[ i ][ 0 ], geometry[ i ][ 2 ] );
 
+						mesh.scale.set( 1.5, 1.5, 1.5 );
 
+						mesh.updateMatrix();
 
+						mesh.matrixAutoUpdate = false;
 
+						lod.add( mesh, geometry[ i ][ 1 ] );
 
+
 
+					}
 
+
 
+					lod.position.x = 10000 * ( 0.5 - Math.random() );
 
+					lod.position.y =  7500 * ( 0.5 - Math.random() );
 
+					lod.position.z = 10000 * ( 0.5 - Math.random() );
 
+					lod.updateMatrix();
 
+					lod.matrixAutoUpdate = false;
 
+					scene.addObject( lod );
 
+
 
+				}
 
+
 
+
 
+
 
+				renderer = new THREE.WebGLRenderer( { clearColor:0x000000, clearAlpha: 1 } );
 
+				renderer.setSize( window.innerWidth, window.innerHeight );
 
+				renderer.sortObjects = false;
 
+				container.appendChild( renderer.domElement );
 
+
 
+			}
 
+
 
+			function onDocumentMouseMove(event) {
 
+
 
+				mouseX = ( event.clientX - windowHalfX ) * 10;
 
+				mouseY = ( event.clientY - windowHalfY ) * 10;
 
+
 
+			}
 
+
 
+			function animate() {
 
+
 
+				requestAnimationFrame( animate );
 
+				render();
 
+
 
+			}
 
+
 
+			function render() {
 
+
 
+				camera.position.x += ( mouseX - camera.position.x ) * .005;
 
+				camera.position.y += ( - mouseY - camera.position.y ) * .01;
 
+
 
+				renderer.render( scene, camera );
 
+
 
+			}
 
+
 
+			function log( text ) {
 
+
 
+				var e = document.getElementById("log");
 
+				e.innerHTML = text + "<br/>" + e.innerHTML;
 
+
 
+			}
 
+
 
+		</script>
 
+
 
+	</body>
 
+</html>

+ 1 - 55
src/extras/geometries/ExtrudeGeometry.js
View File 

@@ -182,57 +182,6 @@ THREE.ExtrudeGeometry.prototype.addShape = function( shape, options ) {
 
 
 
 	var i, il;
 
 	var i, il;
 
 
 
-	// We no longer need centroids
 
-
 
-	// Find all centroids of shapes and holes
 
-
 
-	//var sum = new THREE.Vector2();
 
-
 
-	// for ( i = 0, il = contour.length; i < il; i ++ ) {
 
-	//
 
-	// 	sum.addSelf( contour[ i ] );
 
-	//
 
-	// }
 
-	//
 
-	// var contourCentroid = sum.divideScalar( contour.length );
 
-	//
 
-	// var holesCentroids = [];
 
-	//
 
-	// for ( h = 0, hl = holes.length; h < hl; h ++ ) {
 
-	//
 
-	// 	sum = new THREE.Vector2();
 
-	// 	ahole = holes[ h ];
 
-	//
 
-	// 	for ( i=0, il = ahole.length; i < il; i ++ ) {
 
-	//
 
-	// 		sum.addSelf( ahole[ i ] );
 
-	//
 
-	// 	}
 
-	//
 
-	// 	holesCentroids[ h ] = sum.divideScalar( ahole.length );
 
-	//
 
-	// }
 
-	//
 
-	// function scalePt ( pt, centroid, size, expandOutwards /* Boolean */ ) {
 
-	//
 
-	// 	var vectorFromCentroid = pt.clone().subSelf( centroid );
 
-	// 	var adj = size / vectorFromCentroid.length();
 
-	//
 
-	// 	if ( expandOutwards ) {
 
-	//
 
-	// 		adj = 1 + adj;
 
-	//
 
-	// 	}  else {
 
-	//
 
-	// 		adj = 1 - adj;
 
-	//
 
-	// 	}
 
-	//
 
-	// 	return vectorFromCentroid.multiplyScalar( adj ).addSelf( centroid );
 
-	//
 
-	// }
 
-
 
-
 
 	function scalePt2 ( pt, vec, size ) {
 
 	function scalePt2 ( pt, vec, size ) {
 
 
 
 		if ( !vec ) console.log( "die" );
 
 		if ( !vec ) console.log( "die" );
 
@@ -361,8 +310,7 @@ THREE.ExtrudeGeometry.prototype.addShape = function( shape, options ) {
 
 		if ( s < 0 ) {
 
 		if ( s < 0 ) {
 
 
 
 			// in case of emergecy, revert to algorithm 1.
 
 			// in case of emergecy, revert to algorithm 1.
 
-			// console.log("opps");
 
-
 
+	
 			return getBevelVec1( pt_i, pt_j, pt_k );
 
 			return getBevelVec1( pt_i, pt_j, pt_k );
 
 
 
 		}
 
 		}
 
@@ -518,7 +466,6 @@ THREE.ExtrudeGeometry.prototype.addShape = function( shape, options ) {
 
 		for ( i = 0, il = contour.length; i < il; i ++ ) {
 
 		for ( i = 0, il = contour.length; i < il; i ++ ) {
 
 
 
 			vert = scalePt2( contour[ i ], contourMovements[ i ], bs );
 
 			vert = scalePt2( contour[ i ], contourMovements[ i ], bs );
 
-			//vert = scalePt( contour[ i ], contourCentroid, bs, false );
 
 			v( vert.x, vert.y,  amount + z );
 
 			v( vert.x, vert.y,  amount + z );
 
 
 
 		}
 
 		}
 
@@ -532,7 +479,6 @@ THREE.ExtrudeGeometry.prototype.addShape = function( shape, options ) {
 
 
 
 			for ( i = 0, il = ahole.length; i < il; i++ ) {
 
 			for ( i = 0, il = ahole.length; i < il; i++ ) {
 
 
 
-				//vert = scalePt( ahole[ i ], holesCentroids[h], bs, true );
 
 				vert = scalePt2( ahole[ i ], oneHoleMovements[ i ], bs );
 
 				vert = scalePt2( ahole[ i ], oneHoleMovements[ i ], bs );
 
 
 
 				if ( !extrudeByPath ) {
 
 				if ( !extrudeByPath ) {

+ 9 - 362
src/extras/geometries/TextGeometry.js
View File 

@@ -19,7 +19,8 @@
 
  *  bevelThickness: <float>, 		// how deep into text bevel goes
 
  *  bevelThickness: <float>, 		// how deep into text bevel goes
 
  *  bevelSize:		<float>, 		// how far from text outline is bevel
 
  *  bevelSize:		<float>, 		// how far from text outline is bevel
 
  *
 
  *
 
- *  bend:			<bool>			// bend according to hardcoded curve (for the moment)
 
+ *  bend:			<bool>			// bend according to hardcoded curve (generates bendPath)
 
+ *  bendPath:       <curve>         // wraps text according to bend Path
 
  *  }
 
  *  }
 
  *
 
  *
 
  * It uses techniques used in:
 
  * It uses techniques used in:
 
@@ -83,11 +84,14 @@ THREE.TextGeometry = function ( text, parameters ) {
 
 	// parameters.bendPath = path;
 
 	// parameters.bendPath = path;
 
 
 
 	// var path = new THREE.CurvePath();
 
 	// var path = new THREE.CurvePath();
 
-	// 	path.add(new THREE.LineCurve( 0, 0,  250, 0));
 
-	// 	path.add(new THREE.LineCurve( 250, 0,  300, 200));
 
-	//
 
+	// 	path.add(new THREE.LineCurve( 0, 50,  250, 150));
 
+	// 	path.add(new THREE.LineCurve( 250, 150,  400, 50));
 
+	// path.add(new THREE.LineCurve( 400, 50,  0, 50));
 
 	// 	parameters.bendPath = path;
 
 	// 	parameters.bendPath = path;
 
-
 
+	
+	// var path = new THREE.ArcCurve(0, 0, 200, Math.PI * 0, Math.PI * 2, true);
 
+	// 		parameters.bendPath = path;
 
+	
 	// var path = new THREE.SplineCurve([
 
 	// var path = new THREE.SplineCurve([
 
 	// 		new THREE.Vector2(0, 0),
 
 	// 		new THREE.Vector2(0, 0),
 
 	// 		new THREE.Vector2(100, 40),
 
 	// 		new THREE.Vector2(100, 40),
 
@@ -177,363 +181,6 @@ THREE.FontUtils = {
 
 
 
 	},
 
 	},
 
 
 
-/* LEGACY CODE
 
-
 
-	extractPoints : function( allPoints, charactersPoints ) {
 
-
 
-		// Quick exit
 
-
 
-		if ( allPoints.length < 3 ) {
 
-
 
-			//throw "not valid polygon";
 
-
 
-			console.log( "not valid polygon" );
 
-
 
-			return {
 
-
 
-				points: allPoints,
 
-				faces: []
 
-
 
-			};
 
-
 
-		}
 
-
 
-		// Try to split shapes and holes.
 
-
 
-		var p, point, shape,
 
-			all,
 
-			ch, singleCharPoints,
 
-			isolatedShapes = [];
 
-
 
-		// Use a quick hashmap for locating duplicates
 
-
 
-		for ( var c = 0; c < charactersPoints.length; c ++ ) {
 
-
 
-			singleCharPoints = charactersPoints[ c ];
 
-
 
-			all = [];
 
-
 
-			// Use a quick hashmap for locating duplicates
 
-
 
-			for ( var p = 0; p < singleCharPoints.length; p ++ ) {
 
-
 
-				point = singleCharPoints[ p ];
 
-				all.push( point.x + "," + point.y );
 
-
 
-			}
 
-
 
-			var firstIndex, firstPt, endPt, holes;
 
-
 
-			// We check the first loop whether its CW or CCW direction to determine
 
-			// whether its shapes or holes first
 
-
 
-			endPt = all.slice( 1 ).indexOf( all[ 0 ] );
 
-			var shapesFirst = this.Triangulate.area( singleCharPoints.slice( 0, endPt + 1 ) ) < 0;
 
-
 
-			//console.log( singleCharPoints.length, "shapesFirst", shapesFirst );
 
-
 
-			holes = [];
 
-			endPt = -1;
 
-
 
-			while ( endPt < all.length ) {
 
-
 
-				firstIndex = endPt + 1;
 
-				firstPt = all[ firstIndex ];
 
-				endPt = all.slice( firstIndex + 1 ).indexOf( firstPt ) + firstIndex;
 
-
 
-				if ( endPt <= firstIndex ) break;
 
-
 
-				var contours = singleCharPoints.slice( firstIndex, endPt + 1 );
 
-
 
-				if ( shapesFirst ) {
 
-
 
-					if ( this.Triangulate.area( contours ) < 0 ) {
 
-
 
-						// we got new isolated shape
 
-
 
-						if ( firstIndex > 0 ) {
 
-
 
-							isolatedShapes.push( { shape: shape, holes: holes } );
 
-
 
-						}
 
-
 
-						// Save the old shapes, then work on new additional separated shape
 
-
 
-						shape = contours;
 
-						holes = [];
 
-
 
-					} else {
 
-
 
-						holes.push( contours );
 
-
 
-					}
 
-
 
-				} else {
 
-
 
-					if ( this.Triangulate.area( contours ) < 0 ) {
 
-
 
-						isolatedShapes.push( { shape: contours, holes: holes } );
 
-						holes = [];
 
-
 
-					} else {
 
-
 
-						holes.push( contours );
 
-
 
-					}
 
-
 
-				}
 
-
 
-				endPt++;
 
-
 
-			}
 
-
 
-			if ( shapesFirst ) {
 
-
 
-				isolatedShapes.push( { shape: shape, holes: holes } );
 
-
 
-			}
 
-
 
-		}
 
-
 
-		//console.log("isolatedShapes", isolatedShapes);
 
-
 
-		// For each isolated shape, find the closest points and break to the hole to allow triangulation
 
-
 
-		// Find closest points between holes
 
-
 
-		// we could optimize with
 
-		// http://en.wikipedia.org/wiki/Proximity_problems
 
-		// http://en.wikipedia.org/wiki/Closest_pair_of_points
 
-		// http://stackoverflow.com/questions/1602164/shortest-distance-between-points-algorithm
 
-
 
-		var prevShapeVert, nextShapeVert,
 
-			prevHoleVert, nextHoleVert,
 
-			holeIndex, shapeIndex,
 
-			shapeId, shapeGroup,
 
-			h, h2,
 
-			hole, shortest, d,
 
-			p, pts1, pts2,
 
-			tmpShape1, tmpShape2,
 
-			tmpHole1, tmpHole2,
 
-			verts = [];
 
-
 
-		for ( shapeId = 0; shapeId < isolatedShapes.length; shapeId ++ ) {
 
-
 
-			shapeGroup = isolatedShapes[ shapeId ];
 
-
 
-			shape = shapeGroup.shape;
 
-			holes = shapeGroup.holes;
 
-
 
-			for ( h = 0; h < holes.length; h++ ) {
 
-
 
-				// we slice to each hole when neccessary
 
-
 
-				hole = holes[ h ];
 
-				shortest = Number.POSITIVE_INFINITY;
 
-
 
-				for ( h2 = 0; h2 < hole.length; h2++ ) {
 
-
 
-					pts1 = hole[ h2 ];
 
-
 
-					for ( p = 0; p < shape.length; p++ ) {
 
-
 
-						pts2 = shape[ p ];
 
-						d = pts1.distanceTo( pts2 );
 
-
 
-						if ( d < shortest ) {
 
-
 
-							shortest = d;
 
-							holeIndex = h2;
 
-							shapeIndex = p;
 
-
 
-						}
 
-
 
-					}
 
-
 
-				}
 
-
 
-				prevShapeVert = ( shapeIndex - 1 ) >= 0 ? shapeIndex - 1 : shape.length - 1;
 
-				nextShapeVert = ( shapeIndex + 1 ) < shape.length ? shapeIndex + 1 : 0;
 
-
 
-				prevHoleVert = ( holeIndex - 1 ) >= 0 ? holeIndex - 1 : hole.length - 1;
 
-				nextHoleVert = ( holeIndex + 1 ) < hole.length ? holeIndex + 1 : 0 ;
 
-
 
-				var areaapts = [];
 
-				areaapts.push( hole[ holeIndex ] );
 
-				areaapts.push( shape[ shapeIndex ] );
 
-				areaapts.push( shape[ prevShapeVert ] );
 
-
 
-				var areaa = this.Triangulate.area( areaapts );
 
-
 
-				var areabpts = [];
 
-				areabpts.push( hole[ holeIndex ] );
 
-				areabpts.push( hole[ prevHoleVert ] );
 
-				areabpts.push( shape[ shapeIndex ] );
 
-
 
-				var areab = this.Triangulate.area( areabpts );
 
-
 
-				var shapeOffset =1;
 
-				var holeOffset = -1;
 
-
 
-				var oldShapeIndex = shapeIndex, oldHoleIndex = holeIndex;
 
-				shapeIndex += shapeOffset;
 
-				holeIndex += holeOffset;
 
-
 
-				if ( shapeIndex < 0 ) { shapeIndex += shape.length;  }
 
-				shapeIndex %= shape.length;
 
-
 
-				if ( holeIndex < 0 ) { holeIndex += hole.length;  }
 
-				holeIndex %= shape.length;
 
-
 
-				prevShapeVert = ( shapeIndex - 1 ) >= 0 ? shapeIndex - 1 : shape.length - 1;
 
-				nextShapeVert = ( shapeIndex + 1 ) < shape.length ? shapeIndex + 1 : 0;
 
-
 
-				prevHoleVert = ( holeIndex - 1 ) >= 0 ? holeIndex - 1 : hole.length - 1;
 
-				nextHoleVert = ( holeIndex + 1 ) < hole.length ? holeIndex + 1 : 0 ;
 
-
 
-
 
-				areaapts = [];
 
-				areaapts.push( hole[ holeIndex ] );
 
-				areaapts.push( shape[ shapeIndex ] );
 
-				areaapts.push( shape[ prevShapeVert ] );
 
-
 
-				var areaa2 = this.Triangulate.area( areaapts );
 
-
 
-				areabpts = [];
 
-				areabpts.push( hole[ holeIndex ] );
 
-				areabpts.push( hole[ prevHoleVert ] );
 
-				areabpts.push( shape[ shapeIndex ] );
 
-
 
-				var areab2 = this.Triangulate.area( areabpts );
 
-
 
-				if ( ( areaa + areab ) > ( areaa2 + areab2 ) ) {
 
-
 
-					shapeIndex = oldShapeIndex;
 
-					holeIndex = oldHoleIndex ;
 
-
 
-					if ( shapeIndex < 0 ) { shapeIndex += shape.length;  }
 
-					shapeIndex %= shape.length;
 
-
 
-					if ( holeIndex < 0 ) { holeIndex += hole.length;  }
 
-					holeIndex %= shape.length;
 
-
 
-
 
-					prevShapeVert = ( shapeIndex - 1 ) >= 0 ? shapeIndex - 1 : shape.length - 1;
 
-					nextShapeVert = ( shapeIndex + 1 ) < shape.length ? shapeIndex + 1 : 0;
 
-
 
-					prevHoleVert = ( holeIndex - 1 ) >= 0 ? holeIndex - 1 : hole.length - 1;
 
-					nextHoleVert = ( holeIndex + 1 ) < hole.length ? holeIndex + 1 : 0 ;
 
-
 
-				}
 
-
 
-				tmpShape1 = shape.slice( 0, shapeIndex );
 
-				tmpShape2 = shape.slice( shapeIndex );
 
-				tmpHole1 = hole.slice( holeIndex );
 
-				tmpHole2 = hole.slice( 0, holeIndex );
 
-
 
-				verts.push( hole[ holeIndex ] );
 
-				verts.push( shape[ shapeIndex ] );
 
-				verts.push( shape[ prevShapeVert ] );
 
-
 
-				verts.push( hole[ holeIndex ] );
 
-				verts.push( hole[ prevHoleVert ] );
 
-				verts.push( shape[ shapeIndex ] );
 
-
 
-				shape = tmpShape1.concat( tmpHole1 ).concat( tmpHole2 ).concat( tmpShape2 );
 
-
 
-			}
 
-
 
-			shapeGroup.shape = shape;
 
-
 
-		}
 
-
 
-		var triangulatedPoints = [];
 
-		var triangulatedFaces = [];
 
-		var lastTriangles = 0;
 
-
 
-		for ( shapeId = 0; shapeId < isolatedShapes.length; shapeId ++ ) {
 
-
 
-			shapeGroup = isolatedShapes[ shapeId ];
 
-
 
-			shape = shapeGroup.shape;
 
-			triangulatedPoints = triangulatedPoints.concat( shape );
 
-
 
-			var triangles = THREE.FontUtils.Triangulate( shape, true );
 
-
 
-			// We need to offset vertex indices for faces
 
-
 
-			for ( var v = 0; v < triangles.length; v++ ) {
 
-
 
-				var face = triangles[ v ];
 
-
 
-				face[ 0 ] += lastTriangles;
 
-				face[ 1 ] += lastTriangles;
 
-				face[ 2 ] += lastTriangles;
 
-
 
-			}
 
-
 
-			triangulatedFaces = triangulatedFaces.concat( triangles );
 
-			lastTriangles += shape.length;
 
-
 
-		}
 
-
 
-
 
-		// Now we push the "cut" vertices back to the triangulated indices.
 
-
 
-		//console.log("we have verts.length",verts.length,verts);
 
-
 
-		var v, j, k, l, found, face;
 
-
 
-		for ( v = 0; v < verts.length / 3; v++ ) {
 
-
 
-			face = [];
 
-
 
-			for ( k = 0; k < 3; k++ ) {
 
-
 
-				found = false;
 
-
 
-				for ( j = 0; j < triangulatedPoints.length && !found; j++ ) {
 
-
 
-					l = v * 3 + k;
 
-
 
-					if ( triangulatedPoints[ j ].equals( verts[ l ] ) ) {
 
-
 
-						face.push( j );
 
-						found = true;
 
-
 
-					}
 
-
 
-				}
 
-
 
-				// you would not wish to reach this point of code, something went wrong
 
-
 
-				if ( !found ) {
 
-
 
-					triangulatedPoints.push( verts[ l ] );
 
-					face.push( triangulatedPoints.length - 1 );
 
-
 
-					console.log( "not found" )
 
-
 
-				}
 
-
 
-			}
 
-
 
-			triangulatedFaces.push( face );
 
-
 
-		}
 
-
 
-
 
-		//console.log( "triangles", triangulatedFaces.length, "points", triangulatedPoints );
 
-
 
-		return {
 
-
 
-			points: triangulatedPoints,
 
-			faces: triangulatedFaces
 
-
 
-		};
 
-
 
-	},*/
 
-
 
 	drawText : function( text ) {
 
 	drawText : function( text ) {
 
 
 
 		var characterPts = [], allPts = [];
 
 		var characterPts = [], allPts = [];