浏览代码

Merge pull request #15067 from Mugen87/dev19

MMDLoader: New path interface
Mr.doob 6 年之前
父节点
当前提交
e7cf9bd7b8
共有 2 个文件被更改,包括 88 次插入11 次删除
  1. 23 0
      docs/examples/loaders/MMDLoader.html
  2. 65 11
      examples/js/loaders/MMDLoader.js

+ 23 - 0
docs/examples/loaders/MMDLoader.html

@@ -110,6 +110,29 @@
 		[page:String crossOrigin] — The crossOrigin string to implement CORS for loading the url from a different domain that allows CORS.
 		</p>
 
+		<h3>[method:MMDLoader setAnimationPath]( [param:String animationPath] )</h3>
+		<p>
+		[page:String animationPath] — Base path for loading animation data (VMD/VPD files).
+		</p>
+		<p>
+		Set the base path for additional resources like textures.
+		</p>
+
+		<h3>[method:MMDLoader setPath]( [param:String path] )</h3>
+		<p>
+		[page:String path] — Base path.
+		</p>
+		<p>
+		Sets the base path or URL from which to load files.
+		</p>
+
+		<h3>[method:MMDLoader setResourcePath]( [param:String resourcePath] )</h3>
+		<p>
+		[page:String resourcePath] — Base path for loading additional resources e.g. textures.
+		</p>
+		<p>
+		Set the base path for additional resources like textures.
+		</p>
 
 		<h2>Source</h2>
 

+ 65 - 11
examples/js/loaders/MMDLoader.js

@@ -53,7 +53,7 @@ THREE.MMDLoader = ( function () {
 		crossOrigin: 'anonymous',
 
 		/**
-		 * @param {string} value
+		 * @param {string} crossOrigin
 		 * @return {THREE.MMDLoader}
 		 */
 		setCrossOrigin: function ( crossOrigin ) {
@@ -63,6 +63,39 @@ THREE.MMDLoader = ( function () {
 
 		},
 
+		/**
+		 * @param {string} animationPath
+		 * @return {THREE.MMDLoader}
+		 */
+		setAnimationPath: function ( animationPath ) {
+
+			this.animationPath = animationPath;
+			return this;
+
+		},
+
+		/**
+		 * @param {string} path
+		 * @return {THREE.MMDLoader}
+		 */
+		setPath: function ( path ) {
+
+			this.path = path;
+			return this;
+
+		},
+
+		/**
+		 * @param {string} resourcePath
+		 * @return {THREE.MMDLoader}
+		 */
+		setResoucePath: function ( resourcePath ) {
+
+			this.resourcePath = resourcePath;
+			return this;
+
+		},
+
 		// Load MMD assets as Three.js Object
 
 		/**
@@ -77,7 +110,24 @@ THREE.MMDLoader = ( function () {
 
 			var builder = this.meshBuilder.setCrossOrigin( this.crossOrigin );
 
-			var texturePath = THREE.LoaderUtils.extractUrlBase( url );
+			// resource path
+
+			var resourcePath;
+
+			if ( this.resourcePath !== undefined ) {
+
+				resourcePath = this.resourcePath;
+
+			} else if ( this.path !== undefined ) {
+
+				resourcePath = this.path;
+
+			} else {
+
+				resourcePath = THREE.LoaderUtils.extractUrlBase( url );
+
+			}
+
 			var modelExtension = this._extractExtension( url ).toLowerCase();
 
 			// Should I detect by seeing header?
@@ -91,7 +141,7 @@ THREE.MMDLoader = ( function () {
 
 			this[ modelExtension === 'pmd' ? 'loadPMD' : 'loadPMX' ]( url, function ( data ) {
 
-				onLoad(	builder.build( data, texturePath, onProgress, onError )	);
+				onLoad(	builder.build( data, resourcePath, onProgress, onError )	);
 
 			}, onProgress, onError );
 
@@ -167,6 +217,7 @@ THREE.MMDLoader = ( function () {
 
 			this.loader
 				.setMimeType( undefined )
+				.setPath( this.path )
 				.setResponseType( 'arraybuffer' )
 				.load( url, function ( buffer ) {
 
@@ -190,6 +241,7 @@ THREE.MMDLoader = ( function () {
 
 			this.loader
 				.setMimeType( undefined )
+				.setPath( this.path )
 				.setResponseType( 'arraybuffer' )
 				.load( url, function ( buffer ) {
 
@@ -219,6 +271,7 @@ THREE.MMDLoader = ( function () {
 
 			this.loader
 				.setMimeType( undefined )
+				.setPath( this.animationPath )
 				.setResponseType( 'arraybuffer' );
 
 			for ( var i = 0, il = urls.length; i < il; i ++ ) {
@@ -250,6 +303,7 @@ THREE.MMDLoader = ( function () {
 
 			this.loader
 				.setMimeType( isUnicode ? undefined : 'text/plain; charset=shift_jis' )
+				.setPath( this.animationPath )
 				.setResponseType( 'text' )
 				.load( url, function ( text ) {
 
@@ -340,17 +394,17 @@ THREE.MMDLoader = ( function () {
 
 		/**
 		 * @param {Object} data - parsed PMD/PMX data
-		 * @param {string} texturePath
+		 * @param {string} resourcePath
 		 * @param {function} onProgress
 		 * @param {function} onError
 		 * @return {THREE.SkinnedMesh}
 		 */
-		build: function ( data, texturePath, onProgress, onError ) {
+		build: function ( data, resourcePath, onProgress, onError ) {
 
 			var geometry = this.geometryBuilder.build( data );
 			var material = this.materialBuilder
 				.setCrossOrigin( this.crossOrigin )
-				.setTexturePath( texturePath )
+				.setResourcePath( resourcePath )
 				.build( data, geometry, onProgress, onError );
 
 			var mesh = new THREE.SkinnedMesh( geometry, material );
@@ -941,7 +995,7 @@ THREE.MMDLoader = ( function () {
 
 		crossOrigin: 'anonymous',
 
-		texturePath: undefined,
+		resourcePath: undefined,
 
 		/**
 		 * @param {string} crossOrigin
@@ -955,12 +1009,12 @@ THREE.MMDLoader = ( function () {
 		},
 
 		/**
-		 * @param {string} texturePath
+		 * @param {string} resourcePath
 		 * @return {MaterialBuilder}
 		 */
-		setTexturePath: function ( texturePath ) {
+		setResourcePath: function ( resourcePath ) {
 
-			this.texturePath = texturePath;
+			this.resourcePath = resourcePath;
 			return this;
 
 		},
@@ -1280,7 +1334,7 @@ THREE.MMDLoader = ( function () {
 
 			} else {
 
-				fullPath = this.texturePath + filePath;
+				fullPath = this.resourcePath + filePath;
 
 			}