Skip to content

Commit

Permalink
chore(model): refactor material render prep
Browse files Browse the repository at this point in the history
  • Loading branch information
fallenoak committed Jan 24, 2024
1 parent 3e4e4c1 commit b20b755
Show file tree
Hide file tree
Showing 4 changed files with 71 additions and 65 deletions.
14 changes: 9 additions & 5 deletions src/lib/model/ModelManager.ts
Original file line number Diff line number Diff line change
Expand Up @@ -18,7 +18,7 @@ type ModelResources = {
animator: ModelAnimator;
textureWeightCount: number;
textureTransformCount: number;
colorCount: number;
materialColorCount: number;
};

type ModelManagerOptions = {
Expand Down Expand Up @@ -91,7 +91,7 @@ class ModelManager {
animator,
textureWeightCount: spec.textureWeights.length,
textureTransformCount: spec.textureTransforms.length,
colorCount: spec.colors.length,
materialColorCount: spec.colors.length,
};

this.#loaded.set(refId, resources);
Expand Down Expand Up @@ -207,7 +207,7 @@ class ModelManager {
resources.animator,
resources.textureWeightCount,
resources.textureTransformCount,
resources.colorCount,
resources.materialColorCount,
);

mesh.name = resources.name;
Expand Down Expand Up @@ -253,10 +253,14 @@ class ModelManager {
}

for (const [index, color] of spec.colors.entries()) {
animator.registerTrack(`.colors[${index}].color`, color.colorTrack, THREE.ColorKeyframeTrack);
animator.registerTrack(
`.materialColors[${index}].color`,
color.colorTrack,
THREE.ColorKeyframeTrack,
);

animator.registerTrack(
`.colors[${index}].alpha`,
`.materialColors[${index}].alpha`,
color.alphaTrack,
THREE.NumberKeyframeTrack,
(value: number) => value / 0x7fff,
Expand Down
54 changes: 36 additions & 18 deletions src/lib/model/ModelMaterial.ts
Original file line number Diff line number Diff line change
Expand Up @@ -5,22 +5,23 @@ import {
M2_MATERIAL_BLEND_TO_THREE_BLEND_TRANSPARENT,
} from './const.js';
import { THREE_BLEND_STATE } from '../blend.js';
import ModelMesh from './ModelMesh.js';

const DEFAULT_BLEND: M2_MATERIAL_BLEND = M2_MATERIAL_BLEND.BLEND_OPAQUE;
const DEFAULT_FLAGS: number = 0x0;
const DEFAULT_ALPHA: number = 1.0;

const _tempColor = new THREE.Color();

class ModelMaterial extends THREE.RawShaderMaterial {
#textureWeightIndex: number;
#textureTransformIndices: number[];
#textureTransforms: THREE.Matrix4[];

#colorIndex: number;

#blend: M2_MATERIAL_BLEND;

#materialParams: THREE.Vector4;

#colorIndex: number;
#diffuseColor: THREE.Color;
#emissiveColor: THREE.Color;

Expand All @@ -41,12 +42,11 @@ class ModelMaterial extends THREE.RawShaderMaterial {
this.#textureTransformIndices = textureTransformIndices;
this.#textureTransforms = [new THREE.Matrix4(), new THREE.Matrix4()];

this.#colorIndex = colorIndex;

this.#blend = blend;

this.#materialParams = new THREE.Vector4(0.0, 0.0, 0.0, 0.0);

this.#colorIndex = colorIndex;

if (this.#blend === M2_MATERIAL_BLEND.BLEND_MOD) {
this.#diffuseColor = new THREE.Color(0.0, 0.0, 0.0);
this.#emissiveColor = new THREE.Color(1.0, 1.0, 1.0);
Expand Down Expand Up @@ -112,10 +112,6 @@ class ModelMaterial extends THREE.RawShaderMaterial {
return this.#materialParams.y;
}

get colorIndex() {
return this.#colorIndex;
}

get fogged() {
return this.#materialParams.w;
}
Expand All @@ -132,15 +128,37 @@ class ModelMaterial extends THREE.RawShaderMaterial {
this.#materialParams.setZ(lit);
}

get textureWeightIndex() {
return this.#textureWeightIndex;
}
prepareMaterial(model: ModelMesh) {
// Colors and weights

const materialColor = model.materialColors[this.#colorIndex];
const textureWeight = model.textureWeights[this.#textureWeightIndex] ?? 1.0;

if (materialColor) {
_tempColor.copy(model.diffuseColor).multiply(materialColor.color);
} else {
_tempColor.copy(model.diffuseColor);
}

this.#setDiffuseColor(_tempColor);
this.#setEmissiveColor(model.emissiveColor);

get textureTransformIndices() {
return this.#textureTransformIndices;
if (materialColor) {
this.alpha = model.alpha * textureWeight * materialColor.alpha;
} else {
this.alpha = model.alpha * textureWeight;
}

// Texture transforms

for (let i = 0; i < this.#textureTransformIndices.length; i++) {
const transformIndex = this.#textureTransformIndices[i];
const { translation, rotation, scaling } = model.textureTransforms[transformIndex];
this.#setTextureTransform(i, translation, rotation, scaling);
}
}

setDiffuseColor(color: THREE.Color) {
#setDiffuseColor(color: THREE.Color) {
// Materials using BLEND_MOD and BLEND_MOD2X use hardcoded colors
if (
this.#blend === M2_MATERIAL_BLEND.BLEND_MOD ||
Expand All @@ -157,7 +175,7 @@ class ModelMaterial extends THREE.RawShaderMaterial {
this.uniformsNeedUpdate = true;
}

setEmissiveColor(color: THREE.Color) {
#setEmissiveColor(color: THREE.Color) {
// Materials using BLEND_MOD and BLEND_MOD2X use hardcoded colors
if (
this.#blend === M2_MATERIAL_BLEND.BLEND_MOD ||
Expand All @@ -174,7 +192,7 @@ class ModelMaterial extends THREE.RawShaderMaterial {
this.uniformsNeedUpdate = true;
}

setTextureTransform(
#setTextureTransform(
index: number,
translation: THREE.Vector3,
rotation: THREE.Quaternion,
Expand Down
54 changes: 12 additions & 42 deletions src/lib/model/ModelMesh.ts
Original file line number Diff line number Diff line change
@@ -1,50 +1,38 @@
import * as THREE from 'three';
import ModelMaterial from './ModelMaterial.js';
import ModelAnimator from './ModelAnimator.js';

type ModelTextureTransform = {
translation: THREE.Vector3;
rotation: THREE.Quaternion;
scaling: THREE.Vector3;
};

type ModelColor = {
color: THREE.Color;
alpha: number;
};

const _color = new THREE.Color();
import { ModelMaterialColor, ModelTextureTransform } from './types.js';

class ModelMesh extends THREE.Mesh {
#animator: ModelAnimator;
#animationActions: Set<THREE.AnimationAction> = new Set();

#diffuseColor: THREE.Color;
#emissiveColor: THREE.Color;
#alpha: 1.0;
diffuseColor: THREE.Color;
emissiveColor: THREE.Color;
alpha: 1.0;

textureWeights: number[] = [];
textureTransforms: ModelTextureTransform[] = [];
colors: ModelColor[] = [];
materialColors: ModelMaterialColor[] = [];

constructor(
geometry: THREE.BufferGeometry,
materials: THREE.Material[],
animator: ModelAnimator,
textureWeightCount: number,
textureTransformCount: number,
colorCount: number,
materialColorCount: number,
) {
super(geometry, materials);

this.#animator = animator;

// Defaults

this.#diffuseColor = new THREE.Color(1.0, 1.0, 1.0);
this.#emissiveColor = new THREE.Color(0.0, 0.0, 0.0);
this.diffuseColor = new THREE.Color(1.0, 1.0, 1.0);
this.emissiveColor = new THREE.Color(0.0, 0.0, 0.0);

this.#alpha = 1.0;
this.alpha = 1.0;

for (let i = 0; i < textureWeightCount; i++) {
this.textureWeights.push(1.0);
Expand All @@ -58,8 +46,8 @@ class ModelMesh extends THREE.Mesh {
});
}

for (let i = 0; i < colorCount; i++) {
this.colors.push({
for (let i = 0; i < materialColorCount; i++) {
this.materialColors.push({
color: new THREE.Color(1.0, 1.0, 1.0),
alpha: 1.0,
});
Expand Down Expand Up @@ -92,25 +80,7 @@ class ModelMesh extends THREE.Mesh {
material: ModelMaterial,
group: THREE.Group,
) {
const color = this.colors[material.colorIndex];

const textureWeight = this.textureWeights[material.textureWeightIndex] ?? 1.0;
const colorAlpha = color?.alpha ?? 1.0;
material.alpha = this.#alpha * textureWeight * colorAlpha;

const colorColor = color?.color;
_color.copy(this.#diffuseColor);
if (color) {
_color.multiply(colorColor);
}
material.setDiffuseColor(_color);
material.setEmissiveColor(this.#emissiveColor);

for (let i = 0; i < material.textureTransformIndices.length; i++) {
const transformIndex = material.textureTransformIndices[i];
const { translation, rotation, scaling } = this.textureTransforms[transformIndex];
material.setTextureTransform(i, translation, rotation, scaling);
}
material.prepareMaterial(this);
}

dispose() {
Expand Down
14 changes: 14 additions & 0 deletions src/lib/model/types.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,14 @@
import * as THREE from 'three';

type ModelMaterialColor = {
color: THREE.Color;
alpha: number;
};

type ModelTextureTransform = {
translation: THREE.Vector3;
rotation: THREE.Quaternion;
scaling: THREE.Vector3;
};

export { ModelMaterialColor, ModelTextureTransform };

0 comments on commit b20b755

Please sign in to comment.