Examples: Replaced relevant Textures with CanvasTextures.

examples/canvas_geometry_earth.html

@@ -100,8 +100,7 @@
 				context.fillStyle = gradient;
 				context.fillRect( 0, 0, canvas.width, canvas.height );
 
-				var texture = new THREE.Texture( canvas );
-				texture.needsUpdate = true;
+				var texture = new THREE.CanvasTexture( canvas );
 
 				var geometry = new THREE.PlaneBufferGeometry( 300, 300, 3, 3 );
 				var material = new THREE.MeshBasicMaterial( { map: texture, overdraw: 0.5 } );

examples/canvas_geometry_terrain.html

@@ -69,9 +69,7 @@
 				scene = new THREE.Scene();
 
 				var data = generateHeight( 1024, 1024 );
-				var texture = new THREE.Texture( generateTexture( data, 1024, 1024 ) );
-				texture.needsUpdate = true;
-
+				var texture = new THREE.CanvasTexture( generateTexture( data, 1024, 1024 ) );
 				var material = new THREE.MeshBasicMaterial( { map: texture, overdraw: 0.5 } );
 
 				var quality = 16, step = 1024 / quality;

examples/js/math/Lut.js

@@ -327,9 +327,8 @@ THREE.Lut.prototype = {
 
 		contextTitle.fillText( this.legend.labels.title.toString() + this.legend.labels.um.toString(), borderThickness, this.legend.labels.fontsize + borderThickness );
 
-		var txtTitle = new THREE.Texture( canvasTitle );
+		var txtTitle = new THREE.CanvasTexture( canvasTitle );
 		txtTitle.minFilter = THREE.LinearFilter;
-		txtTitle.needsUpdate = true;
 
 		var spriteMaterialTitle = new THREE.SpriteMaterial( { map: txtTitle, useScreenCoordinates: false } );
 
@@ -408,9 +407,8 @@ THREE.Lut.prototype = {
 
 				contextTick.fillText( value.toString(), borderThickness, this.legend.labels.fontsize + borderThickness );
 
-				var txtTick = new THREE.Texture( canvasTick );
+				var txtTick = new THREE.CanvasTexture( canvasTick );
 				txtTick.minFilter = THREE.LinearFilter;
-				txtTick.needsUpdate = true;
 
 				var spriteMaterialTick = new THREE.SpriteMaterial( { map: txtTick, useScreenCoordinates: false } );
 

examples/software_geometry_earth.html

@@ -100,8 +100,7 @@
 				context.fillStyle = gradient;
 				context.fillRect( 0, 0, canvas.width, canvas.height );
 
-				var texture = new THREE.Texture( canvas );
-				texture.needsUpdate = true;
+				var texture = new THREE.CanvasTexture( canvas );
 
 				var geometry = new THREE.PlaneBufferGeometry( 300, 300, 3, 3 );
 				var material = new THREE.MeshBasicMaterial( { map: texture, overdraw: 0.5 } );

examples/webgl_geometry_terrain.html

@@ -92,8 +92,9 @@
 
 				}
 
-				texture = new THREE.Texture( generateTexture( data, worldWidth, worldDepth ), THREE.UVMapping, THREE.ClampToEdgeWrapping, THREE.ClampToEdgeWrapping );
-				texture.needsUpdate = true;
+				texture = new THREE.CanvasTexture( generateTexture( data, worldWidth, worldDepth ) );
+				texture.wrapS = THREE.ClampToEdgeWrapping;
+				texture.wrapT = THREE.ClampToEdgeWrapping;
 
 				mesh = new THREE.Mesh( geometry, new THREE.MeshBasicMaterial( { map: texture } ) );
 				scene.add( mesh );

examples/webgl_geometry_terrain_fog.html

@@ -94,8 +94,9 @@
 
 				}
 
-				texture = new THREE.Texture( generateTexture( data, worldWidth, worldDepth ), THREE.UVMapping, THREE.ClampToEdgeWrapping, THREE.ClampToEdgeWrapping );
-				texture.needsUpdate = true;
+				texture = new THREE.CanvasTexture( generateTexture( data, worldWidth, worldDepth ) );
+				texture.wrapS = THREE.ClampToEdgeWrapping;
+				texture.wrapT = THREE.ClampToEdgeWrapping;
 
 				mesh = new THREE.Mesh( geometry, new THREE.MeshBasicMaterial( { map: texture } ) );
 				scene.add( mesh );

examples/webgl_geometry_terrain_raycast.html

@@ -101,8 +101,9 @@
 
 				geometry.computeFaceNormals();
 
-				texture = new THREE.Texture( generateTexture( data, worldWidth, worldDepth ), THREE.UVMapping, THREE.ClampToEdgeWrapping, THREE.ClampToEdgeWrapping );
-				texture.needsUpdate = true;
+				texture = new THREE.CanvasTexture( generateTexture( data, worldWidth, worldDepth ) );
+				texture.wrapS = THREE.ClampToEdgeWrapping;
+				texture.wrapT = THREE.ClampToEdgeWrapping;
 
 				mesh = new THREE.Mesh( geometry, new THREE.MeshBasicMaterial( { map: texture } ) );
 				scene.add( mesh );

examples/webgl_loader_json_objconverter.html

@@ -101,9 +101,12 @@
 				xc.fillStyle = "#555";
 				xc.fillRect(96, 96, 32, 32);
 
-				var xm = new THREE.MeshBasicMaterial( { map: new THREE.Texture( x, THREE.UVMapping, THREE.RepeatWrapping, THREE.RepeatWrapping ) } );
-				xm.map.needsUpdate = true;
-				xm.map.repeat.set( 10, 10 );
+				var texture = new THREE.CanvasTexture( x );
+				texture.repeat.set( 10, 10 );
+				texture.wrapS = THREE.RepeatWrapping;
+				texture.wrapT = THREE.RepeatWrapping;
+
+				var xm = new THREE.MeshBasicMaterial( { map: texture } );
 
 				geometry = new THREE.PlaneBufferGeometry( 100, 100, 15, 10 );
 
@@ -249,8 +252,7 @@
 					xc.font = "50pt arial bold";
 					xc.fillText( i, 10, 64 );
 
-					var xm = new THREE.MeshBasicMaterial( { map: new THREE.Texture( x ), transparent: true } );
-					xm.map.needsUpdate = true;
+					var xm = new THREE.MeshBasicMaterial( { map: new THREE.CanvasTexture( x ), transparent: true } );
 
 					mesh = new THREE.Mesh( new THREE.PlaneBufferGeometry( size, size ), xm );
 					mesh.position.x = i * ( size + 5 ) - ( ( materials.length - 1 )* ( size + 5 )/2);

examples/webgl_materials_cubemap_dynamic.html

@@ -545,8 +545,7 @@
 
 			//
 
-			var shadowTexture = new THREE.Texture( canvas );
-			shadowTexture.needsUpdate = true;
+			var shadowTexture = new THREE.CanvasTexture( canvas );
 
 			var shadowPlane = new THREE.PlaneBufferGeometry( 400, 400 );
 			var shadowMaterial = new THREE.MeshBasicMaterial( {

examples/webgl_materials_grass.html

@@ -40,8 +40,7 @@
 
 				var geometry = new THREE.PlaneBufferGeometry( 100, 100 );
 
-				var texture = new THREE.Texture( generateTexture() );
-				texture.needsUpdate = true;
+				var texture = new THREE.CanvasTexture( generateTexture() );
 
 				for ( var i = 0; i < 15; i ++ ) {
 

examples/webgl_materials_texture_filters.html

@@ -114,17 +114,17 @@
 				context.fillRect( 0, 0, 64, 64);
 				context.fillRect( 64, 64, 64, 64 );
 
-				var textureCanvas = new THREE.Texture( imageCanvas, THREE.UVMapping, THREE.RepeatWrapping, THREE.RepeatWrapping );
-					materialCanvas = new THREE.MeshBasicMaterial( { map: textureCanvas } );
-
-				textureCanvas.needsUpdate = true;
+				var textureCanvas = new THREE.CanvasTexture( imageCanvas );
 				textureCanvas.repeat.set( 1000, 1000 );
+				textureCanvas.wrapS = THREE.RepeatWrapping;
+				textureCanvas.wrapT = THREE.RepeatWrapping;
 
-				var textureCanvas2 = new THREE.Texture( imageCanvas, THREE.UVMapping, THREE.RepeatWrapping, THREE.RepeatWrapping, THREE.NearestFilter, THREE.NearestFilter );
-					materialCanvas2 = new THREE.MeshBasicMaterial( { color: 0xffccaa, map: textureCanvas2 } );
+				var textureCanvas2 = textureCanvas.clone();
+				textureCanvas2.magFilter = THREE.NearestFilter;
+				textureCanvas2.minFilter = THREE.NearestFilter;
 
-				textureCanvas2.needsUpdate = true;
-				textureCanvas2.repeat.set( 1000, 1000 );
+				var	materialCanvas = new THREE.MeshBasicMaterial( { map: textureCanvas } );
+				var materialCanvas2 = new THREE.MeshBasicMaterial( { color: 0xffccaa, map: textureCanvas2 } );
 
 				var geometry = new THREE.PlaneBufferGeometry( 100, 100 );
 

examples/webgl_materials_texture_manualmipmap.html

@@ -120,8 +120,7 @@
 				}
 
 				var canvas = mipmap( 128, '#f00' );
-				var textureCanvas1 = new THREE.Texture( canvas, THREE.UVMapping, THREE.RepeatWrapping, THREE.RepeatWrapping );
-				textureCanvas1.repeat.set( 1000, 1000 );
+				var textureCanvas1 = new THREE.CanvasTexture( canvas );
 				textureCanvas1.mipmaps[ 0 ] = canvas;
 				textureCanvas1.mipmaps[ 1 ] = mipmap( 64, '#0f0' );
 				textureCanvas1.mipmaps[ 2 ] = mipmap( 32, '#00f' );
@@ -130,14 +129,15 @@
 				textureCanvas1.mipmaps[ 5 ] = mipmap( 4,  '#004' );
 				textureCanvas1.mipmaps[ 6 ] = mipmap( 2,  '#044' );
 				textureCanvas1.mipmaps[ 7 ] = mipmap( 1,  '#404' );
-				textureCanvas1.needsUpdate = true;
-
-				materialCanvas1 = new THREE.MeshBasicMaterial( { map: textureCanvas1 } );
+				textureCanvas1.repeat.set( 1000, 1000 );
+				textureCanvas1.wrapS = THREE.RepeatWrapping;
+				textureCanvas1.wrapT = THREE.RepeatWrapping;
 
 				var textureCanvas2 = textureCanvas1.clone();
 				textureCanvas2.magFilter = THREE.NearestFilter;
 				textureCanvas2.minFilter = THREE.NearestMipMapNearestFilter;
-				textureCanvas2.needsUpdate = true;
+
+				materialCanvas1 = new THREE.MeshBasicMaterial( { map: textureCanvas1 } );
 				materialCanvas2 = new THREE.MeshBasicMaterial( { color: 0xffccaa, map: textureCanvas2 } );
 
 				var geometry = new THREE.PlaneBufferGeometry( 100, 100 );

examples/webgl_multiple_canvases_circle.html

@@ -236,8 +236,7 @@
 					context.fillStyle = gradient;
 					context.fillRect( 0, 0, canvas.width, canvas.height );
 
-					var shadowTexture = new THREE.Texture( canvas );
-					shadowTexture.needsUpdate = true;
+					var shadowTexture = new THREE.CanvasTexture( canvas );
 
 					var shadowMaterial = new THREE.MeshBasicMaterial( { map: shadowTexture } );
 					var shadowGeo = new THREE.PlaneBufferGeometry( 300, 300, 1, 1 );

examples/webgl_multiple_canvases_complex.html

@@ -144,8 +144,7 @@
 					context.fillStyle = gradient;
 					context.fillRect( 0, 0, canvas.width, canvas.height );
 
-					var shadowTexture = new THREE.Texture( canvas );
-					shadowTexture.needsUpdate = true;
+					var shadowTexture = new THREE.CanvasTexture( canvas );
 
 					var shadowMaterial = new THREE.MeshBasicMaterial( { map: shadowTexture } );
 					var shadowGeo = new THREE.PlaneBufferGeometry( 300, 300, 1, 1 );

examples/webgl_multiple_canvases_grid.html

@@ -160,8 +160,7 @@
 					context.fillStyle = gradient;
 					context.fillRect( 0, 0, canvas.width, canvas.height );
 
-					var shadowTexture = new THREE.Texture( canvas );
-					shadowTexture.needsUpdate = true;
+					var shadowTexture = new THREE.CanvasTexture( canvas );
 
 					var shadowMaterial = new THREE.MeshBasicMaterial( { map: shadowTexture } );
 					var shadowGeo = new THREE.PlaneBufferGeometry( 300, 300, 1, 1 );

examples/webgl_multiple_renderers.html

@@ -75,8 +75,7 @@
 				context.fillStyle = gradient;
 				context.fillRect( 0, 0, canvas.width, canvas.height );
 
-				var shadowTexture = new THREE.Texture( canvas );
-				shadowTexture.needsUpdate = true;
+				var shadowTexture = new THREE.CanvasTexture( canvas );
 
 				var shadowMaterial = new THREE.MeshBasicMaterial( { map: shadowTexture } );
 				var shadowGeo = new THREE.PlaneBufferGeometry( 300, 300, 1, 1 );

examples/webgl_multiple_views.html

@@ -141,8 +141,7 @@
 				context.fillStyle = gradient;
 				context.fillRect( 0, 0, canvas.width, canvas.height );
 
-				var shadowTexture = new THREE.Texture( canvas );
-				shadowTexture.needsUpdate = true;
+				var shadowTexture = new THREE.CanvasTexture( canvas );
 
 				var shadowMaterial = new THREE.MeshBasicMaterial( { map: shadowTexture, transparent: true } );
 				var shadowGeo = new THREE.PlaneBufferGeometry( 300, 300, 1, 1 );

examples/webgl_sandbox.html

@@ -77,12 +77,8 @@
 				var vertexShader = shader.vertexShader;
 				var fragmentShader = shader.fragmentShader;
 
-				var texture1 = new THREE.Texture( generateTexture( 0, 0.5, 1 ), THREE.UVMapping );
-				var texture2 = new THREE.Texture( generateTexture( 0, 1, 0 ), THREE.SphericalReflectionMapping );
-				var texture3 = THREE.ImageUtils.loadTexture( 'textures/land_ocean_ice_cloud_2048.jpg' );
-
-				texture1.needsUpdate = true;
-				texture2.needsUpdate = true;
+				var texture1 = new THREE.CanvasTexture( generateTexture( 0, 0.5, 1 ), THREE.UVMapping );
+				var texture2 = THREE.ImageUtils.loadTexture( 'textures/land_ocean_ice_cloud_2048.jpg' );
 
 				var materials = [
 
@@ -91,9 +87,9 @@
 					new THREE.MeshBasicMaterial( { color: 0x0066ff, blending: THREE.AdditiveBlending, transparent: true, depthWrite: false } ),
 					new THREE.MeshBasicMaterial( { color: 0xffaa00, wireframe: true } ),
 					new THREE.MeshBasicMaterial( { map: texture1, fog: false } ),
-					new THREE.MeshBasicMaterial( { map: texture3 } ),
+					new THREE.MeshBasicMaterial( { map: texture2 } ),
 					new THREE.ShaderMaterial( { uniforms: uniforms, vertexShader: vertexShader, fragmentShader: fragmentShader, transparent: true } ),
-					new THREE.MeshLambertMaterial( { map: texture3 } ),
+					new THREE.MeshLambertMaterial( { map: texture2 } ),
 					new THREE.MeshLambertMaterial( { color: 0xdddddd, shading: THREE.FlatShading } ),
 					new THREE.MeshLambertMaterial( { color: 0xdddddd, shading: THREE.SmoothShading } ),
 					new THREE.MeshPhongMaterial( { color: 0xdddddd, specular: 0x009900, shininess: 30, shading: THREE.FlatShading } ),

examples/webgl_shading_physical.html

@@ -133,10 +133,11 @@
 				xc.fillStyle = "#555";
 				xc.fillRect(96, 96, 32, 32);
 
-				var texturePattern = new THREE.Texture( x, THREE.UVMapping, THREE.RepeatWrapping, THREE.RepeatWrapping );
-				texturePattern.needsUpdate = true;
-				texturePattern.repeat.set( 1000, 1000 );
+				var texturePattern = new THREE.CanvasTexture( x )
 				texturePattern.format = THREE.RGBFormat;
+				texturePattern.repeat.set( 1000, 1000 );
+				texturePattern.wrapS = THREE.RepeatWrapping;
+				texturePattern.wrapT = THREE.RepeatWrapping;
 
 				var textureSquares = THREE.ImageUtils.loadTexture( "textures/patterns/bright_squares256.png" );
 				textureSquares.repeat.set( 50, 50 );

examples/webgl_test_memory.html

@@ -72,10 +72,9 @@
 
 			function render() {
 
-			    var geometry = new THREE.SphereBufferGeometry( 50, Math.random() * 64, Math.random() * 32 );
+				var geometry = new THREE.SphereBufferGeometry( 50, Math.random() * 64, Math.random() * 32 );
 
-				var texture = new THREE.Texture( createImage() );
-				texture.needsUpdate = true;
+				var texture = new THREE.CanvasTexture( createImage() );
 
 				var material = new THREE.MeshBasicMaterial( { map: texture, wireframe: true } );