Third go at LoadingManager. See #3442.

examples/canvas_geometry_earth.html

@@ -54,7 +54,7 @@
 
 				container = document.getElementById( 'container' );
 
-				camera = new THREE.PerspectiveCamera( 60, window.innerWidth / window.innerHeight, 1, 10000 );
+				camera = new THREE.PerspectiveCamera( 60, window.innerWidth / window.innerHeight, 1, 2000 );
 				camera.position.z = 500;
 
 				scene = new THREE.Scene();
@@ -64,13 +64,16 @@
 
 				// earth
 
-				var texture = new THREE.TextureLoader().load( 'textures/land_ocean_ice_cloud_2048.jpg' );
+				var loader = new THREE.TextureLoader();
+				loader.load( 'textures/land_ocean_ice_cloud_2048.jpg', function ( texture ) {
 
-				var geometry = new THREE.SphereGeometry( 200, 20, 20 );
-				var material = new THREE.MeshBasicMaterial( { map: texture, overdraw: true } );
+					var geometry = new THREE.SphereGeometry( 200, 20, 20 );
 
-				var mesh = new THREE.Mesh( geometry, material );
-				group.add( mesh );
+					var material = new THREE.MeshBasicMaterial( { map: texture, overdraw: true } );
+					var mesh = new THREE.Mesh( geometry, material );
+					group.add( mesh );
+
+				} );
 
 				// shadow
 

examples/js/loaders/OBJLoader.js

@@ -12,18 +12,15 @@ THREE.OBJLoader.prototype = {
 
 	constructor: THREE.OBJLoader,
 
-	load: function ( url, callback ) {
+	load: function ( url, onLoad, onProgress, onError ) {
 
 		var scope = this;
 
-		this.manager.add( url, 'text', function ( event ) {
+		var loader = new THREE.XHRLoader();
+		loader.setCrossOrigin( this.crossOrigin );
+		loader.load( url, function ( text ) {
 
-			if ( callback !== undefined ) {
-
-				var geometry = scope.parse( event.target.responseText );
-				callback( geometry );
-
-			}
+			onLoad( scope.parse( text ) );
 
 		} );
 

examples/webgl_loader_obj.html

@@ -74,16 +74,18 @@
 				// texture
 
 				var manager = new THREE.LoadingManager();
-				manager.addEventListener( 'load', function ( event ) {
+				/*
+				manager.onLoad( function () {
 
-					console.log( 'loading', event.loaded / event.total );
+					console.log( 'loading complete' );
 
 				} );
-				manager.addEventListener( 'complete', function ( event ) {
+				manager.onProgress( function ( event ) {
 
-					console.log( 'loading complete' );
+					console.log( 'loading', event.loaded / event.total );
 
 				} );
+				*/
 
 				var texture = new THREE.Texture();
 

src/loaders/GeometryLoader.js

@@ -2,9 +2,9 @@
  * @author mrdoob / http://mrdoob.com/
  */
 
-THREE.GeometryLoader = function ( crossOrigin ) {
+THREE.GeometryLoader = function ( manager ) {
 
-	this.crossOrigin = crossOrigin;
+	this.manager = ( manager !== undefined ) ? manager : THREE.DefaultLoadingManager;
 
 };
 
@@ -16,42 +16,19 @@ THREE.GeometryLoader.prototype = {
 
 		var scope = this;
 
-		var request = new XMLHttpRequest();
+		var loader = new THREE.XHRLoader();
+		loader.setCrossOrigin( this.crossOrigin );
+		loader.load( url, function ( text ) {
 
-		if ( onLoad !== undefined ) {
+			onLoad( scope.parse( JSON.parse( text ) ) );
 
-			request.addEventListener( 'load', function ( event ) {
+		} );
 
-				onLoad( scope.parse( JSON.parse( event.target.responseText ) ) );
-
-			}, false );
-
-		}
-
-		if ( onProgress !== undefined ) {
-
-			request.addEventListener( 'progress', function ( event ) {
-
-				onProgress( event );
-
-			}, false );
-
-		}
-
-		if ( onError !== undefined ) {
-
-			request.addEventListener( 'error', function ( event ) {
-
-				onError( event );
-
-			}, false );
-
-		}
+	},
 
-		if ( this.crossOrigin !== undefined ) request.crossOrigin = this.crossOrigin;
+	setCrossOrigin: function ( value ) {
 
-		request.open( 'GET', url, true );
-		request.send( null );
+		this.crossOrigin = value;
 
 	},
 

src/loaders/ImageLoader.js

@@ -2,9 +2,9 @@
  * @author mrdoob / http://mrdoob.com/
  */
 
-THREE.ImageLoader = function ( crossOrigin ) {
+THREE.ImageLoader = function ( manager ) {
 
-	this.crossOrigin = crossOrigin;
+	this.manager = ( manager !== undefined ) ? manager : THREE.DefaultLoadingManager;
 
 };
 
@@ -50,7 +50,11 @@ THREE.ImageLoader.prototype = {
 
 		image.src = url;
 
-		return image;
+	},
+
+	setCrossOrigin: function ( value ) {
+
+		this.crossOrigin = value;
 
 	}
 

src/loaders/LoadingManager.js

@@ -74,13 +74,12 @@ THREE.LoadingManager = function ( onLoad, onProgress, onError ) {
 
 	};
 
-	this.add = function ( url, type, onLoad, onProgress, onError ) {
+	this.add = function ( url, onLoad, onProgress, onError ) {
 
 		total ++;
 
 		queue.push( {
 			url: url,
-			type: type,
 			onLoad: onLoad,
 			onProgress: onProgress,
 			onError: onError
@@ -90,10 +89,6 @@ THREE.LoadingManager = function ( onLoad, onProgress, onError ) {
 
 	};
 
-	this.addLoader = function ( type, loader ) {
-
-		loaders[ type ] = loader;
-
-	};
-
 };
+
+THREE.DefaultLoadingManager = new THREE.LoadingManager();

src/loaders/MaterialLoader.js

@@ -12,19 +12,23 @@ THREE.MaterialLoader.prototype = {
 
 	constructor: THREE.MaterialLoader,
 
-	load: function ( url, callback ) {
+	load: function ( url, onLoad, onProgress, onError ) {
 
 		var scope = this;
 
-		this.manager.add( url, 'text', function ( event ) {
+		var loader = new THREE.XHRLoader();
+		loader.setCrossOrigin( this.crossOrigin );
+		loader.load( url, function ( text ) {
 
-			if ( callback !== undefined ) {
+			onLoad( scope.parse( JSON.parse( text ) ) );
 
-				callback( scope.parse( JSON.parse( event.target.responseText ) ) );
+		} );
+
+	},
 
-			}
+	setCrossOrigin: function ( value ) {
 
-		} );
+		this.crossOrigin = value;
 
 	},
 

src/loaders/TextureLoader.js

@@ -2,9 +2,9 @@
  * @author mrdoob / http://mrdoob.com/
  */
 
-THREE.TextureLoader = function ( crossOrigin ) {
+THREE.TextureLoader = function ( manager ) {
 
-	this.crossOrigin = crossOrigin;
+	this.manager = ( manager !== undefined ) ? manager : THREE.DefaultLoadingManager;
 
 };
 
@@ -12,15 +12,13 @@ THREE.TextureLoader.prototype = {
 
 	constructor: THREE.TextureLoader,
 
-	load: function ( url, onLoad ) {
-
-		var texture = new THREE.Texture();
+	load: function ( url, onLoad, onProgress, onError ) {
 
 		var loader = new THREE.ImageLoader();
-		loader.crossOrigin = this.crossOrigin;
+		loader.setCrossOrigin( this.crossOrigin );
 		loader.load( url, function ( image ) {
 
-			texture.image = image;
+			var texture = new THREE.Texture( image );
 			texture.needsUpdate = true;
 
 			if ( onLoad !== undefined ) {
@@ -31,7 +29,11 @@ THREE.TextureLoader.prototype = {
 
 		} );
 
-		return texture;
+	},
+
+	setCrossOrigin: function ( value ) {
+
+		this.crossOrigin = value;
 
 	}
 

src/loaders/XHRLoader.js

@@ -0,0 +1,62 @@
+/**
+ * @author mrdoob / http://mrdoob.com/
+ */
+
+THREE.XHRLoader = function ( manager ) {
+
+	this.manager = ( manager !== undefined ) ? manager : THREE.DefaultLoadingManager;
+
+};
+
+THREE.XHRLoader.prototype = {
+
+	constructor: THREE.XHRLoader,
+
+	load: function ( url, onLoad, onProgress, onError ) {
+
+		var request = new XMLHttpRequest();
+
+		if ( onLoad !== undefined ) {
+
+			request.addEventListener( 'load', function ( event ) {
+
+				onLoad( event.target.responseText );
+
+			}, false );
+
+		}
+
+		if ( onProgress !== undefined ) {
+
+			request.addEventListener( 'progress', function ( event ) {
+
+				onProgress( event );
+
+			}, false );
+
+		}
+
+		if ( onError !== undefined ) {
+
+			request.addEventListener( 'error', function ( event ) {
+
+				onError( event );
+
+			}, false );
+
+		}
+
+		if ( this.crossOrigin !== undefined ) request.crossOrigin = this.crossOrigin;
+
+		request.open( 'GET', url, true );
+		request.send( null );
+
+	},
+
+	setCrossOrigin: function ( value ) {
+
+		this.crossOrigin = value;
+
+	}
+
+};

utils/build/includes/common.json

@@ -39,6 +39,7 @@
 	"src/lights/PointLight.js",
 	"src/lights/SpotLight.js",
 	"src/loaders/Loader.js",
+	"src/loaders/XHRLoader.js",
 	"src/loaders/ImageLoader.js",
 	"src/loaders/JSONLoader.js",
 	"src/loaders/LoadingManager.js",