Fixed some more examples.

Examples still broken: webgl_geometry_subdivision, webgl_materials_video

examples/canvas_camera_orthographic.html

@@ -72,7 +72,7 @@
 				// Cubes
 
 				var geometry = new THREE.CubeGeometry( 50, 50, 50 );
-				var material = new THREE.MeshLambertMaterial( { color: 0xffffff, shading: THREE.FlatShading, overdraw: true } );
+				var material = new THREE.MeshLambertMaterial( { color: 0xffffff, shading: THREE.FlatShading, overdraw: 0.5 } );
 
 				for ( var i = 0; i < 100; i ++ ) {
 

examples/canvas_camera_orthographic2.html

@@ -139,7 +139,7 @@
 				// Cubes
 
 				var geometry = new THREE.CubeGeometry( 50, 50, 50 );
-				var material = new THREE.MeshLambertMaterial( { color: 0xffffff, shading: THREE.FlatShading, overdraw: true } );
+				var material = new THREE.MeshLambertMaterial( { color: 0xffffff, shading: THREE.FlatShading, overdraw: 0.5 } );
 
 				for ( var i = 0; i < 100; i ++ ) {
 

examples/canvas_geometry_cube.html

@@ -70,7 +70,7 @@
 
 				}
 
-				var material = new THREE.MeshBasicMaterial( { vertexColors: THREE.FaceColors } );
+				var material = new THREE.MeshBasicMaterial( { vertexColors: THREE.FaceColors, overdraw: 0.5 } );
 
 				cube = new THREE.Mesh( geometry, material );
 				cube.position.y = 150;
@@ -81,7 +81,7 @@
 				var geometry = new THREE.PlaneGeometry( 200, 200 );
 				geometry.applyMatrix( new THREE.Matrix4().makeRotationX( - Math.PI / 2 ) );
 
-				var material = new THREE.MeshBasicMaterial( { color: 0xe0e0e0 } );
+				var material = new THREE.MeshBasicMaterial( { color: 0xe0e0e0, overdraw: 0.5 } );
 
 				plane = new THREE.Mesh( geometry, material );
 				scene.add( plane );

examples/canvas_geometry_hierarchy.html

@@ -49,7 +49,7 @@
 				scene = new THREE.Scene();
 
 				var geometry = new THREE.CubeGeometry( 100, 100, 100 );
-				var material = new THREE.MeshNormalMaterial();
+				var material = new THREE.MeshNormalMaterial( { overdraw: 0.5 } );
 
 				group = new THREE.Object3D();
 

examples/index.html

@@ -341,6 +341,7 @@
 
 			window.location.hash = file;
 			viewer.src = file + '.html';
+			viewer.focus();
 
 		};
 

examples/webgl_geometry_minecraft.html

@@ -94,32 +94,33 @@
 
 				var pxGeometry = new THREE.PlaneGeometry( 100, 100 );
 				pxGeometry.faceVertexUvs[ 0 ][ 0 ][ 0 ].y = 0.5;
-				pxGeometry.faceVertexUvs[ 0 ][ 0 ][ 3 ].y = 0.5;
+				pxGeometry.faceVertexUvs[ 0 ][ 1 ][ 2 ].y = 0.5;
 				pxGeometry.applyMatrix( matrix.makeRotationY( Math.PI / 2 ) );
 				pxGeometry.applyMatrix( matrix.makeTranslation( 50, 0, 0 ) );
 
 				var nxGeometry = new THREE.PlaneGeometry( 100, 100 );
 				nxGeometry.faceVertexUvs[ 0 ][ 0 ][ 0 ].y = 0.5;
-				nxGeometry.faceVertexUvs[ 0 ][ 0 ][ 3 ].y = 0.5;
+				nxGeometry.faceVertexUvs[ 0 ][ 1 ][ 2 ].y = 0.5;
 				nxGeometry.applyMatrix( matrix.makeRotationY( - Math.PI / 2 ) );
 				nxGeometry.applyMatrix( matrix.makeTranslation( - 50, 0, 0 ) );
 
 				var pyGeometry = new THREE.PlaneGeometry( 100, 100 );
 				pyGeometry.faceVertexUvs[ 0 ][ 0 ][ 1 ].y = 0.5;
-				pyGeometry.faceVertexUvs[ 0 ][ 0 ][ 2 ].y = 0.5;
+				pyGeometry.faceVertexUvs[ 0 ][ 1 ][ 1 ].y = 0.5;
 				pyGeometry.applyMatrix( matrix.makeRotationX( - Math.PI / 2 ) );
 				pyGeometry.applyMatrix( matrix.makeTranslation( 0, 50, 0 ) );
 
 				var pzGeometry = new THREE.PlaneGeometry( 100, 100 );
 				pzGeometry.faceVertexUvs[ 0 ][ 0 ][ 0 ].y = 0.5;
-				pzGeometry.faceVertexUvs[ 0 ][ 0 ][ 3 ].y = 0.5;
+				pzGeometry.faceVertexUvs[ 0 ][ 1 ][ 2 ].y = 0.5;
 				pzGeometry.applyMatrix( matrix.makeTranslation( 0, 0, 50 ) );
 
 				var nzGeometry = new THREE.PlaneGeometry( 100, 100 );
 				nzGeometry.faceVertexUvs[ 0 ][ 0 ][ 0 ].y = 0.5;
-				nzGeometry.faceVertexUvs[ 0 ][ 0 ][ 3 ].y = 0.5;
+				nzGeometry.faceVertexUvs[ 0 ][ 1 ][ 2 ].y = 0.5;
 				nzGeometry.applyMatrix( matrix.makeRotationY( Math.PI ) );
 				nzGeometry.applyMatrix( matrix.makeTranslation( 0, 0, -50 ) );
+
 				//
 
 				var geometry = new THREE.Geometry();

examples/webgl_geometry_minecraft_ao.html

@@ -96,53 +96,59 @@
 				scene.fog = new THREE.FogExp2( 0xffffff, 0.00015 );
 
 				// sides
-
+				
 				var light = new THREE.Color( 0xffffff );
 				var shadow = new THREE.Color( 0x505050 );
 
 				var matrix = new THREE.Matrix4();
 
 				var pxGeometry = new THREE.PlaneGeometry( 100, 100 );
-				pxGeometry.faces[ 0 ].vertexColors = [ light, shadow, shadow, light ];
+				pxGeometry.faces[ 0 ].vertexColors.push( light, shadow, light );
+				pxGeometry.faces[ 1 ].vertexColors.push( shadow, shadow, light );
 				pxGeometry.faceVertexUvs[ 0 ][ 0 ][ 0 ].y = 0.5;
-				pxGeometry.faceVertexUvs[ 0 ][ 0 ][ 3 ].y = 0.5;
+				pxGeometry.faceVertexUvs[ 0 ][ 1 ][ 2 ].y = 0.5;
 				pxGeometry.applyMatrix( matrix.makeRotationY( Math.PI / 2 ) );
 				pxGeometry.applyMatrix( matrix.makeTranslation( 50, 0, 0 ) );
 
 				var nxGeometry = new THREE.PlaneGeometry( 100, 100 );
-				nxGeometry.faces[ 0 ].vertexColors = [ light, shadow, shadow, light ];
+				nxGeometry.faces[ 0 ].vertexColors.push( light, shadow, light );
+				nxGeometry.faces[ 1 ].vertexColors.push( shadow, shadow, light );
 				nxGeometry.faceVertexUvs[ 0 ][ 0 ][ 0 ].y = 0.5;
-				nxGeometry.faceVertexUvs[ 0 ][ 0 ][ 3 ].y = 0.5;
+				nxGeometry.faceVertexUvs[ 0 ][ 1 ][ 2 ].y = 0.5;
 				nxGeometry.applyMatrix( matrix.makeRotationY( - Math.PI / 2 ) );
 				nxGeometry.applyMatrix( matrix.makeTranslation( - 50, 0, 0 ) );
 
 				var pyGeometry = new THREE.PlaneGeometry( 100, 100 );
-				pyGeometry.faces[ 0 ].vertexColors = [ light, light, light, light ];
+				pyGeometry.faces[ 0 ].vertexColors.push( light, light, light );
+				pyGeometry.faces[ 1 ].vertexColors.push( light, light, light );
 				pyGeometry.faceVertexUvs[ 0 ][ 0 ][ 1 ].y = 0.5;
-				pyGeometry.faceVertexUvs[ 0 ][ 0 ][ 2 ].y = 0.5;
+				pyGeometry.faceVertexUvs[ 0 ][ 1 ][ 1 ].y = 0.5;
 				pyGeometry.applyMatrix( matrix.makeRotationX( - Math.PI / 2 ) );
 				pyGeometry.applyMatrix( matrix.makeTranslation( 0, 50, 0 ) );
 
 				var py2Geometry = new THREE.PlaneGeometry( 100, 100 );
-				py2Geometry.faces[ 0 ].vertexColors = [ light, light, light, light ];
+				py2Geometry.faces[ 0 ].vertexColors.push( light, light, light );
+				py2Geometry.faces[ 1 ].vertexColors.push( light, light, light );
 				py2Geometry.faceVertexUvs[ 0 ][ 0 ][ 1 ].y = 0.5;
-				py2Geometry.faceVertexUvs[ 0 ][ 0 ][ 2 ].y = 0.5;
+				py2Geometry.faceVertexUvs[ 0 ][ 1 ][ 1 ].y = 0.5;
 				py2Geometry.applyMatrix( matrix.makeRotationX( - Math.PI / 2 ) );
 				py2Geometry.applyMatrix( matrix.makeRotationY( Math.PI / 2 ) );
 				py2Geometry.applyMatrix( matrix.makeTranslation( 0, 50, 0 ) );
 
 				var pzGeometry = new THREE.PlaneGeometry( 100, 100 );
-				pzGeometry.faces[ 0 ].vertexColors = [ light, shadow, shadow, light ];
+				pzGeometry.faces[ 0 ].vertexColors.push( light, shadow, light );
+				pzGeometry.faces[ 1 ].vertexColors.push( shadow, shadow, light );
 				pzGeometry.faceVertexUvs[ 0 ][ 0 ][ 0 ].y = 0.5;
-				pzGeometry.faceVertexUvs[ 0 ][ 0 ][ 3 ].y = 0.5;
+				pzGeometry.faceVertexUvs[ 0 ][ 1 ][ 2 ].y = 0.5;
 				pzGeometry.applyMatrix( matrix.makeTranslation( 0, 0, 50 ) );
 
 				var nzGeometry = new THREE.PlaneGeometry( 100, 100 );
-				nzGeometry.faces[ 0 ].vertexColors = [ light, shadow, shadow, light ];
+				nzGeometry.faces[ 0 ].vertexColors.push( light, shadow, light );
+				nzGeometry.faces[ 1 ].vertexColors.push( shadow, shadow, light );
 				nzGeometry.faceVertexUvs[ 0 ][ 0 ][ 0 ].y = 0.5;
-				nzGeometry.faceVertexUvs[ 0 ][ 0 ][ 3 ].y = 0.5;
+				nzGeometry.faceVertexUvs[ 0 ][ 1 ][ 2 ].y = 0.5;
 				nzGeometry.applyMatrix( matrix.makeRotationY( Math.PI ) );
-				nzGeometry.applyMatrix( matrix.makeTranslation( 0, 0, -50 ) );
+				nzGeometry.applyMatrix( matrix.makeTranslation( 0, 0, - 50 ) );
 
 				//
 
@@ -179,10 +185,14 @@
 							dummy.geometry = py2Geometry;
 
 							var colors = dummy.geometry.faces[ 0 ].vertexColors;
-							colors[ 3 ] = a === 0 ? shadow : light;
 							colors[ 0 ] = b === 0 ? shadow : light;
 							colors[ 1 ] = c === 0 ? shadow : light;
-							colors[ 2 ] = d === 0 ? shadow : light;
+							colors[ 2 ] = a === 0 ? shadow : light;
+
+							var colors = dummy.geometry.faces[ 1 ].vertexColors;
+							colors[ 0 ] = c === 0 ? shadow : light;
+							colors[ 1 ] = d === 0 ? shadow : light;
+							colors[ 2 ] = a === 0 ? shadow : light;
 
 						} else {
 
@@ -191,8 +201,12 @@
 							var colors = dummy.geometry.faces[ 0 ].vertexColors;
 							colors[ 0 ] = a === 0 ? shadow : light;
 							colors[ 1 ] = b === 0 ? shadow : light;
-							colors[ 2 ] = c === 0 ? shadow : light;
-							colors[ 3 ] = d === 0 ? shadow : light;
+							colors[ 2 ] = d === 0 ? shadow : light;
+
+							var colors = dummy.geometry.faces[ 1 ].vertexColors;
+							colors[ 0 ] = b === 0 ? shadow : light;
+							colors[ 1 ] = c === 0 ? shadow : light;
+							colors[ 2 ] = d === 0 ? shadow : light;
 
 						}
 
@@ -204,7 +218,10 @@
 
 							var colors = dummy.geometry.faces[ 0 ].vertexColors;
 							colors[ 0 ] = pxpz > px && x > 0 ? shadow : light;
-							colors[ 3 ] = pxnz > px && x > 0 ? shadow : light;
+							colors[ 2 ] = pxnz > px && x > 0 ? shadow : light;
+
+							var colors = dummy.geometry.faces[ 1 ].vertexColors;
+							colors[ 2 ] = pxnz > px && x > 0 ? shadow : light;
 
 							THREE.GeometryUtils.merge( geometry, dummy );
 
@@ -216,7 +233,10 @@
 
 							var colors = dummy.geometry.faces[ 0 ].vertexColors;
 							colors[ 0 ] = nxnz > nx && x < worldWidth - 1 ? shadow : light;
-							colors[ 3 ] = nxpz > nx && x < worldWidth - 1 ? shadow : light;
+							colors[ 2 ] = nxpz > nx && x < worldWidth - 1 ? shadow : light;
+
+							var colors = dummy.geometry.faces[ 1 ].vertexColors;
+							colors[ 2 ] = nxpz > nx && x < worldWidth - 1 ? shadow : light;
 
 							THREE.GeometryUtils.merge( geometry, dummy );
 
@@ -228,7 +248,10 @@
 
 							var colors = dummy.geometry.faces[ 0 ].vertexColors;
 							colors[ 0 ] = nxpz > pz && z < worldDepth - 1 ? shadow : light;
-							colors[ 3 ] = pxpz > pz && z < worldDepth - 1 ? shadow : light;
+							colors[ 2 ] = pxpz > pz && z < worldDepth - 1 ? shadow : light;
+
+							var colors = dummy.geometry.faces[ 1 ].vertexColors;
+							colors[ 2 ] = pxpz > pz && z < worldDepth - 1 ? shadow : light;
 
 							THREE.GeometryUtils.merge( geometry, dummy );
 
@@ -240,7 +263,10 @@
 
 							var colors = dummy.geometry.faces[ 0 ].vertexColors;
 							colors[ 0 ] = pxnz > nz && z > 0 ? shadow : light;
-							colors[ 3 ] = nxnz > nz && z > 0 ? shadow : light;
+							colors[ 2 ] = nxnz > nz && z > 0 ? shadow : light;
+
+							var colors = dummy.geometry.faces[ 1 ].vertexColors;
+							colors[ 2 ] = nxnz > nz && z > 0 ? shadow : light;
 
 							THREE.GeometryUtils.merge( geometry, dummy );
 

examples/webgl_geometry_minecraft_oculusrift.html

@@ -95,30 +95,30 @@
 
 				var pxGeometry = new THREE.PlaneGeometry( 100, 100 );
 				pxGeometry.faceVertexUvs[ 0 ][ 0 ][ 0 ].y = 0.5;
-				pxGeometry.faceVertexUvs[ 0 ][ 0 ][ 3 ].y = 0.5;
+				pxGeometry.faceVertexUvs[ 0 ][ 1 ][ 2 ].y = 0.5;
 				pxGeometry.applyMatrix( matrix.makeRotationY( Math.PI / 2 ) );
 				pxGeometry.applyMatrix( matrix.makeTranslation( 50, 0, 0 ) );
 
 				var nxGeometry = new THREE.PlaneGeometry( 100, 100 );
 				nxGeometry.faceVertexUvs[ 0 ][ 0 ][ 0 ].y = 0.5;
-				nxGeometry.faceVertexUvs[ 0 ][ 0 ][ 3 ].y = 0.5;
+				nxGeometry.faceVertexUvs[ 0 ][ 1 ][ 2 ].y = 0.5;
 				nxGeometry.applyMatrix( matrix.makeRotationY( - Math.PI / 2 ) );
 				nxGeometry.applyMatrix( matrix.makeTranslation( - 50, 0, 0 ) );
 
 				var pyGeometry = new THREE.PlaneGeometry( 100, 100 );
 				pyGeometry.faceVertexUvs[ 0 ][ 0 ][ 1 ].y = 0.5;
-				pyGeometry.faceVertexUvs[ 0 ][ 0 ][ 2 ].y = 0.5;
+				pyGeometry.faceVertexUvs[ 0 ][ 1 ][ 1 ].y = 0.5;
 				pyGeometry.applyMatrix( matrix.makeRotationX( - Math.PI / 2 ) );
 				pyGeometry.applyMatrix( matrix.makeTranslation( 0, 50, 0 ) );
 
 				var pzGeometry = new THREE.PlaneGeometry( 100, 100 );
 				pzGeometry.faceVertexUvs[ 0 ][ 0 ][ 0 ].y = 0.5;
-				pzGeometry.faceVertexUvs[ 0 ][ 0 ][ 3 ].y = 0.5;
+				pzGeometry.faceVertexUvs[ 0 ][ 1 ][ 2 ].y = 0.5;
 				pzGeometry.applyMatrix( matrix.makeTranslation( 0, 0, 50 ) );
 
 				var nzGeometry = new THREE.PlaneGeometry( 100, 100 );
 				nzGeometry.faceVertexUvs[ 0 ][ 0 ][ 0 ].y = 0.5;
-				nzGeometry.faceVertexUvs[ 0 ][ 0 ][ 3 ].y = 0.5;
+				nzGeometry.faceVertexUvs[ 0 ][ 1 ][ 2 ].y = 0.5;
 				nzGeometry.applyMatrix( matrix.makeRotationY( Math.PI ) );
 				nzGeometry.applyMatrix( matrix.makeTranslation( 0, 0, -50 ) );
 				//

examples/webgl_interactive_voxelpainter.html

@@ -78,8 +78,29 @@
 
 				// grid
 
-				plane = new THREE.Mesh( new THREE.PlaneGeometry( 1000, 1000, 20, 20 ), new THREE.MeshBasicMaterial( { color: 0x555555, wireframe: true } ) );
+				var size = 500, step = 50;
+
+				var geometry = new THREE.Geometry();
+
+				for ( var i = - size; i <= size; i += step ) {
+
+					geometry.vertices.push( new THREE.Vector3( - size, 0, i ) );
+					geometry.vertices.push( new THREE.Vector3(   size, 0, i ) );
+
+					geometry.vertices.push( new THREE.Vector3( i, 0, - size ) );
+					geometry.vertices.push( new THREE.Vector3( i, 0,   size ) );
+
+				}
+
+				var material = new THREE.LineBasicMaterial( { color: 0x000000, opacity: 0.2 } );
+
+				var line = new THREE.Line( geometry, material );
+				line.type = THREE.LinePieces;
+				scene.add( line );
+
+				plane = new THREE.Mesh( new THREE.PlaneGeometry( 1000, 1000 ), new THREE.MeshBasicMaterial() );
 				plane.rotation.x = - Math.PI / 2;
+				plane.visible = false;
 				scene.add( plane );
 
 				mouse2D = new THREE.Vector3( 0, 10000, 0.5 );

examples/webgl_materials_video.html

@@ -137,6 +137,7 @@
 					oy = j;
 
 					geometry = new THREE.CubeGeometry( xsize, ysize, xsize );
+					
 					change_uvs( geometry, ux, uy, ox, oy );
 
 					materials[ cube_count ] = new THREE.MeshLambertMaterial( parameters );
@@ -206,16 +207,18 @@
 
 			function change_uvs( geometry, unitx, unity, offsetx, offsety ) {
 
-				var i, j, uv;
+				var faceVertexUvs = geometry.faceVertexUvs[ 0 ];
 
-				for ( i = 0; i < geometry.faceVertexUvs[ 0 ].length; i++ ) {
+				for ( var i = 0; i < faceVertexUvs.length; i ++ ) {
 
-					uv = geometry.faceVertexUvs[ 0 ][ i ];
+					var uvs = faceVertexUvs[ i ];
 
-					for ( j = 0; j < uv.length; j++ ) {
+					for ( var j = 0; j < uvs.length; j ++ ) {
 
-						uv[j].x = ( uv[j].x + offsetx ) * unitx;
-						uv[j].y = ( uv[j].y + offsety ) * unity;
+						var uv = uvs[ j ];
+
+						uv.x = ( uv.x + offsetx ) * unitx;
+						uv.y = ( uv.y + offsety ) * unity;
 
 					}
 

examples/webgl_postprocessing_dof2.html

@@ -47,7 +47,6 @@ Use WEBGL Depth buffer support?
 		<script src="js/libs/stats.min.js"></script>
 
 		<script src='js/libs/dat.gui.min.js'></script>
-		<script src="js/modifiers/SubdivisionModifier.js"></script>
 
 		<div id="info">
 
@@ -190,19 +189,8 @@ Use WEBGL Depth buffer support?
 				// Adding Monkeys
 
 				var loader2 = new THREE.JSONLoader();
-
-				var modifier = new THREE.SubdivisionModifier( 1 );
-
 				loader2.load( 'obj/Suzanne.js', function ( geometry ) {
 
-					var smooth = geometry;
-					smooth.mergeVertices();
-					modifier.modify( smooth );
-
-					smooth.computeCentroids();
-					smooth.computeFaceNormals();
-					smooth.computeVertexNormals();
-
 					var material = new THREE.MeshPhongMaterial( {
 						color: 0xffffff,
 						specular:0xffffff,
@@ -212,10 +200,10 @@ Use WEBGL Depth buffer support?
 						reflectivity: 1.0
 					});
 
-					var mesh;
-
 					var monkeys = 20;
+
 					for ( var i = 0; i < monkeys; i ++ ) {
+
 						var mesh = new THREE.Mesh( geometry, material );
 						mesh.scale.multiplyScalar(30);