switched to THREE.TextureLoader from THREE.ImageUtils

Noticed that ImageUtils are getting deprecation warning. I fixed coupled
exapmles to use texture loader. Let me know if this makes sense and I'll
move remaining examples too

examples/misc_controls_fly.html

@@ -77,6 +77,8 @@
 			var geometry, meshPlanet, meshClouds, meshMoon;
 			var dirLight, pointLight, ambientLight;
 
+			var textureLoader = new THREE.TextureLoader();
+
 			var d, dPlanet, dMoon, dMoonVec = new THREE.Vector3();
 
 			var clock = new THREE.Clock();
@@ -111,9 +113,9 @@
 
 					specular: 0x333333,
 					shininess: 15,
-					map: THREE.ImageUtils.loadTexture( "textures/planets/earth_atmos_2048.jpg" ),
-					specularMap: THREE.ImageUtils.loadTexture( "textures/planets/earth_specular_2048.jpg" ),
-					normalMap: THREE.ImageUtils.loadTexture( "textures/planets/earth_normal_2048.jpg" ),
+					map: textureLoader.load( "textures/planets/earth_atmos_2048.jpg" ),
+					specularMap: textureLoader.load( "textures/planets/earth_specular_2048.jpg" ),
+					normalMap: textureLoader.load( "textures/planets/earth_normal_2048.jpg" ),
 					normalScale: new THREE.Vector2( 0.85, 0.85 )
 
 				} );
@@ -131,7 +133,7 @@
 
 				var materialClouds = new THREE.MeshLambertMaterial( {
 
-					map: THREE.ImageUtils.loadTexture( "textures/planets/earth_clouds_1024.png" ),
+					map: textureLoader.load( "textures/planets/earth_clouds_1024.png" ),
 					transparent: true
 
 				} );
@@ -145,7 +147,7 @@
 
 				var materialMoon = new THREE.MeshPhongMaterial( {
 
-					map: THREE.ImageUtils.loadTexture( "textures/planets/moon_1024.jpg" )
+					map: textureLoader.load( "textures/planets/moon_1024.jpg" )
 
 				} );
 

examples/webgl_animation_cloth.html

@@ -180,7 +180,8 @@
 
 				// cloth material
 
-				var clothTexture = THREE.ImageUtils.loadTexture( 'textures/patterns/circuit_pattern.png' );
+				var loader = new THREE.TextureLoader();
+				var clothTexture = loader.load( 'textures/patterns/circuit_pattern.png' );
 				clothTexture.wrapS = clothTexture.wrapT = THREE.RepeatWrapping;
 				clothTexture.anisotropy = 16;
 
@@ -225,7 +226,7 @@
 
 				// ground
 
-				var groundTexture = THREE.ImageUtils.loadTexture( "textures/terrain/grasslight-big.jpg" );
+				var groundTexture = loader.load( "textures/terrain/grasslight-big.jpg" );
 				groundTexture.wrapS = groundTexture.wrapT = THREE.RepeatWrapping;
 				groundTexture.repeat.set( 25, 25 );
 				groundTexture.anisotropy = 16;

examples/webgl_decals.html

@@ -46,8 +46,9 @@
 		var controls;
 		var mouse = new THREE.Vector2();
 
-		var decalDiffuse = THREE.ImageUtils.loadTexture( 'textures/decal/decal-diffuse.png' );
-		var decalNormal = THREE.ImageUtils.loadTexture( 'textures/decal/decal-normal.jpg' );
+		var textureLoader = new THREE.TextureLoader();
+		var decalDiffuse = textureLoader.load( 'textures/decal/decal-diffuse.png' );
+		var decalNormal = textureLoader.load( 'textures/decal/decal-normal.jpg' );
 
 		var decalMaterial = new THREE.MeshPhongMaterial( {
 			specular: 0x444444,
@@ -230,9 +231,9 @@
 
 				var material = new THREE.MeshPhongMaterial( {
 					specular: 0x111111,
-					map: THREE.ImageUtils.loadTexture( 'obj/leeperrysmith/Map-COL.jpg' ),
-					specularMap: THREE.ImageUtils.loadTexture( 'obj/leeperrysmith/Map-SPEC.jpg' ),
-					normalMap: THREE.ImageUtils.loadTexture( 'obj/leeperrysmith/Infinite-Level_02_Tangent_SmoothUV.jpg' ),
+					map: textureLoader.load( 'obj/leeperrysmith/Map-COL.jpg' ),
+					specularMap: textureLoader.load( 'obj/leeperrysmith/Map-SPEC.jpg' ),
+					normalMap: textureLoader.load( 'obj/leeperrysmith/Infinite-Level_02_Tangent_SmoothUV.jpg' ),
 					normalScale: new THREE.Vector2( 0.75, 0.75 ),
 					shininess: 25
 				} );

examples/webgl_loader_ctm.html

@@ -67,6 +67,9 @@
 			var windowHalfX = window.innerWidth / 2;
 			var windowHalfY = window.innerHeight / 2;
 
+			var textureLoader = new THREE.TextureLoader();
+			var cubeTextureLoader = new THREE.CubeTextureLoader();
+
 			document.addEventListener('mousemove', onDocumentMouseMove, false);
 
 			init();
@@ -92,7 +95,7 @@
 					path + 'pz' + format, path + 'nz' + format
 				];
 
-				reflectionCube = THREE.ImageUtils.loadTextureCube( urls );
+				reflectionCube = cubeTextureLoader.load( urls );
 
 				// LIGHTS
 
@@ -157,7 +160,7 @@
 
 				loader.load( "models/ctm/ben.ctm",   function( geometry ) {
 
-					var material = new THREE.MeshLambertMaterial( { color: 0xffaa00, map: THREE.ImageUtils.loadTexture( "textures/UV_Grid_Sm.jpg" ), envMap: reflectionCube, combine: THREE.MixOperation, reflectivity: 0.3 } );
+					var material = new THREE.MeshLambertMaterial( { color: 0xffaa00, map: textureLoader.load( "textures/UV_Grid_Sm.jpg" ), envMap: reflectionCube, combine: THREE.MixOperation, reflectivity: 0.3 } );
 					callbackModel( geometry, 450, material, 0, -200, 0, 0, 0 );
 					checkTime();
 
@@ -183,9 +186,9 @@
 
 						specular: 0x303030,
 						shininess: 50,
-						map: THREE.ImageUtils.loadTexture( "obj/leeperrysmith/Map-COL.jpg" ),
-						specularMap: THREE.ImageUtils.loadTexture( "obj/leeperrysmith/Map-SPEC.jpg" ),
-						normalMap: THREE.ImageUtils.loadTexture( "obj/leeperrysmith/Infinite-Level_02_Tangent_SmoothUV.jpg" ),
+						map: textureLoader.load( "obj/leeperrysmith/Map-COL.jpg" ),
+						specularMap: textureLoader.load( "obj/leeperrysmith/Map-SPEC.jpg" ),
+						normalMap: textureLoader.load( "obj/leeperrysmith/Infinite-Level_02_Tangent_SmoothUV.jpg" ),
 						normalScale: new THREE.Vector2( 0.8, 0.8 )
 
 					} );

examples/webgl_materials_blending.html

@@ -23,6 +23,8 @@
 			var camera, scene, renderer;
 			var mesh, mapBg;
 
+			var textureLoader = new THREE.TextureLoader();
+
 			init();
 			animate();
 
@@ -59,7 +61,7 @@
 				mapBg.needsUpdate = true;
 
 				/*
-				var mapBg = THREE.ImageUtils.loadTexture( "textures/disturb.jpg" );
+				var mapBg = textureLoader.load( "textures/disturb.jpg" );
 				mapBg.wrapS = mapBg.wrapT = THREE.RepeatWrapping;
 				mapBg.repeat.set( 8, 4 );
 				*/
@@ -74,11 +76,11 @@
 
 				var blendings = [ "NoBlending", "NormalBlending", "AdditiveBlending", "SubtractiveBlending", "MultiplyBlending" ];
 
-				var map0 = THREE.ImageUtils.loadTexture( 'textures/UV_Grid_Sm.jpg' );
-				var map1 = THREE.ImageUtils.loadTexture( 'textures/sprite0.jpg' );
-				var map2 = THREE.ImageUtils.loadTexture( 'textures/sprite0.png' );
-				var map3 = THREE.ImageUtils.loadTexture( 'textures/lensflare/lensflare0.png' );
-				var map4 = THREE.ImageUtils.loadTexture( 'textures/lensflare/lensflare0_alpha.png' );
+				var map0 = textureLoader.load( 'textures/UV_Grid_Sm.jpg' );
+				var map1 = textureLoader.load( 'textures/sprite0.jpg' );
+				var map2 = textureLoader.load( 'textures/sprite0.png' );
+				var map3 = textureLoader.load( 'textures/lensflare/lensflare0.png' );
+				var map4 = textureLoader.load( 'textures/lensflare/lensflare0_alpha.png' );
 
 				var geo1 = new THREE.PlaneBufferGeometry( 100, 100 );
 				var geo2 = new THREE.PlaneBufferGeometry( 100, 25 );