Spaces:
Running
Running
import { | |
AnimationMixer, | |
Box3, | |
Mesh, | |
MeshLambertMaterial, | |
Object3D, | |
TextureLoader, | |
UVMapping, | |
SRGBColorSpace | |
} from 'three'; | |
import { MD2Loader } from '../loaders/MD2Loader.js'; | |
class MD2Character { | |
constructor() { | |
this.scale = 1; | |
this.animationFPS = 6; | |
this.root = new Object3D(); | |
this.meshBody = null; | |
this.meshWeapon = null; | |
this.skinsBody = []; | |
this.skinsWeapon = []; | |
this.weapons = []; | |
this.activeAnimation = null; | |
this.mixer = null; | |
this.onLoadComplete = function () {}; | |
this.loadCounter = 0; | |
} | |
loadParts( config ) { | |
const scope = this; | |
function createPart( geometry, skinMap ) { | |
const materialWireframe = new MeshLambertMaterial( { color: 0xffaa00, wireframe: true } ); | |
const materialTexture = new MeshLambertMaterial( { color: 0xffffff, wireframe: false, map: skinMap } ); | |
// | |
const mesh = new Mesh( geometry, materialTexture ); | |
mesh.rotation.y = - Math.PI / 2; | |
mesh.castShadow = true; | |
mesh.receiveShadow = true; | |
// | |
mesh.materialTexture = materialTexture; | |
mesh.materialWireframe = materialWireframe; | |
return mesh; | |
} | |
function loadTextures( baseUrl, textureUrls ) { | |
const textureLoader = new TextureLoader(); | |
const textures = []; | |
for ( let i = 0; i < textureUrls.length; i ++ ) { | |
textures[ i ] = textureLoader.load( baseUrl + textureUrls[ i ], checkLoadingComplete ); | |
textures[ i ].mapping = UVMapping; | |
textures[ i ].name = textureUrls[ i ]; | |
textures[ i ].colorSpace = SRGBColorSpace; | |
} | |
return textures; | |
} | |
function checkLoadingComplete() { | |
scope.loadCounter -= 1; | |
if ( scope.loadCounter === 0 ) scope.onLoadComplete(); | |
} | |
this.loadCounter = config.weapons.length * 2 + config.skins.length + 1; | |
const weaponsTextures = []; | |
for ( let i = 0; i < config.weapons.length; i ++ ) weaponsTextures[ i ] = config.weapons[ i ][ 1 ]; | |
// SKINS | |
this.skinsBody = loadTextures( config.baseUrl + 'skins/', config.skins ); | |
this.skinsWeapon = loadTextures( config.baseUrl + 'skins/', weaponsTextures ); | |
// BODY | |
const loader = new MD2Loader(); | |
loader.load( config.baseUrl + config.body, function ( geo ) { | |
const boundingBox = new Box3(); | |
boundingBox.setFromBufferAttribute( geo.attributes.position ); | |
scope.root.position.y = - scope.scale * boundingBox.min.y; | |
const mesh = createPart( geo, scope.skinsBody[ 0 ] ); | |
mesh.scale.set( scope.scale, scope.scale, scope.scale ); | |
scope.root.add( mesh ); | |
scope.meshBody = mesh; | |
scope.meshBody.clipOffset = 0; | |
scope.activeAnimationClipName = mesh.geometry.animations[ 0 ].name; | |
scope.mixer = new AnimationMixer( mesh ); | |
checkLoadingComplete(); | |
} ); | |
// WEAPONS | |
const generateCallback = function ( index, name ) { | |
return function ( geo ) { | |
const mesh = createPart( geo, scope.skinsWeapon[ index ] ); | |
mesh.scale.set( scope.scale, scope.scale, scope.scale ); | |
mesh.visible = false; | |
mesh.name = name; | |
scope.root.add( mesh ); | |
scope.weapons[ index ] = mesh; | |
scope.meshWeapon = mesh; | |
checkLoadingComplete(); | |
}; | |
}; | |
for ( let i = 0; i < config.weapons.length; i ++ ) { | |
loader.load( config.baseUrl + config.weapons[ i ][ 0 ], generateCallback( i, config.weapons[ i ][ 0 ] ) ); | |
} | |
} | |
setPlaybackRate( rate ) { | |
if ( rate !== 0 ) { | |
this.mixer.timeScale = 1 / rate; | |
} else { | |
this.mixer.timeScale = 0; | |
} | |
} | |
setWireframe( wireframeEnabled ) { | |
if ( wireframeEnabled ) { | |
if ( this.meshBody ) this.meshBody.material = this.meshBody.materialWireframe; | |
if ( this.meshWeapon ) this.meshWeapon.material = this.meshWeapon.materialWireframe; | |
} else { | |
if ( this.meshBody ) this.meshBody.material = this.meshBody.materialTexture; | |
if ( this.meshWeapon ) this.meshWeapon.material = this.meshWeapon.materialTexture; | |
} | |
} | |
setSkin( index ) { | |
if ( this.meshBody && this.meshBody.material.wireframe === false ) { | |
this.meshBody.material.map = this.skinsBody[ index ]; | |
} | |
} | |
setWeapon( index ) { | |
for ( let i = 0; i < this.weapons.length; i ++ ) this.weapons[ i ].visible = false; | |
const activeWeapon = this.weapons[ index ]; | |
if ( activeWeapon ) { | |
activeWeapon.visible = true; | |
this.meshWeapon = activeWeapon; | |
this.syncWeaponAnimation(); | |
} | |
} | |
setAnimation( clipName ) { | |
if ( this.meshBody ) { | |
if ( this.meshBody.activeAction ) { | |
this.meshBody.activeAction.stop(); | |
this.meshBody.activeAction = null; | |
} | |
const action = this.mixer.clipAction( clipName, this.meshBody ); | |
if ( action ) { | |
this.meshBody.activeAction = action.play(); | |
} | |
} | |
this.activeClipName = clipName; | |
this.syncWeaponAnimation(); | |
} | |
syncWeaponAnimation() { | |
const clipName = this.activeClipName; | |
if ( this.meshWeapon ) { | |
if ( this.meshWeapon.activeAction ) { | |
this.meshWeapon.activeAction.stop(); | |
this.meshWeapon.activeAction = null; | |
} | |
const action = this.mixer.clipAction( clipName, this.meshWeapon ); | |
if ( action ) { | |
this.meshWeapon.activeAction = action.syncWith( this.meshBody.activeAction ).play(); | |
} | |
} | |
} | |
update( delta ) { | |
if ( this.mixer ) this.mixer.update( delta ); | |
} | |
} | |
export { MD2Character }; | |