Implemented THREE.Loader.Handlers.

examples/js/loaders/ColladaLoader.js

@@ -3433,10 +3433,7 @@ THREE.ColladaLoader = function () {
 		if (this['transparency'] !== undefined && this['transparent'] !== undefined) {
 			// convert transparent color RBG to average value
 			var transparentColor = this['transparent'];
-			var transparencyLevel = (this.transparent.color.r +
-										this.transparent.color.g +
-										this.transparent.color.b)
-										/ 3 * this.transparency;
+			var transparencyLevel = (this.transparent.color.r + this.transparent.color.g + this.transparent.color.b) / 3 * this.transparency;
 
 			if (transparencyLevel > 0) {
 				transparent = true;
@@ -3482,20 +3479,29 @@ THREE.ColladaLoader = function () {
 								var image = images[surface.init_from];
 
 								if (image) {
-                                                                        var texture = null;
-                                                                        var isCompressed = /\.dds$/i.test( image.init_from );
-                                                                        var isTGA = /\.tga$/i.test( image.init_from );
-                                                                        
-                                                                        if ( isCompressed ) {
-                                                                            texture = THREE.ImageUtils.loadCompressedTexture( baseUrl + image.init_from );
-                                                                        }
-                                                                        else if ( isTGA ) {
-                                                                            texture = THREE.ImageUtils.loadTGATexture( baseUrl + image.init_from );
-                                                                        }
-                                                                        else {
-                                                                            texture = THREE.ImageUtils.loadTexture(baseUrl + image.init_from);
-                                                                        }
-                                                                        									
+
+									var url = baseUrl + image.init_from;
+
+									var texture;
+									var loader = THREE.Loader.Handlers.get( url );
+
+									if ( loader !== null ) {
+
+										texture = loader.load( url );
+
+									} else {
+
+										texture = new THREE.Texture( new Image() );
+										loader = new THREE.ImageLoader();
+										loader.load( url, function ( image ) {
+
+											texture.image = image;
+											texture.needsUpdate = true;
+
+										} );
+
+									}
+									
 									texture.wrapS = cot.texOpts.wrapU ? THREE.RepeatWrapping : THREE.ClampToEdgeWrapping;
 									texture.wrapT = cot.texOpts.wrapV ? THREE.RepeatWrapping : THREE.ClampToEdgeWrapping;
 									texture.offset.x = cot.texOpts.offsetU;

examples/js/loaders/DDSLoader.js

@@ -27,45 +27,55 @@ THREE.DDSLoader.prototype = {
 
 		texture.generateMipmaps = false;
 
-		var loader = new THREE.XHRLoader();
-		loader.setResponseType( 'arraybuffer' );
-		loader.load( url, function ( buffer ) {
+		if ( url instanceof Array ) {
 
-			var dds = scope.parse( buffer, true );
+			// TODO
 
-			if ( dds.isCubemap ) {
+			if ( onLoad ) onLoad( texture );
+
+		} else {
+
+			var loader = new THREE.XHRLoader();
+			loader.setResponseType( 'arraybuffer' );
+			loader.load( url, function ( buffer ) {
+
+				var dds = scope.parse( buffer, true );
+
+				if ( dds.isCubemap ) {
+
+					var faces = dds.mipmaps.length / dds.mipmapCount;
 
-				var faces = dds.mipmaps.length / dds.mipmapCount;
+					for ( var f = 0; f < faces; f ++ ) {
 
-				for ( var f = 0; f < faces; f ++ ) {
+						images[ f ] = { mipmaps : [] };
 
-					images[ f ] = { mipmaps : [] };
+						for ( var i = 0; i < dds.mipmapCount; i ++ ) {
 
-					for ( var i = 0; i < dds.mipmapCount; i ++ ) {
+							images[ f ].mipmaps.push( dds.mipmaps[ f * dds.mipmapCount + i ] );
+							images[ f ].format = dds.format;
+							images[ f ].width = dds.width;
+							images[ f ].height = dds.height;
 
-						images[ f ].mipmaps.push( dds.mipmaps[ f * dds.mipmapCount + i ] );
-						images[ f ].format = dds.format;
-						images[ f ].width = dds.width;
-						images[ f ].height = dds.height;
+						}
 
 					}
 
-				}
+				} else {
 
-			} else {
+					texture.image.width = dds.width;
+					texture.image.height = dds.height;
+					texture.mipmaps = dds.mipmaps;
 
-				texture.image.width = dds.width;
-				texture.image.height = dds.height;
-				texture.mipmaps = dds.mipmaps;
+				}
 
-			}
+				texture.format = dds.format;
+				texture.needsUpdate = true;
 
-			texture.format = dds.format;
-			texture.needsUpdate = true;
+				if ( onLoad ) onLoad( texture );
 
-			if ( onLoad ) onLoad( texture );
+			} );
 
-		} );
+		}
 
 		return texture;
 

examples/js/loaders/MTLLoader.js

@@ -363,25 +363,18 @@ THREE.MTLLoader.MaterialCreator.prototype = {
 
 	loadTexture: function ( url, mapping, onLoad, onError ) {
 
-		var isCompressed = /\.dds$/i.test( url );
-                var isTGA = /\.tga$/i.test( url );
+		var texture;
+		var loader = THREE.Loader.Handlers.get( url );
 
-		if ( isCompressed ) {
+		if ( loader !== null ) {
 
-			var texture = THREE.ImageUtils.loadCompressedTexture( url, mapping, onLoad, onError );
+			texture = loader.load( url, onLoad );
 
-		}  
-                else if ( isTGA ) {
-                        
-                        var texture = THREE.ImageUtils.loadTGATexture( url, mapping, onLoad, onError );
-                        
-                }
-                else {
+		} else {
 
-			var image = new Image();
-			var texture = new THREE.Texture( image, mapping );
+			texture = new THREE.Texture( new Image() );
 
-			var loader = new THREE.ImageLoader();
+			loader = new THREE.ImageLoader();
 			loader.crossOrigin = this.crossOrigin;
 			loader.load( url, function ( image ) {
 
@@ -394,6 +387,8 @@ THREE.MTLLoader.MaterialCreator.prototype = {
 
 		}
 
+		texture.mapping = mapping;
+
 		return texture;
 
 	}

examples/js/loaders/SceneLoader.js

@@ -944,22 +944,24 @@ THREE.SceneLoader.prototype = {
 
 			}
 
+			var texture;
+
 			if ( textureJSON.url instanceof Array ) {
 
 				var count = textureJSON.url.length;
 				var url_array = [];
 
-				for( var i = 0; i < count; i ++ ) {
+				for ( var i = 0; i < count; i ++ ) {
 
 					url_array[ i ] = get_url( textureJSON.url[ i ], data.urlBaseType );
 
 				}
 
-				var isCompressed = /\.dds$/i.test( url_array[ 0 ] );
+				var loader = THREE.Loader.Handlers.get( url_array[ 0 ] );
 
-				if ( isCompressed ) {
+				if ( loader !== null ) {
 
-					texture = THREE.ImageUtils.loadCompressedTextureCube( url_array, textureJSON.mapping, generateTextureCallback( count ) );
+					texture = loader.load( url_array, generateTextureCallback( count ) );
 
 				} else {
 
@@ -969,25 +971,32 @@ THREE.SceneLoader.prototype = {
 
 			} else {
 
-				var isCompressed = /\.dds$/i.test( textureJSON.url );
-                                var isTGA = /\.tga$/i.test( textureJSON.url );
 				var fullUrl = get_url( textureJSON.url, data.urlBaseType );
 				var textureCallback = generateTextureCallback( 1 );
 
-				if ( isCompressed ) {
+				var loader = THREE.Loader.Handlers.get( fullUrl );
+
+				if ( loader !== null ) {
 
-					texture = THREE.ImageUtils.loadCompressedTexture( fullUrl, textureJSON.mapping, textureCallback );
+					texture = loader.load( fullUrl, textureCallback );
+
+				} else {
 
-				} else if ( isTGA ) {
-                                    
-                                        texture = THREE.ImageUtils.loadTGATexture( fullUrl, textureJSON.mapping, textureCallback );
-                                    
-                                } else {
+					texture = new THREE.Texture( new Image() );
+					loader = new THREE.ImageLoader();
+					loader.load( fullUrl, function ( image ) {
 
-					texture = THREE.ImageUtils.loadTexture( fullUrl, textureJSON.mapping, textureCallback );
+						texture.image = image;
+						texture.needsUpdate = true;
+
+						textureCallback();
+
+					} );
 
 				}
 
+				texture.mapping = textureJSON.mapping;
+
 				if ( THREE[ textureJSON.minFilter ] !== undefined )
 					texture.minFilter = THREE[ textureJSON.minFilter ];
 

examples/webgl_loader_json_objconverter.html

@@ -36,6 +36,7 @@
 		</div>
 
 		<script src="../build/three.min.js"></script>
+		<script src="js/loaders/DDSLoader.js"></script>
 
 		<script src="js/Detector.js"></script>
 		<script src="js/libs/stats.min.js"></script>
@@ -182,6 +183,8 @@
 				bcanvas.addEventListener("click", toggleCanvas, false);
 				bwebgl.addEventListener("click", toggleWebGL, false);
 
+				THREE.Loader.Handlers.add( /\.dds$/i, new THREE.DDSLoader() );
+
 				var loader = new THREE.JSONLoader();
 				var callbackMale = function ( geometry, materials ) { createScene( geometry, materials, 90, FLOOR, 50, 105 ) };
 				var callbackFemale = function ( geometry, materials ) { createScene( geometry, materials, -80, FLOOR, 50, 0 ) };

examples/webgl_loader_obj_mtl.html

@@ -32,6 +32,7 @@
 
 		<script src="../build/three.min.js"></script>
 
+		<script src="js/loaders/DDSLoader.js"></script>
 		<script src="js/loaders/MTLLoader.js"></script>
 		<script src="js/loaders/OBJMTLLoader.js"></script>
 
@@ -75,6 +76,8 @@
 
 				// model
 
+				THREE.Loader.Handlers.add( /\.dds$/i, new THREE.DDSLoader() );
+
 				var loader = new THREE.OBJMTLLoader();
 				loader.load( 'obj/male02/male02.obj', 'obj/male02/male02_dds.mtl', function ( object ) {
 

examples/webgl_loader_scene.html

@@ -149,6 +149,8 @@
 
 		<script src="../build/three.min.js"></script>
 
+		<script src="js/loaders/DDSLoader.js"></script>
+
 		<script src="js/loaders/ctm/lzma.js"></script>
 		<script src="js/loaders/ctm/ctm.js"></script>
 		<script src="js/loaders/ctm/CTMLoader.js"></script>
@@ -342,6 +344,8 @@
 
 				$( "progress" ).style.display = "block";
 
+				THREE.Loader.Handlers.add( /\.dds$/i, new THREE.DDSLoader() );
+
 				var loader = new THREE.SceneLoader();
 
 				loader.addGeometryHandler( "binary", THREE.BinaryLoader );

src/loaders/Loader.js

@@ -116,21 +116,58 @@ THREE.Loader.prototype = {
 
 			var fullPath = texturePath + sourceFile;
 
-			where[ name ] = new THREE.Texture( document.createElement( 'canvas' ) );
-			where[ name ].sourceFile = sourceFile;
+			var texture;
+
+			var loader = THREE.Loader.Handlers.get( fullPath );
+
+			if ( loader !== null ) {
+
+				texture = loader.load( fullPath );
+
+			} else {
+
+				texture = new THREE.Texture( document.createElement( 'canvas' ) );
+
+				loader = scope.imageLoader;
+				loader.crossOrigin = scope.crossOrigin;
+				loader.load( fullPath, function ( image ) {
+
+					if ( THREE.Math.isPowerOfTwo( image.width ) === false ||
+						 THREE.Math.isPowerOfTwo( image.height ) === false ) {
+
+						var width = nearest_pow2( image.width );
+						var height = nearest_pow2( image.height );
+
+						texture.image.width = width;
+						texture.image.height = height;
+						texture.image.getContext( '2d' ).drawImage( image, 0, 0, width, height );
+
+					} else {
+
+						texture.image = image;
+
+					}
+
+					texture.needsUpdate = true;
+
+				} );
+
+			}
+
+			texture.sourceFile = sourceFile;
 
 			if ( repeat ) {
 
-				where[ name ].repeat.set( repeat[ 0 ], repeat[ 1 ] );
+				texture.repeat.set( repeat[ 0 ], repeat[ 1 ] );
 
-				if ( repeat[ 0 ] !== 1 ) where[ name ].wrapS = THREE.RepeatWrapping;
-				if ( repeat[ 1 ] !== 1 ) where[ name ].wrapT = THREE.RepeatWrapping;
+				if ( repeat[ 0 ] !== 1 ) texture.wrapS = THREE.RepeatWrapping;
+				if ( repeat[ 1 ] !== 1 ) texture.wrapT = THREE.RepeatWrapping;
 
 			}
 
 			if ( offset ) {
 
-				where[ name ].offset.set( offset[ 0 ], offset[ 1 ] );
+				texture.offset.set( offset[ 0 ], offset[ 1 ] );
 
 			}
 
@@ -141,41 +178,18 @@ THREE.Loader.prototype = {
 					"mirror": THREE.MirroredRepeatWrapping
 				}
 
-				if ( wrapMap[ wrap[ 0 ] ] !== undefined ) where[ name ].wrapS = wrapMap[ wrap[ 0 ] ];
-				if ( wrapMap[ wrap[ 1 ] ] !== undefined ) where[ name ].wrapT = wrapMap[ wrap[ 1 ] ];
+				if ( wrapMap[ wrap[ 0 ] ] !== undefined ) texture.wrapS = wrapMap[ wrap[ 0 ] ];
+				if ( wrapMap[ wrap[ 1 ] ] !== undefined ) texture.wrapT = wrapMap[ wrap[ 1 ] ];
 
 			}
 
 			if ( anisotropy ) {
 
-				where[ name ].anisotropy = anisotropy;
+				texture.anisotropy = anisotropy;
 
 			}
 
-			var texture = where[ name ];
-
-			scope.imageLoader.crossOrigin = scope.crossOrigin;
-			scope.imageLoader.load( fullPath, function ( image ) {
-
-				if ( THREE.Math.isPowerOfTwo( image.width ) === false ||
-					 THREE.Math.isPowerOfTwo( image.height ) === false ) {
-
-					var width = nearest_pow2( image.width );
-					var height = nearest_pow2( image.height );
-
-					texture.image.width = width;
-					texture.image.height = height;
-					texture.image.getContext( '2d' ).drawImage( image, 0, 0, width, height );
-
-				} else {
-
-					texture.image = image;
-
-				}
-
-				texture.needsUpdate = true;
-
-			} );
+			where[ name ] = texture;
 
 		}
 
@@ -419,3 +433,34 @@ THREE.Loader.prototype = {
 	}
 
 };
+
+THREE.Loader.Handlers = {
+
+	handlers: [],
+
+	add: function ( regex, loader ) {
+
+		this.handlers.push( regex, loader );
+
+	},
+
+	get: function ( file ) {
+
+		for ( var i = 0, l = this.handlers.length; i < l; i += 2 ) {
+
+			var regex = this.handlers[ i ];
+			var loader  = this.handlers[ i + 1 ];
+
+			if ( regex.test( file ) ) {
+
+				return loader;
+
+			}
+
+		}
+
+		return null;
+
+	}
+
+};