Updated examples that could use PlaneBufferGeometry.

examples/canvas_ascii_effect.html

@@ -76,7 +76,7 @@
 
 				// Plane
 
-				plane = new THREE.Mesh( new THREE.PlaneGeometry( 400, 400 ), new THREE.MeshBasicMaterial( { color: 0xe0e0e0 } ) );
+				plane = new THREE.Mesh( new THREE.PlaneBufferGeometry( 400, 400 ), new THREE.MeshBasicMaterial( { color: 0xe0e0e0 } ) );
 				plane.position.y = - 200;
 				plane.rotation.x = - Math.PI / 2;
 				scene.add( plane );

examples/canvas_geometry_cube.html

@@ -81,7 +81,7 @@
 
 				// Plane
 
-				var geometry = new THREE.PlaneGeometry( 200, 200 );
+				var geometry = new THREE.PlaneBufferGeometry( 200, 200 );
 				geometry.applyMatrix( new THREE.Matrix4().makeRotationX( - Math.PI / 2 ) );
 
 				var material = new THREE.MeshBasicMaterial( { color: 0xe0e0e0, overdraw: 0.5 } );

examples/canvas_geometry_earth.html

@@ -103,7 +103,7 @@
 				var texture = new THREE.Texture( canvas );
 				texture.needsUpdate = true;
 
-				var geometry = new THREE.PlaneGeometry( 300, 300, 3, 3 );
+				var geometry = new THREE.PlaneBufferGeometry( 300, 300, 3, 3 );
 				var material = new THREE.MeshBasicMaterial( { map: texture, overdraw: 0.5 } );
 
 				var mesh = new THREE.Mesh( geometry, material );

examples/canvas_materials_depth.html

@@ -66,7 +66,7 @@
 
 				var material = new THREE.MeshDepthMaterial( { side: THREE.DoubleSide, overdraw: 0.5 } );
 
-				plane = new THREE.Mesh( new THREE.PlaneGeometry( 1000, 1000, 10, 10 ), material );
+				plane = new THREE.Mesh( new THREE.PlaneBufferGeometry( 1000, 1000, 10, 10 ), material );
 				plane.position.y = - 100;
 				plane.rotation.x = - Math.PI / 2;
 				scene.add( plane );

examples/canvas_materials_video.html

@@ -81,8 +81,6 @@
 				imageContext.fillRect( 0, 0, 480, 204 );
 
 				texture = new THREE.Texture( image );
-				texture.minFilter = THREE.LinearFilter;
-				texture.magFilter = THREE.LinearFilter;
 
 				var material = new THREE.MeshBasicMaterial( { map: texture, overdraw: 0.5 } );
 
@@ -99,8 +97,6 @@
 				imageReflectionGradient.addColorStop( 1, 'rgba(240, 240, 240, 0.8)' );
 
 				textureReflection = new THREE.Texture( imageReflection );
-				textureReflection.minFilter = THREE.LinearFilter;
-				textureReflection.magFilter = THREE.LinearFilter;
 
 				var materialReflection = new THREE.MeshBasicMaterial( { map: textureReflection, side: THREE.BackSide, overdraw: 0.5 } );
 

examples/js/Ocean.js

@@ -191,7 +191,7 @@
 	this.materialOcean.blending = 0;
 
 	// Create the simulation plane
-	this.screenQuad = new THREE.Mesh( new THREE.PlaneGeometry( 2, 2 ) );
+	this.screenQuad = new THREE.Mesh( new THREE.PlaneBufferGeometry( 2, 2 ) );
 	this.scene.add(this.screenQuad);
 
 	// Initialise spectrum data
@@ -324,4 +324,4 @@ THREE.Ocean.prototype.renderNormalMap = function () {
 	if (this.changed) this.materialNormal.uniforms.u_size.value = this.size;
 	this.materialNormal.uniforms.u_displacementMap.value = this.displacementMapFramebuffer;
 	this.renderer.render(this.scene, this.oceanCamera, this.normalMapFramebuffer, true);
-};
+};

examples/js/SimulationRenderer.js

@@ -43,7 +43,7 @@ function SimulationRenderer(WIDTH, renderer) {
 		fragmentShader: document.getElementById( 'fragmentShader' ).textContent
 	} );
 
-	var mesh = new THREE.Mesh( new THREE.PlaneGeometry( 2, 2 ), passThruShader );
+	var mesh = new THREE.Mesh( new THREE.PlaneBufferGeometry( 2, 2 ), passThruShader );
 
 	var positionShader = new THREE.ShaderMaterial( {
 
@@ -224,4 +224,4 @@ function SimulationRenderer(WIDTH, renderer) {
 
 	}
 
-}
+}

examples/js/crossfade/transition.js

@@ -83,9 +83,9 @@ function Transition ( sceneA, sceneB ) {
 
 		].join("\n")
 
-	});		
+	});
 
-	quadgeometry = new THREE.PlaneGeometry(window.innerWidth, window.innerHeight);
+	quadgeometry = new THREE.PlaneBufferGeometry(window.innerWidth, window.innerHeight);
 	
 	this.quad = new THREE.Mesh(quadgeometry, this.quadmaterial);
 	this.scene.add(this.quad);

examples/js/math/Lut.js

@@ -4,7 +4,7 @@
 
 THREE.Lut = function ( colormap, numberofcolors ) {
 
-	this.lut = new Array();
+	this.lut = [];
 	this.map = THREE.ColorMapKeywords[ colormap ];
 	this.n = numberofcolors;
 	this.mapname = colormap;
@@ -194,7 +194,7 @@ THREE.Lut.prototype = {
 		this.legend.ctx.putImageData( imageData, 0, 0 );
 		this.legend.texture.needsUpdate = true;
 
-		this.legend.legendGeometry = new THREE.PlaneGeometry( this.legend.dimensions.width , this.legend.dimensions.height );
+		this.legend.legendGeometry = new THREE.PlaneBufferGeometry( this.legend.dimensions.width , this.legend.dimensions.height );
 		this.legend.legendMaterial = new THREE.MeshBasicMaterial( { map : this.legend.texture, side : THREE.DoubleSide } );
 
 		this.legend.mesh = new THREE.Mesh( this.legend.legendGeometry, this.legend.legendMaterial );

examples/js/renderers/WebGLDeferredRenderer.js

@@ -61,7 +61,7 @@ THREE.WebGLDeferredRenderer = function ( parameters ) {
 	//
 
 	var geometryLightSphere = new THREE.SphereGeometry( 1, 16, 8 );
-	var geometryLightPlane = new THREE.PlaneGeometry( 2, 2 );
+	var geometryLightPlane = new THREE.PlaneBufferGeometry( 2, 2 );
 
 	var black = new THREE.Color( 0x000000 );
 

examples/misc_ubiquity_test.html

@@ -77,7 +77,7 @@
 
 				// PLANE
 
-				mesh = new THREE.Mesh( new THREE.PlaneGeometry( 100, 100 ), new THREE.MeshBasicMaterial( { color: Math.random() * 0xffffff, side: THREE.DoubleSide } ) );
+				mesh = new THREE.Mesh( new THREE.PlaneBufferGeometry( 100, 100 ), new THREE.MeshBasicMaterial( { color: Math.random() * 0xffffff, side: THREE.DoubleSide } ) );
 				mesh.position.y = -500;
 				mesh.scale.x = mesh.scale.y = mesh.scale.z = 2;
 				scene.add( mesh );

examples/software_geometry_earth.html

@@ -103,7 +103,7 @@
 				var texture = new THREE.Texture( canvas );
 				texture.needsUpdate = true;
 
-				var geometry = new THREE.PlaneGeometry( 300, 300, 3, 3 );
+				var geometry = new THREE.PlaneBufferGeometry( 300, 300, 3, 3 );
 				var material = new THREE.MeshBasicMaterial( { map: texture, overdraw: 0.5 } );
 
 				var mesh = new THREE.Mesh( geometry, material );

examples/svg_sandbox.html

@@ -70,7 +70,7 @@
 
 				// PLANE
 
-				mesh = new THREE.Mesh( new THREE.PlaneGeometry( 100, 100 ), new THREE.MeshBasicMaterial( { color: Math.random() * 0xffffff, side: THREE.DoubleSide } ) );
+				mesh = new THREE.Mesh( new THREE.PlaneBufferGeometry( 100, 100 ), new THREE.MeshBasicMaterial( { color: Math.random() * 0xffffff, side: THREE.DoubleSide } ) );
 				mesh.position.y = -500;
 				mesh.scale.x = mesh.scale.y = mesh.scale.z = 2;
 				scene.add( mesh );

examples/webgl_animation_cloth.html

@@ -233,7 +233,7 @@
 				
 				var groundMaterial = new THREE.MeshPhongMaterial( { color: 0xffffff, specular: 0x111111, map: groundTexture } );
 
-				var mesh = new THREE.Mesh( new THREE.PlaneGeometry( 20000, 20000 ), groundMaterial );
+				var mesh = new THREE.Mesh( new THREE.PlaneBufferGeometry( 20000, 20000 ), groundMaterial );
 				mesh.position.y = -250;
 				mesh.rotation.x = - Math.PI / 2;
 				mesh.receiveShadow = true;

examples/webgl_animation_skinning_morph.html

@@ -89,10 +89,10 @@
 
 				// GROUND
 
-				var groundMaterial = new THREE.MeshPhongMaterial( { emissive: 0xbbbbbb } );
-				var planeGeometry = new THREE.PlaneGeometry( 16000, 16000 );
+				var geometry = new THREE.PlaneBufferGeometry( 16000, 16000 );
+				var material = new THREE.MeshPhongMaterial( { emissive: 0xbbbbbb } );
 
-				var ground = new THREE.Mesh( planeGeometry, groundMaterial );
+				var ground = new THREE.Mesh( geometry, material );
 				ground.position.set( 0, FLOOR, 0 );
 				ground.rotation.x = -Math.PI/2;
 				scene.add( ground );

examples/webgl_geometry_colors.html

@@ -88,7 +88,7 @@
 				shadowTexture.needsUpdate = true;
 
 				var shadowMaterial = new THREE.MeshBasicMaterial( { map: shadowTexture } );
-				var shadowGeo = new THREE.PlaneGeometry( 300, 300, 1, 1 );
+				var shadowGeo = new THREE.PlaneBufferGeometry( 300, 300, 1, 1 );
 
 				mesh = new THREE.Mesh( shadowGeo, shadowMaterial );
 				mesh.position.y = - 250;

examples/webgl_geometry_extrude_shapes2.html

@@ -315,8 +315,6 @@ var addGeoObject = function( group, svgObject ) {
 };
 
 var init3d = function(){
-	var near = 1.0;
-	var far = 10000.0;
 
 	/// Global : renderer
 	renderer = new THREE.WebGLRenderer( { antialias: true } );
@@ -327,7 +325,7 @@ var init3d = function(){
 	scene = new THREE.Scene();
 
 	/// Global : camera
-	camera = new THREE.PerspectiveCamera( 50, window.innerWidth / window.innerHeight, near, far );
+	camera = new THREE.PerspectiveCamera( 50, window.innerWidth / window.innerHeight, 1, 1000 );
 	camera.position.set( 0, 0, 200 );
 
 	/// Global : group
@@ -344,11 +342,9 @@ var init3d = function(){
 	scene.add( ambientLight );
 
 	/// backgroup grids
-	var plane = new THREE.Mesh(
-			new THREE.PlaneGeometry(160, 160, 20, 20), 
-			new THREE.MeshBasicMaterial({ color: 0x7f7f7f, wireframe: true }));
-	plane.rotation.x = Math.PI;
-	group.add( plane );
+	var helper = new THREE.GridHelper( 80, 10 );
+	helper.rotation.x = Math.PI / 2;
+	group.add( helper );
 
 	var obj = initSVGObject();
 	addGeoObject( group, obj );

examples/webgl_geometry_text.html

@@ -235,7 +235,10 @@
 
 				createText();
 
-				var plane = new THREE.Mesh( new THREE.PlaneGeometry( 10000, 10000 ), new THREE.MeshBasicMaterial( { color: 0xffffff, opacity: 0.5, transparent: true } ) );
+				var plane = new THREE.Mesh(
+					new THREE.PlaneBufferGeometry( 10000, 10000 ),
+					new THREE.MeshBasicMaterial( { color: 0xffffff, opacity: 0.5, transparent: true } )
+				);
 				plane.position.y = 100;
 				plane.rotation.x = - Math.PI / 2;
 				scene.add( plane );

examples/webgl_geometry_text2.html

@@ -250,7 +250,10 @@
 
 				createText();
 
-				var plane = new THREE.Mesh( new THREE.PlaneGeometry( 10000, 10000 ), new THREE.MeshBasicMaterial( { color: 0xffffff, opacity: 0.5, transparent: true } ) );
+				var plane = new THREE.Mesh(
+					new THREE.PlaneBufferGeometry( 10000, 10000 ),
+					new THREE.MeshBasicMaterial( { color: 0xffffff, opacity: 0.5, transparent: true } )
+				);
 				plane.position.y = 100;
 				plane.rotation.x = - Math.PI / 2;
 				scene.add( plane );

examples/webgl_hdr.html

@@ -5,27 +5,27 @@
 		<meta charset="utf-8">
 		<meta name="viewport" content="width=device-width, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0">
 		<style>
-		    body {
-			color: #fff;
-			font-family:Monospace;
-			font-size:13px;
-			text-align:center;
-			font-weight: bold;
-
-			background-color: #000;
-			margin: 0px;
-			overflow: hidden;
-		    }
+			body {
+				color: #fff;
+				font-family:Monospace;
+				font-size:13px;
+				text-align:center;
+				font-weight: bold;
+
+				background-color: #000;
+				margin: 0px;
+				overflow: hidden;
+			}
 
-		    #info {
-			color:#fff;
-			position: absolute;
-			top: 0px; width: 100%;
-			padding: 5px;
+			#info {
+				color:#fff;
+				position: absolute;
+				top: 0px; width: 100%;
+				padding: 5px;
 
-		    }
+			}
 
-		    a { color: red; }
+			a { color: red; }
 
 		</style>
 	</head>
@@ -142,7 +142,7 @@
 
 				} );
 
-				var plane = new THREE.PlaneGeometry( 512, 768 );
+				var plane = new THREE.PlaneBufferGeometry( 512, 768 );
 
 				quad = new THREE.Mesh( plane, materialHDR );
 				quad.position.z = -100;

examples/webgl_interactive_draggablecubes.html

@@ -100,7 +100,10 @@
 
 				}
 
-				plane = new THREE.Mesh( new THREE.PlaneGeometry( 2000, 2000, 8, 8 ), new THREE.MeshBasicMaterial( { color: 0x000000, opacity: 0.25, transparent: true, wireframe: true } ) );
+				plane = new THREE.Mesh(
+					new THREE.PlaneBufferGeometry( 2000, 2000, 8, 8 ),
+					new THREE.MeshBasicMaterial( { color: 0x000000, opacity: 0.25, transparent: true } )
+				);
 				plane.visible = false;
 				scene.add( plane );
 

examples/webgl_lights_hemisphere.html

@@ -164,7 +164,7 @@
 
 				// GROUND
 
-				var groundGeo = new THREE.PlaneGeometry( 10000, 10000 );
+				var groundGeo = new THREE.PlaneBufferGeometry( 10000, 10000 );
 				var groundMat = new THREE.MeshPhongMaterial( { ambient: 0xffffff, color: 0xffffff, specular: 0x050505 } );
 				groundMat.color.setHSL( 0.095, 1, 0.75 );
 

examples/webgl_lights_pointlights2.html

@@ -133,7 +133,7 @@
 
 				// GROUND
 
-				var mesh = new THREE.Mesh( new THREE.PlaneGeometry( 800, 400, 2, 2 ), groundMaterial );
+				var mesh = new THREE.Mesh( new THREE.PlaneBufferGeometry( 800, 400, 2, 2 ), groundMaterial );
 				mesh.position.y = -5;
 				mesh.rotation.x = - Math.PI / 2;
 				scene.add( mesh );

examples/webgl_loader_gltf.html

@@ -201,7 +201,7 @@
 	                        ambient: 0x888888,
 	                        shading: THREE.SmoothShading,
 	                    });
-	                ground = new THREE.Mesh( new THREE.PlaneGeometry(1024, 1024), groundMaterial);
+	                ground = new THREE.Mesh( new THREE.PlaneBufferGeometry(1024, 1024), groundMaterial);
 
 	                if (sceneInfo.shadows) {
 		                ground.receiveShadow = true;

examples/webgl_loader_json_objconverter.html

@@ -105,7 +105,7 @@
 				xm.map.needsUpdate = true;
 				xm.map.repeat.set( 10, 10 );
 
-				geometry = new THREE.PlaneGeometry( 100, 100, 15, 10 );
+				geometry = new THREE.PlaneBufferGeometry( 100, 100, 15, 10 );
 
 				mesh = new THREE.Mesh( geometry, xm );
 				mesh.position.set( 0, FLOOR, 0 );
@@ -230,7 +230,7 @@
 
 					// material
 
-					mesh = new THREE.Mesh( new THREE.PlaneGeometry( size, size ), materials[i] );
+					mesh = new THREE.Mesh( new THREE.PlaneBufferGeometry( size, size ), materials[i] );
 					mesh.position.x = i * (size + 5) - ( ( materials.length - 1 )* ( size + 5 )/2);
 					mesh.position.y = FLOOR + size/2 + bottom;
 					mesh.position.z = -100;
@@ -250,7 +250,7 @@
 					var xm = new THREE.MeshBasicMaterial( { map: new THREE.Texture( x ), transparent: true } );
 					xm.map.needsUpdate = true;
 
-					mesh = new THREE.Mesh( new THREE.PlaneGeometry( size, size ), xm );
+					mesh = new THREE.Mesh( new THREE.PlaneBufferGeometry( size, size ), xm );
 					mesh.position.x = i * ( size + 5 ) - ( ( materials.length - 1 )* ( size + 5 )/2);
 					mesh.position.y = FLOOR + size/2 + bottom;
 					mesh.position.z = -99;

examples/webgl_loader_ply.html

@@ -76,7 +76,10 @@
 
 				// Ground
 
-				var plane = new THREE.Mesh( new THREE.PlaneGeometry( 40, 40 ), new THREE.MeshPhongMaterial( { ambient: 0x999999, color: 0x999999, specular: 0x101010 } ) );
+				var plane = new THREE.Mesh(
+					new THREE.PlaneBufferGeometry( 40, 40 ),
+					new THREE.MeshPhongMaterial( { ambient: 0x999999, color: 0x999999, specular: 0x101010 } )
+				);
 				plane.rotation.x = -Math.PI/2;
 				plane.position.y = -0.5;
 				scene.add( plane );

examples/webgl_loader_stl.html

@@ -76,7 +76,10 @@
 
 				// Ground
 
-				var plane = new THREE.Mesh( new THREE.PlaneGeometry( 40, 40 ), new THREE.MeshPhongMaterial( { ambient: 0x999999, color: 0x999999, specular: 0x101010 } ) );
+				var plane = new THREE.Mesh(
+					new THREE.PlaneBufferGeometry( 40, 40 ),
+					new THREE.MeshPhongMaterial( { ambient: 0x999999, color: 0x999999, specular: 0x101010 } )
+				);
 				plane.rotation.x = -Math.PI/2;
 				plane.position.y = -0.5;
 				scene.add( plane );

examples/webgl_materials_blending.html

@@ -66,7 +66,7 @@
 
 				var materialBg = new THREE.MeshBasicMaterial( { map: mapBg } );
 
-				var meshBg = new THREE.Mesh( new THREE.PlaneGeometry( 4000, 2000 ), materialBg );
+				var meshBg = new THREE.Mesh( new THREE.PlaneBufferGeometry( 4000, 2000 ), materialBg );
 				meshBg.position.set( 0, 0, -1 );
 				scene.add( meshBg );
 
@@ -80,8 +80,8 @@
 				var map3 = THREE.ImageUtils.loadTexture( 'textures/lensflare/lensflare0.png' );
 				var map4 = THREE.ImageUtils.loadTexture( 'textures/lensflare/lensflare0_alpha.png' );
 
-				var geo1 = new THREE.PlaneGeometry( 100, 100 );
-				var geo2 = new THREE.PlaneGeometry( 100, 25 );
+				var geo1 = new THREE.PlaneBufferGeometry( 100, 100 );
+				var geo2 = new THREE.PlaneBufferGeometry( 100, 25 );
 
 				addImageRow( map0, 300 );
 				addImageRow( map1, 150 );

examples/webgl_materials_blending_custom.html

@@ -78,9 +78,6 @@
 
 			if ( ! Detector.webgl ) Detector.addGetWebGLMessage();
 
-			var SCREEN_WIDTH = window.innerWidth - 215;
-			var SCREEN_HEIGHT = window.innerHeight;
-
 			var camera, scene, renderer;
 
 			var materialBg;
@@ -99,7 +96,7 @@
 
 				// CAMERA
 
-				camera = new THREE.PerspectiveCamera( 70, SCREEN_WIDTH / SCREEN_HEIGHT, 1, 1000 );
+				camera = new THREE.PerspectiveCamera( 70, window.innerWidth / window.innerHeight, 1, 1000 );
 				camera.position.z = 700;
 
 				// SCENE
@@ -175,7 +172,7 @@
 
 				materialBg = new THREE.MeshBasicMaterial( { map: mapBg1 } );
 
-				var meshBg = new THREE.Mesh( new THREE.PlaneGeometry( 4000, 2000 ), materialBg );
+				var meshBg = new THREE.Mesh( new THREE.PlaneBufferGeometry( 4000, 2000 ), materialBg );
 				meshBg.position.set( 0, 0, -1 );
 				scene.add( meshBg );
 
@@ -210,8 +207,8 @@
 				var src = [ "ZeroFactor", "OneFactor", "SrcAlphaFactor", "OneMinusSrcAlphaFactor", "DstAlphaFactor", "OneMinusDstAlphaFactor", "DstColorFactor", "OneMinusDstColorFactor", "SrcAlphaSaturateFactor" ];
 				var dst = [ "ZeroFactor", "OneFactor", "SrcColorFactor", "OneMinusSrcColorFactor", "SrcAlphaFactor", "OneMinusSrcAlphaFactor", "DstAlphaFactor", "OneMinusDstAlphaFactor" ];
 
-				var geo1 = new THREE.PlaneGeometry( 100, 100 );
-				var geo2 = new THREE.PlaneGeometry( 100, 25 );
+				var geo1 = new THREE.PlaneBufferGeometry( 100, 100 );
+				var geo2 = new THREE.PlaneBufferGeometry( 100, 25 );
 
 				var blending = "CustomBlending";
 
@@ -282,7 +279,7 @@
 				// RENDERER
 
 				renderer = new THREE.WebGLRenderer();
-				renderer.setSize( SCREEN_WIDTH, SCREEN_HEIGHT );
+				renderer.setSize( window.innerWidth, window.innerHeight );
 
 				renderer.domElement.style.position = "absolute";
 				renderer.domElement.style.left = "215px";
@@ -393,12 +390,9 @@
 
 			function onWindowResize( event ) {
 
-				SCREEN_WIDTH = window.innerWidth;
-				SCREEN_HEIGHT = window.innerHeight;
-
-				renderer.setSize( SCREEN_WIDTH, SCREEN_HEIGHT );
+				renderer.setSize( window.innerWidth, window.innerHeight );
 
-				camera.aspect = SCREEN_WIDTH / SCREEN_HEIGHT;
+				camera.aspect = window.innerWidth / window.innerHeight;
 				camera.updateProjectionMatrix();
 
 			}
@@ -418,7 +412,7 @@
 				//xc.shadowColor = "#000";
 				//xc.shadowBlur = 3;
 				xc.fillStyle = "white";
-				xc.font = "10pt arial bold";
+				xc.font = "12pt arial bold";
 				xc.fillText( text, 8, 22 );
 
 				var map = new THREE.Texture( x );

examples/webgl_materials_grass.html

@@ -38,7 +38,7 @@
 
 				scene = new THREE.Scene();
 
-				var geometry = new THREE.PlaneGeometry( 100, 100 );
+				var geometry = new THREE.PlaneBufferGeometry( 100, 100 );
 
 				var texture = new THREE.Texture( generateTexture() );
 				texture.needsUpdate = true;

examples/webgl_materials_texture_anisotropy.html

@@ -139,7 +139,7 @@
 
 				//
 
-				var geometry = new THREE.PlaneGeometry( 100, 100 );
+				var geometry = new THREE.PlaneBufferGeometry( 100, 100 );
 
 				var mesh1 = new THREE.Mesh( geometry, material1 );
 				mesh1.rotation.x = - Math.PI / 2;

examples/webgl_materials_texture_filters.html

@@ -126,7 +126,7 @@
 				textureCanvas2.needsUpdate = true;
 				textureCanvas2.repeat.set( 1000, 1000 );
 
-				var geometry = new THREE.PlaneGeometry( 100, 100 );
+				var geometry = new THREE.PlaneBufferGeometry( 100, 100 );
 
 				var meshCanvas = new THREE.Mesh( geometry, materialCanvas );
 				meshCanvas.rotation.x = - Math.PI / 2;
@@ -149,7 +149,7 @@
 					scene.add( meshCanvas );
 					scene2.add( meshCanvas2 );
 
-					var geometry = new THREE.PlaneGeometry( 100, 100 );
+					var geometry = new THREE.PlaneBufferGeometry( 100, 100 );
 					var mesh = new THREE.Mesh( geometry, materialPainting );
 					var mesh2 = new THREE.Mesh( geometry, materialPainting2 );
 

examples/webgl_materials_texture_manualmipmap.html

@@ -140,7 +140,7 @@
 				textureCanvas2.needsUpdate = true;
 				materialCanvas2 = new THREE.MeshBasicMaterial( { color: 0xffccaa, map: textureCanvas2 } );
 
-				var geometry = new THREE.PlaneGeometry( 100, 100 );
+				var geometry = new THREE.PlaneBufferGeometry( 100, 100 );
 
 				var meshCanvas1 = new THREE.Mesh( geometry, materialCanvas1 );
 				meshCanvas1.rotation.x = -Math.PI / 2;
@@ -163,7 +163,7 @@
 					scene1.add( meshCanvas1 );
 					scene2.add( meshCanvas2 );
 
-					var geometry = new THREE.PlaneGeometry( 100, 100 );
+					var geometry = new THREE.PlaneBufferGeometry( 100, 100 );
 					var mesh1 = new THREE.Mesh( geometry, materialPainting1 );
 					var mesh2 = new THREE.Mesh( geometry, materialPainting2 );
 

examples/webgl_mirror.html

@@ -83,9 +83,9 @@
 
 			function fillScene() {
 
-				var planeGeo = new THREE.PlaneGeometry( 100.1, 100.1 );
+				var planeGeo = new THREE.PlaneBufferGeometry( 100.1, 100.1 );
 				
-			   //MIRORR planes
+				// MIRORR planes
 				groundMirror = new THREE.Mirror( renderer, camera, { clipBias: 0.003, textureWidth: WIDTH, textureHeight: HEIGHT, color: 0x777777 } );
 				
 				var mirrorMesh = new THREE.Mesh( planeGeo, groundMirror.material );
@@ -95,7 +95,7 @@
 
 				verticalMirror = new THREE.Mirror( renderer, camera, { clipBias: 0.003, textureWidth: WIDTH, textureHeight: HEIGHT, color:0x889999 } );
 				
-				var verticalMirrorMesh = new THREE.Mesh( new THREE.PlaneGeometry( 60, 60 ), verticalMirror.material );
+				var verticalMirrorMesh = new THREE.Mesh( new THREE.PlaneBufferGeometry( 60, 60 ), verticalMirror.material );
 				verticalMirrorMesh.add( verticalMirror );
 				verticalMirrorMesh.position.y = 35;
 				verticalMirrorMesh.position.z = -45;

examples/webgl_morphtargets_md2.html

@@ -5,7 +5,7 @@
 		<meta charset="utf-8">
 		<meta name="viewport" content="width=device-width, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0">
 		<style>
-		    body {
+			body {
 				color: #fff;
 				font-family:Monospace;
 				font-size:13px;
@@ -15,9 +15,9 @@
 				background-color: #000;
 				margin: 0px;
 				overflow: hidden;
-		    }
+			}
 
-		    #info {
+			#info {
 				color:#fff;
 				position: relative;
 				margin: 0 auto -2.1em;
@@ -26,9 +26,9 @@
 
 				padding: 5px;
 				z-index:100;
-		    }
+			}
 
-		    a { color: skyblue; }
+			a { color: skyblue; }
 
 			#stats { position: absolute; top:0; left: 0 }
 			#stats #fps { background: transparent !important }
@@ -123,7 +123,7 @@
 				//  GROUND
 
 				var gt = THREE.ImageUtils.loadTexture( "textures/terrain/grasslight-big.jpg" );
-				var gg = new THREE.PlaneGeometry( 2000, 2000 );
+				var gg = new THREE.PlaneBufferGeometry( 2000, 2000 );
 				var gm = new THREE.MeshPhongMaterial( { color: 0xffffff, map: gt } );
 
 				var ground = new THREE.Mesh( gg, gm );

examples/webgl_morphtargets_md2_control.html

@@ -5,29 +5,29 @@
 		<meta charset="utf-8">
 		<meta name="viewport" content="width=device-width, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0">
 		<style>
-		    body {
-			color: #000;
-			font-family:Monospace;
-			font-size:13px;
-			text-align:center;
-			font-weight: bold;
-
-			background-color: #fff;
-			margin: 0px;
-			overflow: hidden;
-		    }
-
-		    #info {
-			color:#000;
-			position: relative;
-			margin: 0 auto -2.1em;
-			top: 0px;
-
-			padding: 5px;
-			z-index:100;
-		    }
-
-		    a { color: skyblue; }
+			body {
+				color: #000;
+				font-family:Monospace;
+				font-size:13px;
+				text-align:center;
+				font-weight: bold;
+
+				background-color: #fff;
+				margin: 0px;
+				overflow: hidden;
+			}
+
+			#info {
+				color:#000;
+				position: relative;
+				margin: 0 auto -2.1em;
+				top: 0px;
+
+				padding: 5px;
+				z-index:100;
+			}
+
+			a { color: skyblue; }
 
 			#stats { position: absolute; top:0; left: 0 }
 			#stats #fps { background: transparent !important }
@@ -124,7 +124,7 @@
 				//  GROUND
 
 				var gt = THREE.ImageUtils.loadTexture( "textures/terrain/grasslight-big.jpg" );
-				var gg = new THREE.PlaneGeometry( 16000, 16000 );
+				var gg = new THREE.PlaneBufferGeometry( 16000, 16000 );
 				var gm = new THREE.MeshPhongMaterial( { color: 0xffffff, map: gt } );
 
 				var ground = new THREE.Mesh( gg, gm );

examples/webgl_multiple_canvases_circle.html

@@ -240,7 +240,7 @@
 					shadowTexture.needsUpdate = true;
 
 					var shadowMaterial = new THREE.MeshBasicMaterial( { map: shadowTexture } );
-					var shadowGeo = new THREE.PlaneGeometry( 300, 300, 1, 1 );
+					var shadowGeo = new THREE.PlaneBufferGeometry( 300, 300, 1, 1 );
 
 					for ( var i = 0; i < noof_balls; i ++ ) { // create shadows
 

examples/webgl_multiple_canvases_complex.html

@@ -148,7 +148,7 @@
 					shadowTexture.needsUpdate = true;
 
 					var shadowMaterial = new THREE.MeshBasicMaterial( { map: shadowTexture } );
-					var shadowGeo = new THREE.PlaneGeometry( 300, 300, 1, 1 );
+					var shadowGeo = new THREE.PlaneBufferGeometry( 300, 300, 1, 1 );
 
 					mesh = new THREE.Mesh( shadowGeo, shadowMaterial );
 					mesh.position.y = - 250;

examples/webgl_multiple_canvases_grid.html

@@ -164,7 +164,7 @@
 					shadowTexture.needsUpdate = true;
 
 					var shadowMaterial = new THREE.MeshBasicMaterial( { map: shadowTexture } );
-					var shadowGeo = new THREE.PlaneGeometry( 300, 300, 1, 1 );
+					var shadowGeo = new THREE.PlaneBufferGeometry( 300, 300, 1, 1 );
 
 					mesh = new THREE.Mesh( shadowGeo, shadowMaterial );
 					mesh.position.y = - 250;

examples/webgl_multiple_views.html

@@ -145,7 +145,7 @@
 				shadowTexture.needsUpdate = true;
 
 				var shadowMaterial = new THREE.MeshBasicMaterial( { map: shadowTexture, transparent: true } );
-				var shadowGeo = new THREE.PlaneGeometry( 300, 300, 1, 1 );
+				var shadowGeo = new THREE.PlaneBufferGeometry( 300, 300, 1, 1 );
 
 				mesh = new THREE.Mesh( shadowGeo, shadowMaterial );
 				mesh.position.y = - 250;

examples/webgl_particles_dynamic.html

@@ -75,8 +75,6 @@
 
 			var aloader, bloader;
 
-			var total = 0, totaln = 0;
-
 			var composer, effectFocus;
 
 			var clock = new THREE.Clock();
@@ -152,14 +150,11 @@
 				parent = new THREE.Object3D();
 				scene.add( parent );
 
-				var grid = new THREE.PointCloud( new THREE.PlaneGeometry( 15000, 15000, 64, 64 ), new THREE.PointCloudMaterial( { color: 0xff0000, size: 10 } ) );
+				var grid = new THREE.PointCloud( new THREE.PlaneBufferGeometry( 15000, 15000, 64, 64 ), new THREE.PointCloudMaterial( { color: 0xff0000, size: 10 } ) );
 				grid.position.y = -400;
 				grid.rotation.x = - Math.PI / 2;
 				parent.add( grid );
 
-				totaln += 1;
-				total += grid.geometry.vertices.length;
-
 				// postprocessing
 
 				var renderModel = new THREE.RenderPass( scene, camera );
@@ -258,9 +253,6 @@
 
 					}
 
-					totaln += clones.length;
-					total += clones.length * vl;
-
 				} else {
 
 					mesh = new THREE.PointCloud( geometry, new THREE.PointCloudMaterial( { size: 3, color: color } ) );
@@ -272,9 +264,6 @@
 
 					parent.add( mesh );
 
-					totaln += 1;
-					total += vl;
-
 				}
 
 				bloader.statusDomElement.style.display = "none";

examples/webgl_postprocessing_advanced.html

@@ -5,30 +5,30 @@
 		<meta charset="utf-8">
 		<meta name="viewport" content="width=device-width, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0">
 		<style>
-		    body {
-			color: #000;
-			font-family:Monospace;
-			font-size:13px;
-			text-align:center;
-			font-weight: bold;
-
-			background-color: #000;
-			margin: 0px;
-			overflow: hidden;
-		    }
-
-		    #info {
-			color:#fff;
-			background-color: rgba( 0, 0, 0, 0.5 );
-			position: relative;
-			margin: 0 auto -2.1em;
-			top: 0px;
-			width: 550px;
-			padding: 5px;
-			z-index:100;
-		    }
-
-		    a { color: red; }
+			body {
+				color: #000;
+				font-family:Monospace;
+				font-size:13px;
+				text-align:center;
+				font-weight: bold;
+
+				background-color: #000;
+				margin: 0px;
+				overflow: hidden;
+			}
+
+			#info {
+				color:#fff;
+				background-color: rgba( 0, 0, 0, 0.5 );
+				position: relative;
+				margin: 0 auto -2.1em;
+				top: 0px;
+				width: 550px;
+				padding: 5px;
+				z-index:100;
+			}
+
+			a { color: red; }
 		</style>
 	</head>
 	<body>
@@ -117,9 +117,12 @@
 
 				//
 
-				var materialColor = new THREE.MeshBasicMaterial( { map: THREE.ImageUtils.loadTexture( "textures/cube/SwedishRoyalCastle/pz.jpg" ), depthTest: false } );
+				var materialColor = new THREE.MeshBasicMaterial( {
+					map: THREE.ImageUtils.loadTexture( "textures/cube/SwedishRoyalCastle/pz.jpg" ),
+					depthTest: false
+				} );
 
-				quadBG = new THREE.Mesh( new THREE.PlaneGeometry( 1, 1 ), materialColor );
+				quadBG = new THREE.Mesh( new THREE.PlaneBufferGeometry( 1, 1 ), materialColor );
 				quadBG.position.z = -500;
 				quadBG.scale.set( width, height, 1 );
 				sceneBG.add( quadBG );
@@ -128,7 +131,7 @@
 
 				var sceneMask = new THREE.Scene();
 
-				quadMask = new THREE.Mesh( new THREE.PlaneGeometry( 1, 1 ), new THREE.MeshBasicMaterial( { color: 0xffaa00 } )  );
+				quadMask = new THREE.Mesh( new THREE.PlaneBufferGeometry( 1, 1 ), new THREE.MeshBasicMaterial( { color: 0xffaa00 } )  );
 				quadMask.position.z = -300;
 				quadMask.scale.set( width / 2, height / 2, 1 );
 				sceneMask.add( quadMask );

examples/webgl_postprocessing_godrays.html

@@ -250,7 +250,10 @@
 
 				postprocessing.godrayCombineUniforms.fGodRayIntensity.value = 0.75;
 
-				postprocessing.quad = new THREE.Mesh( new THREE.PlaneGeometry( window.innerWidth, window.innerHeight ), postprocessing.materialGodraysGenerate );
+				postprocessing.quad = new THREE.Mesh(
+					new THREE.PlaneBufferGeometry( window.innerWidth, window.innerHeight ),
+					postprocessing.materialGodraysGenerate
+				);
 				postprocessing.quad.position.z = -9900;
 				postprocessing.scene.add( postprocessing.quad );
 

examples/webgl_rtt.html

@@ -147,7 +147,7 @@
 
 				} );
 
-				var plane = new THREE.PlaneGeometry( window.innerWidth, window.innerHeight );
+				var plane = new THREE.PlaneBufferGeometry( window.innerWidth, window.innerHeight );
 
 				quad = new THREE.Mesh( plane, material );
 				quad.position.z = -100;

examples/webgl_shader.html

@@ -108,7 +108,7 @@
 
 				scene = new THREE.Scene();
 
-				var geometry = new THREE.PlaneGeometry( 2, 2 );
+				var geometry = new THREE.PlaneBufferGeometry( 2, 2 );
 
 				uniforms = {
 					time: { type: "f", value: 1.0 },

examples/webgl_shaders_ocean.html

@@ -110,10 +110,9 @@
 
 
 				mirrorMesh = new THREE.Mesh(
-					new THREE.PlaneGeometry( parameters.width * 500, parameters.height * 500, 50, 50 ), 
+					new THREE.PlaneBufferGeometry( parameters.width * 500, parameters.height * 500 ),
 					water.material
 				);
-				
 
 				mirrorMesh.add( water );
 				mirrorMesh.rotation.x = - Math.PI * 0.5;

examples/webgl_shading_physical.html

@@ -5,7 +5,7 @@
 		<meta charset="utf-8">
 		<meta name="viewport" content="width=device-width, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0">
 		<style>
-		    body {
+			body {
 				color: #fff;
 				font-family: Monospace;
 				font-size: 13px;
@@ -15,18 +15,18 @@
 				background-color: #000;
 				margin: 0px;
 				overflow: hidden;
-		    }
+			}
 
-		    #info {
+			#info {
 				position: relative;
 				margin: 0 auto -2.1em;
 				top: 0px;
 				width: 550px;
 				padding: 5px;
 				z-index:100;
-		    }
+			}
 
-		    a { color: skyblue; }
+			a { color: skyblue; }
 
 			#stats #fps { background: transparent !important }
 			#stats #fps #fpsText { color: #444 !important }
@@ -181,9 +181,15 @@
 
 				// GROUND
 
-				var groundMaterial = new THREE.MeshPhongMaterial( { shininess: 80, ambient: 0x444444, color: 0xffffff, specular: 0xffffff, map: textureSquares } );
+				var groundMaterial = new THREE.MeshPhongMaterial( {
+					shininess: 80,
+					ambient: 0x444444,
+					color: 0xffffff,
+					specular: 0xffffff,
+					map: textureSquares
+				} );
 
-				var planeGeometry = new THREE.PlaneGeometry( 100, 100 );
+				var planeGeometry = new THREE.PlaneBufferGeometry( 100, 100 );
 
 				var ground = new THREE.Mesh( planeGeometry, groundMaterial );
 				ground.position.set( 0, 0, 0 );

examples/webgl_shadowmap.html

@@ -191,7 +191,7 @@
 
 				}
 
-			};
+			}
 
 			function createHUD() {
 
@@ -205,13 +205,17 @@
 
 				uniforms.tDiffuse.value = light.shadowMap;
 
-				var hudMaterial = new THREE.ShaderMaterial( { vertexShader: shader.vertexShader, fragmentShader: shader.fragmentShader, uniforms: uniforms } );
+				var hudMaterial = new THREE.ShaderMaterial( {
+					uniforms: uniforms,
+					vertexShader: shader.vertexShader,
+					fragmentShader: shader.fragmentShader
+				} );
 
 				var hudHeight = 2 / 3;
 
 				var hudWidth = hudHeight * SHADOW_MAP_WIDTH / SHADOW_MAP_HEIGHT;
 
-				var hudGeo = new THREE.PlaneGeometry( hudWidth, hudHeight );
+				var hudGeo = new THREE.PlaneBufferGeometry( hudWidth, hudHeight );
 				hudGeo.applyMatrix( new THREE.Matrix4().makeTranslation( hudWidth / 2, hudHeight / 2, 0 ) );
 
 				hudMesh = new THREE.Mesh( hudGeo, hudMaterial );
@@ -230,7 +234,7 @@
 
 				// GROUND
 
-				var geometry = new THREE.PlaneGeometry( 100, 100 );
+				var geometry = new THREE.PlaneBufferGeometry( 100, 100 );
 				var planeMaterial = new THREE.MeshPhongMaterial( { color: 0xffdd99 } );
 				planeMaterial.ambient = planeMaterial.color;
 

examples/webgl_shadowmap_performance.html

@@ -57,8 +57,6 @@
 
 			var NEAR = 5, FAR = 3000;
 
-			var sceneHUD, cameraOrtho, hudMaterial;
-
 			var morph, morphs = [];
 
 			var light;
@@ -122,7 +120,6 @@
 
 				scene.add( light );
 
-				createHUD();
 				createScene();
 
 				// RENDERER
@@ -167,34 +164,11 @@
 
 			}
 
-			function createHUD() {
-
-				cameraOrtho = new THREE.OrthographicCamera( SCREEN_WIDTH / - 2, SCREEN_WIDTH / 2,  SCREEN_HEIGHT / 2, SCREEN_HEIGHT / - 2, -10, 1000 );
-				cameraOrtho.position.z = 10;
-
-				var shader = THREE.UnpackDepthRGBAShader;
-				var uniforms = new THREE.UniformsUtils.clone( shader.uniforms );
-
-				hudMaterial = new THREE.ShaderMaterial( { vertexShader: shader.vertexShader, fragmentShader: shader.fragmentShader, uniforms: uniforms } );
-
-				var hudGeo = new THREE.PlaneGeometry( SHADOW_MAP_WIDTH / 2, SHADOW_MAP_HEIGHT / 2 );
-				var hudMesh = new THREE.Mesh( hudGeo, hudMaterial );
-				hudMesh.position.x = ( SCREEN_WIDTH - SHADOW_MAP_WIDTH / 2 ) * -0.5;
-				hudMesh.position.y = ( SCREEN_HEIGHT - SHADOW_MAP_HEIGHT / 2 ) * -0.5;
-				hudMesh.rotation.x = Math.PI / 2;
-
-				sceneHUD = new THREE.Scene();
-				sceneHUD.add( hudMesh );
-
-				cameraOrtho.lookAt( sceneHUD.position );
-
-			}
-
 			function createScene( ) {
 
 				// GROUND
 
-				var geometry = new THREE.PlaneGeometry( 100, 100 );
+				var geometry = new THREE.PlaneBufferGeometry( 100, 100 );
 				var planeMaterial = new THREE.MeshPhongMaterial( { color: 0xffdd99 } );
 				planeMaterial.ambient = planeMaterial.color;
 
@@ -414,11 +388,6 @@
 				renderer.clear();
 				renderer.render( scene, camera );
 
-				// Render debug HUD with shadow map
-
-				//hudMaterial.uniforms.tDiffuse.texture = light.shadowMap;
-				//renderer.render( sceneHUD, cameraOrtho );
-
 			}
 
 		</script>

examples/webgl_skinning_simple.html

@@ -52,7 +52,7 @@
 				container.appendChild(stats.domElement);
 
 				groundMaterial = new THREE.MeshPhongMaterial( { emissive: 0xbbbbbb } );
-				planeGeometry = new THREE.PlaneGeometry( 16000, 16000 );
+				planeGeometry = new THREE.PlaneBufferGeometry( 16000, 16000 );
 				ground = new THREE.Mesh( planeGeometry, groundMaterial );
 				ground.position.set( 0, -5, 0 );
 				ground.rotation.x = -Math.PI/2;

examples/webgl_terrain_dynamic.html

@@ -410,7 +410,7 @@
 				}
 
 
-				var plane = new THREE.PlaneGeometry( SCREEN_WIDTH, SCREEN_HEIGHT );
+				var plane = new THREE.PlaneBufferGeometry( SCREEN_WIDTH, SCREEN_HEIGHT );
 
 				quadTarget = new THREE.Mesh( plane, new THREE.MeshBasicMaterial( { color: 0x000000 } ) );
 				quadTarget.position.z = -500;

examples/webgldeferred_animation.html

@@ -316,7 +316,8 @@
 				mapHeight3.anisotropy = 4;
 				mapHeight3.format = THREE.RGBFormat;
 
-				var geoPlane = new THREE.PlaneGeometry( 40, 20 );
+				var geoPlane = new THREE.PlaneBufferGeometry( 40, 20 );
+				
 				var matPlaneSide   = new THREE.MeshPhongMaterial( { color: 0x000000, specular: 0x222222, shininess: 75, bumpMap: mapHeight2, bumpScale: 0.5 } );
 				var matPlaneBottom = new THREE.MeshPhongMaterial( { color: 0x000000, specular: 0x222222, shininess: 75, bumpMap: mapHeight3, bumpScale: 0.5 } );
 				var matPlaneTop    = new THREE.MeshPhongMaterial( { color: 0x000000, specular: 0x222222, shininess: 75, bumpMap: mapHeight3, bumpScale: 1 } );

examples/webgldeferred_pointlights.html

@@ -291,7 +291,7 @@
 				mapHeight3.anisotropy = 4;
 				mapHeight3.format = THREE.RGBFormat;
 
-				var geoPlane = new THREE.PlaneGeometry( 40, 20 );
+				var geoPlane = new THREE.PlaneBufferGeometry( 40, 20 );
 
 				var matPlane  = new THREE.MeshPhongMaterial( { color: 0xffffff, specular: 0x111111, shininess:  50, bumpMap: mapHeight2, bumpScale: 0.5 } );
 				var matPlane2 = new THREE.MeshPhongMaterial( { color: 0x331919, specular: 0x111111, shininess:  50, bumpMap: mapHeight2, bumpScale: 1 } );