Browse Source

OBJLoader2: Workers are only kept alive when run with external WorkerSupport is used
Example obj2_options: Removed manual file loading (not the focus here)
Example run_director: Fixed asset assignment and clearAllAssests function

Kai Salmen 8 years ago
parent
commit
88bec67f2e

+ 11 - 5
examples/js/loaders/LoaderSupport.js

@@ -744,12 +744,10 @@ THREE.LoaderSupport.WorkerSupport = (function () {
 						scope.running = false;
 
 						if ( scope.terminateRequested ) {
+
 							console.log( 'WorkerSupport: Run is complete. Terminating application on request!' );
-							if ( Validator.isValid( scope.worker ) ) {
-								scope.worker.terminate();
-							}
-							scope.worker = null;
-							scope.workerCode = null;
+							scope.terminateWorker();
+
 						}
 						break;
 
@@ -764,6 +762,14 @@ THREE.LoaderSupport.WorkerSupport = (function () {
 		}
 	};
 
+	WorkerSupport.prototype.terminateWorker = function () {
+		if ( Validator.isValid( this.worker ) ) {
+			this.worker.terminate();
+		}
+		this.worker = null;
+		this.workerCode = null;
+	};
+
 	WorkerSupport.prototype.setCallbacks = function ( builder, onLoad ) {
 		this.callbacks = {
 			builder: builder,

+ 13 - 2
examples/js/loaders/OBJLoader2.js

@@ -28,7 +28,9 @@ THREE.OBJLoader2 = (function () {
 
 		this.materialPerSmoothingGroup = false;
 		this.fileLoader = Validator.verifyInput( this.fileLoader, new THREE.FileLoader( this.manager ) );
+
 		this.workerSupport = null;
+		this.terminateWorkerOnLoad = true;
 	};
 
 	/**
@@ -118,8 +120,16 @@ THREE.OBJLoader2 = (function () {
 	OBJLoader2.prototype.run = function ( prepData, workerSupportExternal ) {
 		this._applyPrepData( prepData );
 		var available = this._checkFiles( prepData.resources );
-        this.workerSupport = Validator.verifyInput( workerSupportExternal, this.workerSupport );
+		if ( Validator.isValid( workerSupportExternal ) ) {
+
+			this.terminateWorkerOnLoad = false;
+			this.workerSupport = workerSupportExternal;
+
+		} else {
 
+			this.terminateWorkerOnLoad = true;
+
+		}
 		var scope = this;
 		var onMaterialsLoaded = function ( materials ) {
 			scope.builder.setMaterials( materials );
@@ -217,6 +227,7 @@ THREE.OBJLoader2 = (function () {
 		var scope = this;
 		var scopedOnLoad = function ( message ) {
 			onLoad( scope.loaderRootNode, scope.modelName, scope.instanceNo, message );
+			if ( scope.terminateWorkerOnLoad ) scope.workerSupport.terminateWorker();
 			console.timeEnd( 'OBJLoader2 parseAsync: ' + scope.modelName );
 		};
 		var scopedOnMeshLoaded = function ( payload ) {
@@ -261,7 +272,7 @@ THREE.OBJLoader2 = (function () {
             },
             [ content.buffer ]
         );
-	};
+        };
 
 	/**
 	 * Constants used by THREE.OBJLoader2

+ 10 - 164
examples/webgl_loader_obj2_options.html

@@ -56,9 +56,6 @@
 				top: 0;
 				z-Index: 200;
 			}
-			#fileUploadInput {
-				display: none;
-			}
 		</style>
 
 	</head>
@@ -71,10 +68,9 @@
 
 		</div>
 		<div id="info">
-			<a href="http://threejs.org" target="_blank" rel="noopener">three.js</a> - OBJLoader2 direct loader test
+			<a href="http://threejs.org" target="_blank" rel="noopener">three.js</a> - OBJLoader2 usage options
 			<div id="feedback"></div>
 		</div>
-		<input id="fileUploadInput" type="file" name="files[]" multiple accept=".obj,.mtl" />
 
 		<script src="js/Detector.js"></script>
 		<script src="../build/three.js"></script>
@@ -116,20 +112,6 @@
 
 					this.cube = null;
 					this.pivot = null;
-
-					// Check for the various File API support.
-					this.fileApiAvailable = true;
-					if ( window.File && window.FileReader && window.FileList && window.Blob ) {
-
-						console.log( 'File API is supported! Enabling all features.' );
-
-					} else {
-
-						this.fileApiAvailable = false;
-						console.warn( 'File API is not supported! Disabling file loading.' );
-
-					}
-					this.streamMeshes = true;
 				}
 
 				WWOBJLoader2Example.prototype.initGL = function () {
@@ -182,6 +164,7 @@
 						objLoader.setMaterials( materials );
 
 						var fileLoader = new THREE.FileLoader();
+						fileLoader.setPath( '' );
 						fileLoader.setResponseType( 'arraybuffer' );
 						fileLoader.load( 'obj/female02/female02.obj',
 							function ( content ) {
@@ -218,6 +201,7 @@
 					objLoader.setModelName( modelName );
 
 					var fileLoader = new THREE.FileLoader();
+					fileLoader.setPath( '' );
 					fileLoader.setResponseType( 'arraybuffer' );
 					fileLoader.load( 'obj/female02/female02_vertex_colors.obj',
 						function ( content ) {
@@ -345,73 +329,6 @@
 					document.getElementById( 'feedback' ).innerHTML = Validator.isValid( content ) ? content : '';
 				};
 
-				WWOBJLoader2Example.prototype._handleFileSelect = function ( event, pathTexture ) {
-					var fileObj = null;
-					var fileMtl = null;
-					var files = event.target.files;
-
-					for ( var i = 0, file; file = files[ i ]; i++) {
-
-						if ( file.name.indexOf( '\.obj' ) > 0 && fileObj === null ) {
-							fileObj = file;
-						}
-
-						if ( file.name.indexOf( '\.mtl' ) > 0 && fileMtl === null ) {
-							fileMtl = file;
-						}
-
-					}
-
-					if ( ! Validator.isValid( fileObj ) ) {
-						alert( 'Unable to load OBJ file from given files.' );
-					}
-
-					var scope = this;
-					var callbackOnLoad = function ( loderRootNode, modelName, instanceNo ) {
-						scope.scene.add( loderRootNode );
-						console.log( 'Loading complete: ' + modelName );
-						scope._reportProgress( '' );
-					};
-
-					var fileReader = new FileReader();
-					fileReader.onload = function( fileDataObj ) {
-
-						var uint8Array = new Uint8Array( fileDataObj.target.result );
-
-						var prepData = new THREE.LoaderSupport.PrepData( 'userObj' );
-						var resourceOBJ = new THREE.LoaderSupport.ResourceDescriptor( pathTexture + '/' + fileObj.name, 'OBJ' );
-						var userPivot = new THREE.Object3D();
-						userPivot.position.set(
-							-100 + 200 * Math.random(),
-							-100 + 200 * Math.random(),
-							-100 + 200 * Math.random()
-						);
-						prepData.setStreamMeshesTo( userPivot );
-						scope.pivot.add( prepData.streamMeshesTo );
-
-						resourceOBJ.setContent( uint8Array );
-						prepData.addResource( resourceOBJ );
-						prepData.setUseAsync( true );
-						var callbacks = prepData.getCallbacks();
-						callbacks.setCallbackOnProgress( scope._reportProgress );
-						callbacks.setCallbackOnLoad( callbackOnLoad );
-
-						fileReader.onload = function( fileDataMtl ) {
-
-							var resourceMTL = new THREE.LoaderSupport.ResourceDescriptor( pathTexture + '/' + fileMtl.name, 'MTL' );
-							resourceMTL.setContent( fileDataMtl.target.result );
-							prepData.addResource( resourceMTL );
-
-							var objLoader = new THREE.OBJLoader2();
-							objLoader.run( prepData );
-						};
-						fileReader.readAsText( fileMtl );
-
-					};
-					fileReader.readAsArrayBuffer( fileObj );
-
-				};
-
 				WWOBJLoader2Example.prototype.resizeDisplayGL = function () {
 					this.controls.handleResize();
 
@@ -496,66 +413,27 @@
 					}
 				};
 
-				WWOBJLoader2Example.prototype.clearAllAssests = function () {
-					var scope = this;
-					var remover = function ( object3d ) {
-
-						if ( object3d === scope.pivot ) {
-							return;
-						}
-						console.log( 'Removing: ' + object3d.name );
-						scope.scene.remove( object3d );
-
-						if ( object3d.hasOwnProperty( 'geometry' ) ) {
-							object3d.geometry.dispose();
-						}
-						if ( object3d.hasOwnProperty( 'material' ) ) {
-
-							var mat = object3d.material;
-							if ( mat.hasOwnProperty( 'materials' ) ) {
-
-								var materials = mat.materials;
-								for ( var name in materials ) {
-
-									if ( materials.hasOwnProperty( name ) ) materials[ name ].dispose();
-
-								}
-							}
-						}
-						if ( object3d.hasOwnProperty( 'texture' ) ) {
-							object3d.texture.dispose();
-						}
-					};
-
-					scope.scene.remove( scope.pivot );
-					scope.pivot.traverse( remover );
-				};
-
 				return WWOBJLoader2Example;
 
 			})();
 
 			var app = new WWOBJLoader2Example( document.getElementById( 'example' ) );
 
-			// Init dat.gui and controls
-			var elemFileInput = document.getElementById( 'fileUploadInput' );
-			var WWOBJLoader2Control = function() {
-				this.flatShading = app.flatShading;
-				this.doubleSide = app.doubleSide;
-				this.streamMeshes = app.streamMeshes;
+			var wwObjLoader2Control = {
+				flatShading: app.flatShading,
+				doubleSide: app.doubleSide
 			};
-			var wwObjLoader2Control = new WWOBJLoader2Control();
 
+			var menuDiv = document.getElementById( 'dat' );
 			var gui = new dat.GUI( {
 				autoPlace: false,
 				width: 320
 			} );
+			menuDiv.appendChild( gui.domElement );
 
-			var menuDiv = document.getElementById( 'dat' );
-			menuDiv.appendChild(gui.domElement);
 			var folderOptions = gui.addFolder( 'WWOBJLoader2 Options' );
-			var controlSmooth = folderOptions.add( wwObjLoader2Control, 'flatShading' ).name( 'Flat Shading' );
-			controlSmooth.onChange( function( value ) {
+			var controlFlat = folderOptions.add( wwObjLoader2Control, 'flatShading' ).name( 'Flat Shading' );
+			controlFlat.onChange( function( value ) {
 				console.log( 'Setting flatShading to: ' + value );
 				app.alterShading();
 			});
@@ -565,38 +443,6 @@
 				console.log( 'Setting doubleSide to: ' + value );
 				app.alterDouble();
 			});
-
-			var controlStreamMeshes = folderOptions.add( wwObjLoader2Control, 'streamMeshes' ).name( 'Stream Meshes' );
-			controlStreamMeshes.onChange( function( value ) {
-				console.log( 'Setting streamMeshes to: ' + value );
-				app.streamMeshes = value;
-			});
-
-			if ( app.fileApiAvailable ) {
-
-				wwObjLoader2Control.pathTexture = 'obj/female02/';
-				var controlPathTexture = folderOptions.add( wwObjLoader2Control, 'pathTexture' ).name( 'Relative path to textures' );
-				controlPathTexture.onChange( function( value ) {
-					console.log( 'Setting pathTexture to: ' + value );
-					app.pathTexture = value + '/';
-				});
-
-				wwObjLoader2Control.loadObjFile = function () {
-					elemFileInput.click();
-				};
-				folderOptions.add( wwObjLoader2Control, 'loadObjFile' ).name( 'Load OBJ/MTL Files' );
-
-				var handleFileSelect = function ( object3d ) {
-					app._handleFileSelect( object3d, wwObjLoader2Control.pathTexture );
-				};
-				elemFileInput.addEventListener( 'change' , handleFileSelect, false );
-
-				wwObjLoader2Control.clearAllAssests = function () {
-					app.clearAllAssests();
-				};
-				folderOptions.add( wwObjLoader2Control, 'clearAllAssests' ).name( 'Clear Scene' );
-
-			}
 			folderOptions.open();
 
 

+ 24 - 22
examples/webgl_loader_obj2_run_director.html

@@ -222,6 +222,7 @@
 
 					var callbackOnLoad = function ( loaderRootNode, modelName, instanceNo ) {
 						scope.reportDonwload[ instanceNo ] = false;
+						scope.allAssets.push( loaderRootNode );
 
 						var msg = 'Worker #' + instanceNo + ': Completed loading: ' + modelName + ' (#' + scope.workerDirector.objectsCompleted + ')';
 						console.log( msg );
@@ -319,22 +320,21 @@
 						modelPrepData.setUseAsync( true );
 
 						this.workerDirector.enqueueForRun( modelPrepData );
-						this.allAssets.push( modelPrepData );
 					}
 
 					this.workerDirector.processQueue();
 				};
 
 				WWParallels.prototype.clearAllAssests = function () {
-					var prepData;
-					var scope = this;
-
+					var storedObject3d;
 					for ( var asset in this.allAssets ) {
-						prepData = this.allAssets[ asset ];
 
+						storedObject3d = this.allAssets[ asset ];
+						var scope = this;
 						var remover = function ( object3d ) {
 
-							if ( object3d === prepData.streamMeshesTo ) return;
+							if ( storedObject3d === object3d ) return;
+
 							console.log( 'Removing ' + object3d.name );
 							scope.scene.remove( object3d );
 
@@ -352,11 +352,15 @@
 									}
 								}
 							}
-							if ( object3d.hasOwnProperty( 'texture' ) ) object3d.texture.dispose();
+							if ( object3d.hasOwnProperty( 'texture' ) )	object3d.texture.dispose();
 						};
-						scope.scene.remove( prepData.streamMeshesTo );
-						prepData.streamMeshesTo.traverse( remover );
-						prepData.streamMeshesTo = null;
+						if ( Validator.isValid( storedObject3d ) ) {
+
+							if ( this.pivot !== storedObject3d ) scope.scene.remove( storedObject3d );
+							storedObject3d.traverse( remover );
+							storedObject3d = null;
+
+						}
 					}
 					this.allAssets = [];
 				};
@@ -373,23 +377,21 @@
 
 			var app = new WWParallels( document.getElementById( 'example' ) );
 
-			var WWParallelsControl = function() {
-				this.queueLength = 128;
-				this.workerCount = 4;
-				this.streamMeshes = true;
-				this.run = function () {
+			var wwParallelsControl = {
+				queueLength: 128,
+				workerCount: 4,
+				streamMeshes: true,
+				run: function () {
 					app.enqueueAllAssests( this.queueLength, this.workerCount, this.streamMeshes );
-				};
-				this.terminate = function () {
+				},
+				terminate: function () {
 					app.terminateManager();
-				};
-				this.clearAllAssests = function () {
+				},
+				clearAllAssests: function () {
 					app.terminateManager();
 					app.clearAllAssests();
-				};
+				}
 			};
-			var wwParallelsControl = new WWParallelsControl();
-
 			var gui = new dat.GUI( {
 				autoPlace: false,
 				width: 320