Merge pull request #12689 from donmccurdy/docs-loading-modifier

Docs: Example of setURLModifier, IE11 note on GLTFLoader.

docs/api/loaders/managers/LoadingManager.html

@@ -31,6 +31,10 @@
 			[example:webgl_terrain_dynamic WebGL / terrain / dynamic]
 		</div>
 
+		<p>
+			This example shows how to use LoadingManager to track the progress of
+			[page:OBJLoader].
+		</p>
 
 		<code>
 		var manager = new THREE.LoadingManager();
@@ -67,6 +71,41 @@
 		} );
 		</code>
 
+		<p>
+			In addition to observing progress, a LoadingManager can be used to
+			override resource URLs during loading. This may be helpful for assets
+			coming from drag-and-drop events, WebSockets, WebRTC, or other APIs. An
+			example showing how to load an in-memory model using Blob URLs is below.
+		</p>
+
+		<code>
+		// Blob or File objects created when dragging files into the webpage.
+		var blobs = {'fish.gltf': blob1, 'diffuse.png': blob2, 'normal.png': blob3};
+
+		var manager = new THREE.LoadingManager();
+
+		// Initialize loading manager with URL callback.
+		var objectURLs = [];
+		manager.setURLModifier( ( url ) => {
+
+			url = URL.createObjectURL( blobs[ url ] );
+
+			objectURLs.push( url );
+
+			return url;
+
+		} );
+
+		// Load as usual, then revoke the blob URLs.
+		var loader = new THREE.GLTFLoader( manager );
+		loader.load( 'fish.gltf', (gltf) => {
+
+			scene.add( gltf.scene );
+
+			objectURLs.forEach( ( url ) => URL.revokeObjectURL( url ) );
+
+		});
+		</code>
 
 		<h2>Constructor</h2>
 

docs/examples/loaders/GLTFLoader.html

@@ -48,39 +48,49 @@
 		<code>
 			// Instantiate a loader
 			var loader = new THREE.GLTFLoader();
-	
+
 			// Load a glTF resource
 			loader.load(
 				// resource URL
 				'models/gltf/duck/duck.gltf',
 				// called when the resource is loaded
 				function ( gltf ) {
-	
+
 					scene.add( gltf.scene );
-	
+
 					gltf.animations; // Array&lt;THREE.AnimationClip&gt;
 					gltf.scene; // THREE.Scene
 					gltf.scenes; // Array&lt;THREE.Scene&gt;
 					gltf.cameras; // Array&lt;THREE.Camera&gt;
-	
+
 				},
 				// called when loading is in progresses
 				function ( xhr ) {
-	
+
 					console.log( ( xhr.loaded / xhr.total * 100 ) + '% loaded' );
-	
+
 				},
 				// called when loading has errors
 				function ( error ) {
-	
+
 					console.log( 'An error happened' );
-	
+
 				}
 			);
 			</code>
 
 		[example:webgl_loader_gltf]
 
+		<h2>Browser compatibility</h2>
+
+		<p>GLTFLoader relies on ES6 <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise">Promises</a>,
+		which are not supported in IE11. To use the loader in IE11, you must
+		<a href="https://github.com/stefanpenner/es6-promise">include a polyfill</a>
+		providing a Promise replacement.</p>
+
+		<br>
+		<hr>
+
 		<h2>Constructor</h2>
 
 		<h3>[name]( [page:LoadingManager manager] )</h3>