Set to use Helper static methods, commented and updated

This commit is contained in:
Paul Graffam 2016-10-07 04:41:27 -04:00
parent 0b556be6bc
commit ac06ae8cbd
2 changed files with 33 additions and 34 deletions

View File

@ -1,27 +1,32 @@
import * as THREE from 'three'; import * as THREE from 'three';
import Material from '../helpers/material'; import Material from '../helpers/material';
import Helper from '../helpers/helper'; import MeshHelper from '../helpers/meshHelper';
import Helpers from '../../utils/helpers';
import Config from '../../data/config'; import Config from '../../data/config';
// Loads in a single object from the config file
export default class Model { export default class Model {
constructor(scene, manager, textures) { constructor(scene, manager, textures) {
this.scene = scene; this.scene = scene;
this.textures = textures; this.textures = textures;
// Manager is passed in to loader to determine when loading done in main
this.loader = new THREE.ObjectLoader(manager); this.loader = new THREE.ObjectLoader(manager);
this.obj = null; this.obj = null;
} }
load() { load() {
// load a resource // Load model with ObjectLoader
this.loader.load(Config.model.path, (obj) => { this.loader.load(Config.model.path, obj => {
obj.traverse((child) => { obj.traverse(child => {
if(child instanceof THREE.Mesh) { if(child instanceof THREE.Mesh) {
// Create material for mesh and grab texture by name from preloaded textures
const material = new Material().standard; const material = new Material().standard;
material.map = this.textures.UV; material.map = this.textures.UV;
child.material = material; child.material = material;
// Set to cast and receive shadow if enabled
if(Config.shadow.enabled) { if(Config.shadow.enabled) {
child.receiveShadow = true; child.receiveShadow = true;
child.castShadow = true; child.castShadow = true;
@ -29,29 +34,16 @@ export default class Model {
} }
}); });
// Add mesh helper if Dev
if(Config.isDev && Config.mesh.enableHelper) { if(Config.isDev && Config.mesh.enableHelper) {
new Helper(this.scene, obj); new MeshHelper(this.scene, obj);
} }
// set prop to obj // Set prop to obj
this.obj = obj; this.obj = obj;
obj.scale.multiplyScalar(Config.model.scale); obj.scale.multiplyScalar(Config.model.scale);
// add object to scene
this.scene.add(obj); this.scene.add(obj);
}, Model.onProgress, Model.onError); }, Helpers.logProgress(), Helpers.logError());
}
static onProgress(xhr) {
if(xhr.lengthComputable) {
const percentComplete = xhr.loaded / xhr.total * 100;
console.log(Math.round(percentComplete, 2) + '% downloaded');
}
}
static onError(xhr) {
console.error(xhr);
} }
} }

View File

@ -1,8 +1,14 @@
import * as THREE from 'three'; import * as THREE from 'three';
// Promise polyfill for IE
import { Promise } from 'es6-promise'; import { Promise } from 'es6-promise';
import Helpers from '../../utils/helpers';
import Config from '../../data/config'; import Config from '../../data/config';
// This class preloads all textures in the imageFiles array in Config via ES6 Promises.
// Once all textures are done loading the model itself will be loaded with the Promise .then() callback.
// Using promises to preload textures prevents issues of loading and applying textures to materials
// before the textures have loaded.
export default class Texture { export default class Texture {
constructor() { constructor() {
this.textures = {}; this.textures = {};
@ -17,32 +23,33 @@ export default class Texture {
loader.setPath(Config.texture.path); loader.setPath(Config.texture.path);
imageFiles.forEach((imageFile) => { imageFiles.forEach(imageFile => {
// Add an individual Promise for each image in array
promiseArray.push(new Promise((resolve, reject) => { promiseArray.push(new Promise((resolve, reject) => {
// Each Promise will attempt to load the image file
loader.load(imageFile.image, loader.load(imageFile.image,
// This gets called on load with the loaded texture
function(texture) { texture => {
texture.anisotropy = maxAnisotropy; texture.anisotropy = maxAnisotropy;
var modelOBJ = {}; // Resolve Promise with object of texture if it is instance of THREE.Texture
const modelOBJ = {};
modelOBJ[imageFile.name] = texture; modelOBJ[imageFile.name] = texture;
if(modelOBJ[imageFile.name] instanceof THREE.Texture) if(modelOBJ[imageFile.name] instanceof THREE.Texture)
resolve(modelOBJ); resolve(modelOBJ);
}, },
function(xhr) { Helpers.logProgress(),
console.log(xhr.loaded / xhr.total * 100 + '% loaded'); xhr => reject(new Error(xhr + 'An error occurred loading while loading ' + imageFile.image))
},
function(xhr) {
reject(new Error(xhr + 'An error occurred loading while loading ' + imageFile.image));
}
) )
})); }));
}); });
return Promise.all(promiseArray).then((textures) => { // Iterate through all Promises in array and return another Promise when all have resolved or console log reason when any reject
for(var i = 0; i < textures.length; i++) { return Promise.all(promiseArray).then(textures => {
// Set the textures prop object to have name be the resolved texture
for(let i = 0; i < textures.length; i++) {
this.textures[Object.keys(textures[i])[0]] = textures[i][Object.keys(textures[i])[0]]; this.textures[Object.keys(textures[i])[0]] = textures[i][Object.keys(textures[i])[0]];
} }
}); }, reason => console.log(reason));
} }
} }