Examples: Clean up

examples/js/loaders/sea3d/SEA3DLoader.js

@@ -1211,7 +1211,7 @@ THREE.SEA3D.Dummy = function ( width, height, depth ) {
 	this.height = height != undefined ? height : 100;
 	this.depth = depth != undefined ? depth : 100;
 
-	var geo = new THREE.BoxGeometry( this.width, this.height, this.depth, 1, 1, 1 );
+	var geo = new THREE.BoxBufferGeometry( this.width, this.height, this.depth, 1, 1, 1 );
 
 	geo.computeBoundingBox();
 	geo.computeBoundingSphere();

examples/webgl_interactive_cubes_gpu.html

@@ -38,7 +38,7 @@
 		<script src="../build/three.js"></script>
 
 		<script src="js/controls/TrackballControls.js"></script>
-
+		<script src="js/BufferGeometryUtils.js"></script>
 		<script src="js/libs/stats.min.js"></script>
 
 		<script>
@@ -46,7 +46,6 @@
 			var container, stats;
 			var camera, controls, scene, renderer;
 			var pickingData = [], pickingTexture, pickingScene;
-			var objects = [];
 			var highlightBox;
 
 			var mouse = new THREE.Vector2();
@@ -84,35 +83,35 @@
 				light.position.set( 0, 500, 2000 );
 				scene.add( light );
 
-				var geometry = new THREE.Geometry(),
-				pickingGeometry = new THREE.Geometry(),
-				pickingMaterial = new THREE.MeshBasicMaterial( { vertexColors: THREE.VertexColors } ),
-				defaultMaterial = new THREE.MeshPhongMaterial({ color: 0xffffff, flatShading: true, vertexColors: THREE.VertexColors, shininess: 0	} );
-
-				function applyVertexColors( g, c ) {
+				var pickingMaterial = new THREE.MeshBasicMaterial( { vertexColors: THREE.VertexColors } );
+				var defaultMaterial = new THREE.MeshPhongMaterial( { color: 0xffffff, flatShading: true, vertexColors: THREE.VertexColors, shininess: 0	} );
 
-					g.faces.forEach( function( f ) {
+				function applyVertexColors( geometry, color ) {
 
-						var n = ( f instanceof THREE.Face3 ) ? 3 : 4;
+					var position = geometry.attributes.position;
+					var colors = [];
 
-						for( var j = 0; j < n; j ++ ) {
+					for ( var i = 0; i < position.count; i ++ ) {
 
-							f.vertexColors[ j ] = c;
+						colors.push( color.r, color.g, color.b );
 
-						}
+					}
 
-					} );
+					geometry.addAttribute( 'color', new THREE.Float32BufferAttribute( colors, 3 ) );
 
 				}
 
-				var geom = new THREE.BoxGeometry( 1, 1, 1 );
-				var color = new THREE.Color();
+				var geometriesDrawn = [];
+				var geometriesPicking = [];
 
 				var matrix = new THREE.Matrix4();
 				var quaternion = new THREE.Quaternion();
+				var color = new THREE.Color();
 
 				for ( var i = 0; i < 5000; i ++ ) {
 
+					var geometry = new THREE.BoxBufferGeometry();
+
 					var position = new THREE.Vector3();
 					position.x = Math.random() * 10000 - 5000;
 					position.y = Math.random() * 6000 - 3000;
@@ -131,17 +130,21 @@
 					quaternion.setFromEuler( rotation, false );
 					matrix.compose( position, quaternion, scale );
 
-					// give the geom's vertices a random color, to be displayed
+					geometry.applyMatrix( matrix );
+
+					// give the geometry's vertices a random color, to be displayed
+
+					applyVertexColors( geometry, color.setHex( Math.random() * 0xffffff ) );
 
-					applyVertexColors( geom, color.setHex( Math.random() * 0xffffff ) );
+					geometriesDrawn.push( geometry );
 
-					geometry.merge( geom, matrix );
+					geometry = geometry.clone();
 
-					// give the geom's vertices a color corresponding to the "id"
+					// give the geometry's vertices a color corresponding to the "id"
 
-					applyVertexColors( geom, color.setHex( i ) );
+					applyVertexColors( geometry, color.setHex( i ) );
 
-					pickingGeometry.merge( geom, matrix );
+					geometriesPicking.push( geometry );
 
 					pickingData[ i ] = {
 
@@ -153,13 +156,13 @@
 
 				}
 
-				var drawnObject = new THREE.Mesh( geometry, defaultMaterial );
-				scene.add( drawnObject );
+				var objects = new THREE.Mesh( THREE.BufferGeometryUtils.mergeBufferGeometries( geometriesDrawn ), defaultMaterial );
+				scene.add( objects );
 
-				pickingScene.add( new THREE.Mesh( pickingGeometry, pickingMaterial ) );
+				pickingScene.add( new THREE.Mesh( THREE.BufferGeometryUtils.mergeBufferGeometries( geometriesPicking ), pickingMaterial ) );
 
 				highlightBox = new THREE.Mesh(
-					new THREE.BoxGeometry( 1, 1, 1 ),
+					new THREE.BoxBufferGeometry(),
 					new THREE.MeshLambertMaterial( { color: 0xffff00 }
 				) );
 				scene.add( highlightBox );
@@ -201,14 +204,16 @@
 				renderer.render( pickingScene, camera, pickingTexture );
 
 				//create buffer for reading single pixel
+
 				var pixelBuffer = new Uint8Array( 4 );
 
 				//read the pixel under the mouse from the texture
-				renderer.readRenderTargetPixels(pickingTexture, mouse.x, pickingTexture.height - mouse.y, 1, 1, pixelBuffer);
+
+				renderer.readRenderTargetPixels( pickingTexture, mouse.x, pickingTexture.height - mouse.y, 1, 1, pixelBuffer );
 
 				//interpret the pixel as an ID
 
-				var id = ( pixelBuffer[0] << 16 ) | ( pixelBuffer[1] << 8 ) | ( pixelBuffer[2] );
+				var id = ( pixelBuffer[ 0 ] << 16 ) | ( pixelBuffer[ 1 ] << 8 ) | ( pixelBuffer[ 2 ] );
 				var data = pickingData[ id ];
 
 				if ( data) {

examples/webgl_interactive_instances_gpu.html

@@ -949,12 +949,11 @@
 			// highlight box
 
 			highlightBox = new THREE.Mesh(
-				new THREE.BoxGeometry( 1, 1, 1 ),
+				new THREE.BoxBufferGeometry( 1, 1, 1 ),
 				new THREE.MeshLambertMaterial( {
 					emissive: 0xffff00,
 					transparent: true,
-					opacity: 0.5,
-					side: THREE.FrontSide
+					opacity: 0.5
 				} )
 			);
 

examples/webgl_materials.html

@@ -113,7 +113,7 @@
 				pointLight = new THREE.PointLight( 0xffffff, 1 );
 				scene.add( pointLight );
 
-				pointLight.add( new THREE.Mesh( new THREE.SphereGeometry( 4, 8, 8 ), new THREE.MeshBasicMaterial( { color: 0xffffff } ) ) );
+				pointLight.add( new THREE.Mesh( new THREE.SphereBufferGeometry( 4, 8, 8 ), new THREE.MeshBasicMaterial( { color: 0xffffff } ) ) );
 
 				//
 

examples/webgl_physics_convex_break.html

@@ -387,7 +387,7 @@
 				var ballMass = 35;
 				var ballRadius = 0.4;
 
-				var ball = new THREE.Mesh( new THREE.SphereGeometry( ballRadius, 14, 10 ), ballMaterial );
+				var ball = new THREE.Mesh( new THREE.SphereBufferGeometry( ballRadius, 14, 10 ), ballMaterial );
 				ball.castShadow = true;
 				ball.receiveShadow = true;
 				var ballShape = new Ammo.btSphereShape( ballRadius );

examples/webgl_physics_volume.html

@@ -185,8 +185,8 @@
 				sphereGeometry.translate( 5, 5, 0 );
 				createSoftVolume( sphereGeometry, volumeMass, 250 );
 
-				var boxGeometry = new THREE.BufferGeometry().fromGeometry( new THREE.BoxGeometry( 1, 1, 5, 4, 4, 20 ) );
-				boxGeometry.translate( -2, 5, 0 );
+				var boxGeometry = new THREE.BoxBufferGeometry( 1, 1, 5, 4, 4, 20 );
+				boxGeometry.translate( - 2, 5, 0 );
 				createSoftVolume( boxGeometry, volumeMass, 120 );
 
 				// Ramp
@@ -426,7 +426,7 @@
 					var ballMass = 3;
 					var ballRadius = 0.4;
 
-					var ball = new THREE.Mesh( new THREE.SphereGeometry( ballRadius, 18, 16 ), ballMaterial );
+					var ball = new THREE.Mesh( new THREE.SphereBufferGeometry( ballRadius, 18, 16 ), ballMaterial );
 					ball.castShadow = true;
 					ball.receiveShadow = true;
 					var ballShape = new Ammo.btSphereShape( ballRadius );