@needle-tools/materialx 1.0.1-next.31390e3 → 1.0.1-next.64f3b67
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +3 -1
- package/codegen/register_types.ts +2 -0
- package/package.json +1 -1
- package/src/loader/loader.needle.ts +25 -38
- package/src/loader/loader.three.ts +124 -394
- package/src/{helper.js → materialx.helper.ts} +144 -205
- package/src/materialx.material.ts +227 -0
- package/src/materialx.ts +133 -100
- package/src/materialx.types.d.ts +50 -0
- package/src/textureHelper.ts +6 -6
- package/src/utils.ts +39 -4
|
@@ -0,0 +1,227 @@
|
|
|
1
|
+
import { Camera, DoubleSide, FrontSide, GLSL3, Matrix3, Matrix4, Mesh, Object3D, ShaderMaterial, Texture, Vector3 } from "three";
|
|
2
|
+
import { debug } from "./utils.js";
|
|
3
|
+
import { MaterialXEnvironment, state } from "./materialx.js";
|
|
4
|
+
import { getUniformValues, Loaders } from "./materialx.helper.js";
|
|
5
|
+
import { Context } from "@needle-tools/engine";
|
|
6
|
+
|
|
7
|
+
|
|
8
|
+
// Add helper matrices for uniform updates (similar to MaterialX example)
|
|
9
|
+
const identityMatrix = new Matrix4();
|
|
10
|
+
const normalMat = new Matrix3();
|
|
11
|
+
const viewProjMat = new Matrix4();
|
|
12
|
+
const worldViewPos = new Vector3();
|
|
13
|
+
|
|
14
|
+
declare type MaterialXMaterialInitParameters = {
|
|
15
|
+
name: string,
|
|
16
|
+
shader: any,
|
|
17
|
+
loaders: Loaders,
|
|
18
|
+
transparent?: boolean,
|
|
19
|
+
}
|
|
20
|
+
|
|
21
|
+
export class MaterialXMaterial extends ShaderMaterial {
|
|
22
|
+
|
|
23
|
+
// copy(source: MaterialXMaterial): this {
|
|
24
|
+
// super.copy(source);
|
|
25
|
+
// this.name = source.name;
|
|
26
|
+
// this.uniforms = { ...source.uniforms }; // Shallow copy of uniforms
|
|
27
|
+
// this.envMapIntensity = source.envMapIntensity;
|
|
28
|
+
// this.envMap = source.envMap;
|
|
29
|
+
// this.updateUniforms = source.updateUniforms; // Copy the update function
|
|
30
|
+
// return this;
|
|
31
|
+
// }
|
|
32
|
+
|
|
33
|
+
constructor(init?: MaterialXMaterialInitParameters) {
|
|
34
|
+
|
|
35
|
+
// TODO: we need to properly copy the uniforms and other properties from the source material
|
|
36
|
+
if (!init) {
|
|
37
|
+
super();
|
|
38
|
+
return;
|
|
39
|
+
}
|
|
40
|
+
|
|
41
|
+
// Get vertex and fragment shader source, and remove #version directive for newer js.
|
|
42
|
+
// It's added by three.js glslVersion.
|
|
43
|
+
let vertexShader = init.shader.getSourceCode("vertex");
|
|
44
|
+
let fragmentShader = init.shader.getSourceCode("pixel");
|
|
45
|
+
|
|
46
|
+
vertexShader = vertexShader.replace(/^#version.*$/gm, '').trim();
|
|
47
|
+
fragmentShader = fragmentShader.replace(/^#version.*$/gm, '').trim();
|
|
48
|
+
|
|
49
|
+
// MaterialX uses different attribute names than js defaults,
|
|
50
|
+
// so we patch the MaterialX shaders to match the js standard names.
|
|
51
|
+
// Otherwise, we'd have to modify the mesh attributes (see original MaterialX for reference).
|
|
52
|
+
|
|
53
|
+
// Patch vertexShader
|
|
54
|
+
vertexShader = vertexShader.replace(/\bi_position\b/g, 'position');
|
|
55
|
+
vertexShader = vertexShader.replace(/\bi_normal\b/g, 'normal');
|
|
56
|
+
vertexShader = vertexShader.replace(/\bi_texcoord_0\b/g, 'uv');
|
|
57
|
+
vertexShader = vertexShader.replace(/\bi_texcoord_1\b/g, 'uv1');
|
|
58
|
+
vertexShader = vertexShader.replace(/\bi_tangent\b/g, 'tangent');
|
|
59
|
+
vertexShader = vertexShader.replace(/\bi_color_0\b/g, 'color');
|
|
60
|
+
|
|
61
|
+
// Patch fragmentShader
|
|
62
|
+
fragmentShader = fragmentShader.replace(/\bi_position\b/g, 'position');
|
|
63
|
+
fragmentShader = fragmentShader.replace(/\bi_normal\b/g, 'normal');
|
|
64
|
+
fragmentShader = fragmentShader.replace(/\bi_texcoord_0\b/g, 'uv');
|
|
65
|
+
fragmentShader = fragmentShader.replace(/\bi_texcoord_1\b/g, 'uv1');
|
|
66
|
+
fragmentShader = fragmentShader.replace(/\bi_tangent\b/g, 'tangent');
|
|
67
|
+
fragmentShader = fragmentShader.replace(/\bi_color_0\b/g, 'color');
|
|
68
|
+
|
|
69
|
+
// Remove `in vec3 position;` and so on since they're already declared by ShaderMaterial
|
|
70
|
+
vertexShader = vertexShader.replace(/in\s+vec3\s+position;/g, '');
|
|
71
|
+
vertexShader = vertexShader.replace(/in\s+vec3\s+normal;/g, '');
|
|
72
|
+
vertexShader = vertexShader.replace(/in\s+vec3\s+uv;/g, '');
|
|
73
|
+
vertexShader = vertexShader.replace(/in\s+vec3\s+uv1;/g, '');
|
|
74
|
+
vertexShader = vertexShader.replace(/in\s+vec4\s+tangent;/g, '');
|
|
75
|
+
vertexShader = vertexShader.replace(/in\s+vec4\s+color;/g, '');
|
|
76
|
+
|
|
77
|
+
// Patch uv 2-component to 3-component (`texcoord_0 = uv;` needs to be replaced with `texcoord_0 = vec3(uv, 0.0);`)
|
|
78
|
+
// TODO what if we actually have a 3-component UV? Not sure what three.js does then
|
|
79
|
+
vertexShader = vertexShader.replace(/texcoord_0 = uv;/g, 'texcoord_0 = vec3(uv, 0.0);');
|
|
80
|
+
|
|
81
|
+
// Patch units – seems MaterialX uses different units and we end up with wrong light values?
|
|
82
|
+
// result.direction = light.position - position;
|
|
83
|
+
fragmentShader = fragmentShader.replace(
|
|
84
|
+
/result\.direction\s*=\s*light\.position\s*-\s*position;/g,
|
|
85
|
+
'result.direction = (light.position - position) * 10.0 / 1.0;');
|
|
86
|
+
|
|
87
|
+
// Add tonemapping and colorspace handling
|
|
88
|
+
// Replace `out vec4 out1;` with `out vec4 gl_FragColor;`
|
|
89
|
+
fragmentShader = fragmentShader.replace(
|
|
90
|
+
/out\s+vec4\s+out1;/,
|
|
91
|
+
'layout(location = 0) out vec4 pc_fragColor;\n#define gl_FragColor pc_fragColor');
|
|
92
|
+
|
|
93
|
+
// Replace `out1 = vec4(<CAPTURE>)` with `gl_FragColor = vec4(<CAPTURE>)` and tonemapping/colorspace handling
|
|
94
|
+
fragmentShader = fragmentShader.replace(/^\s*out1\s*=\s*vec4\((.*)\);/gm, `
|
|
95
|
+
gl_FragColor = vec4($1);
|
|
96
|
+
#include <tonemapping_fragment>
|
|
97
|
+
#include <colorspace_fragment>`);
|
|
98
|
+
|
|
99
|
+
const searchPath = ""; // Could be derived from the asset path if needed
|
|
100
|
+
const flipV = false; // Set based on your geometry requirements
|
|
101
|
+
const isTransparent = init.transparent ?? false;
|
|
102
|
+
super({
|
|
103
|
+
name: init.name,
|
|
104
|
+
uniforms: {
|
|
105
|
+
...getUniformValues(init.shader.getStage('vertex'), init.loaders, searchPath, flipV),
|
|
106
|
+
...getUniformValues(init.shader.getStage('pixel'), init.loaders, searchPath, flipV),
|
|
107
|
+
},
|
|
108
|
+
vertexShader: vertexShader,
|
|
109
|
+
fragmentShader: fragmentShader,
|
|
110
|
+
glslVersion: GLSL3,
|
|
111
|
+
transparent: isTransparent,
|
|
112
|
+
side: FrontSide,
|
|
113
|
+
depthTest: true,
|
|
114
|
+
depthWrite: !isTransparent,
|
|
115
|
+
});
|
|
116
|
+
|
|
117
|
+
|
|
118
|
+
|
|
119
|
+
Object.assign(this.uniforms, {
|
|
120
|
+
u_envMatrix: { value: new Matrix4() },
|
|
121
|
+
u_envRadiance: { value: null, type: 't' },
|
|
122
|
+
u_envRadianceMips: { value: 8, type: 'i' },
|
|
123
|
+
// TODO we need to figure out how we can set a PMREM here... doing many texture samples is prohibitively expensive
|
|
124
|
+
u_envRadianceSamples: { value: 8, type: 'i' },
|
|
125
|
+
u_envIrradiance: { value: null, type: 't' },
|
|
126
|
+
u_refractionEnv: { value: true },
|
|
127
|
+
u_numActiveLightSources: { value: 0 },
|
|
128
|
+
u_lightData: { value: [] }, // Array of light data
|
|
129
|
+
});
|
|
130
|
+
|
|
131
|
+
if (debug) {
|
|
132
|
+
// Get lighting and environment data from MaterialX environment
|
|
133
|
+
console.group("[MaterialX]: ", name);
|
|
134
|
+
console.log("Vertex shader length:", vertexShader.length, vertexShader);
|
|
135
|
+
console.log("Fragment shader length:", fragmentShader.length, fragmentShader);
|
|
136
|
+
console.groupEnd();
|
|
137
|
+
}
|
|
138
|
+
|
|
139
|
+
}
|
|
140
|
+
|
|
141
|
+
|
|
142
|
+
envMapIntensity: number = 1.0; // Default intensity for environment map
|
|
143
|
+
envMap: Texture | null = null; // Environment map texture, can be set externally
|
|
144
|
+
updateUniforms = (context: Context, environment: MaterialXEnvironment, object: Object3D, camera: Camera) => {
|
|
145
|
+
|
|
146
|
+
const uniforms = this.uniforms;
|
|
147
|
+
|
|
148
|
+
if (!uniforms) return;
|
|
149
|
+
|
|
150
|
+
// TODO remove. Not sure why this is needed, but without it
|
|
151
|
+
// we currently get some "swimming" where matrices are not up to date.
|
|
152
|
+
camera.updateMatrixWorld(true);
|
|
153
|
+
|
|
154
|
+
// Update standard transformation matrices
|
|
155
|
+
if (uniforms.u_worldMatrix) {
|
|
156
|
+
if (!uniforms.u_worldMatrix.value?.isMatrix4) uniforms.u_worldMatrix.value = new Matrix4();
|
|
157
|
+
uniforms.u_worldMatrix.value = object.matrixWorld;
|
|
158
|
+
}
|
|
159
|
+
|
|
160
|
+
if (uniforms.u_viewProjectionMatrix) {
|
|
161
|
+
if (!uniforms.u_viewProjectionMatrix.value?.isMatrix4) uniforms.u_viewProjectionMatrix.value = new Matrix4();
|
|
162
|
+
uniforms.u_viewProjectionMatrix.value.multiplyMatrices(camera.projectionMatrix, camera.matrixWorldInverse);
|
|
163
|
+
}
|
|
164
|
+
|
|
165
|
+
if (uniforms.u_viewPosition) {
|
|
166
|
+
if (!uniforms.u_viewPosition.value?.isVector3) uniforms.u_viewPosition.value = new Vector3();
|
|
167
|
+
uniforms.u_viewPosition.value.copy(camera.getWorldPosition(worldViewPos));
|
|
168
|
+
}
|
|
169
|
+
|
|
170
|
+
if (uniforms.u_worldInverseTransposeMatrix) {
|
|
171
|
+
if (!uniforms.u_worldInverseTransposeMatrix.value?.isMatrix4) uniforms.u_worldInverseTransposeMatrix.value = new Matrix4();
|
|
172
|
+
uniforms.u_worldInverseTransposeMatrix.value.setFromMatrix3(normalMat.getNormalMatrix(object.matrixWorld));
|
|
173
|
+
}
|
|
174
|
+
|
|
175
|
+
// Update time uniforms
|
|
176
|
+
if (uniforms.u_time) {
|
|
177
|
+
uniforms.u_time.value = context.time.time;
|
|
178
|
+
}
|
|
179
|
+
if (uniforms.u_frame) {
|
|
180
|
+
uniforms.u_frame.value = context.time.frame;
|
|
181
|
+
}
|
|
182
|
+
|
|
183
|
+
// Update light uniforms
|
|
184
|
+
this.updateEnvironmentUniforms(environment);
|
|
185
|
+
|
|
186
|
+
this.uniformsNeedUpdate = true;
|
|
187
|
+
}
|
|
188
|
+
|
|
189
|
+
private updateEnvironmentUniforms = (environment: MaterialXEnvironment) => {
|
|
190
|
+
|
|
191
|
+
// Get lighting data from environment
|
|
192
|
+
const lightData = environment.lightData || null;
|
|
193
|
+
const lightCount = environment.lightCount || 0;
|
|
194
|
+
const textures = environment.getTextures(this) || null;
|
|
195
|
+
|
|
196
|
+
// Update each generated material's lighting uniforms
|
|
197
|
+
if (!this.uniforms) return;
|
|
198
|
+
|
|
199
|
+
// Update light count
|
|
200
|
+
if (this.uniforms.u_numActiveLightSources && lightCount >= 0) {
|
|
201
|
+
this.uniforms.u_numActiveLightSources.value = lightCount;
|
|
202
|
+
}
|
|
203
|
+
|
|
204
|
+
// Update light data if we have lights
|
|
205
|
+
if (lightData) {
|
|
206
|
+
this.uniforms.u_lightData.value = lightData;
|
|
207
|
+
if (debug) console.log("[MaterialX] Updated light data for material", this.name, lightData, this.uniforms,);
|
|
208
|
+
}
|
|
209
|
+
else if (debug) console.warn("[MaterialX] No light data available to update uniforms for material", this.name);
|
|
210
|
+
|
|
211
|
+
// Update environment uniforms
|
|
212
|
+
if (this.uniforms.u_envMatrix) {
|
|
213
|
+
this.uniforms.u_envMatrix.value = identityMatrix;
|
|
214
|
+
}
|
|
215
|
+
if (this.uniforms.u_envRadiance) {
|
|
216
|
+
this.uniforms.u_envRadiance.value = textures.radianceTexture || null;
|
|
217
|
+
}
|
|
218
|
+
if (this.uniforms.u_envRadianceMips) {
|
|
219
|
+
this.uniforms.u_envRadianceMips.value = Math.trunc(Math.log2(Math.max(textures.radianceTexture?.source.data.width ?? 0, textures.radianceTexture?.source.data.height ?? 0))) + 1;
|
|
220
|
+
}
|
|
221
|
+
if (this.uniforms.u_envIrradiance) {
|
|
222
|
+
this.uniforms.u_envIrradiance.value = textures.irradianceTexture;
|
|
223
|
+
}
|
|
224
|
+
|
|
225
|
+
this.uniformsNeedUpdate = true;
|
|
226
|
+
}
|
|
227
|
+
}
|
package/src/materialx.ts
CHANGED
|
@@ -1,14 +1,15 @@
|
|
|
1
|
-
import { Context, delay, isDevEnvironment, ObjectUtils, GameObject } from "@needle-tools/engine";
|
|
1
|
+
import { Context, delay, isDevEnvironment, ObjectUtils, GameObject, onBeforeRender } from "@needle-tools/engine";
|
|
2
|
+
import type { MaterialX as MX } from "./materialx.types.js";
|
|
2
3
|
import MaterialX from "../bin/JsMaterialXGenShader.js";
|
|
3
4
|
import { debug } from "./utils.js";
|
|
4
5
|
import { renderPMREMToEquirect } from "./textureHelper.js";
|
|
5
|
-
import { Light, MeshBasicMaterial, Object3D, PMREMGenerator } from "three";
|
|
6
|
-
import { registerLights } from "./helper.js";
|
|
6
|
+
import { Light, Material, MeshBasicMaterial, Object3D, PMREMGenerator, Texture } from "three";
|
|
7
|
+
import { registerLights, getLightData } from "./materialx.helper.js";
|
|
8
|
+
import type { MaterialXMaterial } from "./materialx.material.js";
|
|
7
9
|
|
|
8
10
|
|
|
9
|
-
// Global MaterialX module instance - initialized lazily
|
|
10
11
|
export const state = new class {
|
|
11
|
-
materialXModule:
|
|
12
|
+
materialXModule: MX.MODULE | null = null;
|
|
12
13
|
materialXGenerator: any = null;
|
|
13
14
|
materialXGenContext: any = null;
|
|
14
15
|
materialXStdLib: any = null;
|
|
@@ -22,7 +23,7 @@ export const state = new class {
|
|
|
22
23
|
}
|
|
23
24
|
}
|
|
24
25
|
|
|
25
|
-
|
|
26
|
+
/** Initialize the MaterialX module. Must be awaited before trying to create materials */
|
|
26
27
|
export async function ready(): Promise<void> {
|
|
27
28
|
if (state.materialXInitPromise) {
|
|
28
29
|
return state.materialXInitPromise;
|
|
@@ -60,7 +61,7 @@ export async function ready(): Promise<void> {
|
|
|
60
61
|
},
|
|
61
62
|
});
|
|
62
63
|
if (debug) console.log("[MaterialX] module loaded", module);
|
|
63
|
-
state.materialXModule = module
|
|
64
|
+
state.materialXModule = module as MX.MODULE
|
|
64
65
|
|
|
65
66
|
// Initialize shader generator and context
|
|
66
67
|
state.materialXGenerator = module.EsslShaderGenerator.create();
|
|
@@ -72,7 +73,6 @@ export async function ready(): Promise<void> {
|
|
|
72
73
|
tempDoc.setDataLibrary(state.materialXStdLib);
|
|
73
74
|
|
|
74
75
|
// TODO ShaderInterfaceType.SHADER_INTERFACE_REDUCED would be better, but doesn't actually seem to be supported in the MaterialX javascript bindings
|
|
75
|
-
const options = state.materialXGenContext.getOptions();
|
|
76
76
|
state.materialXGenContext.getOptions().shaderInterfaceType = state.materialXModule.ShaderInterfaceType.SHADER_INTERFACE_COMPLETE;
|
|
77
77
|
|
|
78
78
|
// SPECULAR_ENVIRONMENT_NONE: Do not use specular environment maps.
|
|
@@ -96,7 +96,7 @@ export async function ready(): Promise<void> {
|
|
|
96
96
|
state.materialXGenContext.getOptions().hwMaxActiveLightSources = 4;
|
|
97
97
|
|
|
98
98
|
// This prewarms the shader generation context to have all light types
|
|
99
|
-
await registerLights(state.materialXModule,
|
|
99
|
+
await registerLights(state.materialXModule, state.materialXGenContext);
|
|
100
100
|
|
|
101
101
|
if (debug) console.log("[MaterialX] generator initialized successfully");
|
|
102
102
|
} catch (error) {
|
|
@@ -106,123 +106,156 @@ export async function ready(): Promise<void> {
|
|
|
106
106
|
})();
|
|
107
107
|
}
|
|
108
108
|
|
|
109
|
+
type EnvironmentTextureSet = {
|
|
110
|
+
radianceTexture: Texture | null;
|
|
111
|
+
irradianceTexture: Texture | null;
|
|
112
|
+
}
|
|
113
|
+
|
|
109
114
|
// MaterialX Environment Manager - handles lighting and environment setup
|
|
110
115
|
export class MaterialXEnvironment {
|
|
111
|
-
|
|
116
|
+
private _context: Context | null = null;
|
|
117
|
+
private _lights: Array<Light> = [];
|
|
118
|
+
private _lightData: any = null;
|
|
119
|
+
private _lightCount: number = 0;
|
|
120
|
+
private _initializePromise: Promise<boolean> | null = null;
|
|
112
121
|
|
|
113
|
-
private
|
|
114
|
-
private lightCount: number = 0;
|
|
115
|
-
private radianceTexture: any = null;
|
|
116
|
-
private irradianceTexture: any = null;
|
|
117
|
-
private initialized: boolean = false;
|
|
122
|
+
private _unsubscribehook: (() => void) | null = null;
|
|
118
123
|
|
|
119
124
|
constructor() {
|
|
120
125
|
if (debug) console.log("[MaterialX] Environment created");
|
|
121
126
|
}
|
|
122
127
|
|
|
123
128
|
// Initialize with Needle Engine context
|
|
124
|
-
async
|
|
125
|
-
if (
|
|
126
|
-
|
|
127
|
-
return;
|
|
129
|
+
async initialize(context: Context): Promise<boolean> {
|
|
130
|
+
if (this._initializePromise) {
|
|
131
|
+
return this._initializePromise;
|
|
128
132
|
}
|
|
133
|
+
return this._initializePromise = this._initialize(context);
|
|
134
|
+
}
|
|
129
135
|
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
136
|
+
get lightData() { return this._lightData; }
|
|
137
|
+
get lightCount() { return this._lightCount || 0; }
|
|
138
|
+
getTextures(material: MaterialXMaterial) {
|
|
139
|
+
if (material.envMap) {
|
|
140
|
+
// If the material has its own envMap, we don't use the irradiance texture
|
|
141
|
+
return this._getTextures(material.envMap);
|
|
134
142
|
}
|
|
143
|
+
return this._getTextures(this._context?.scene.environment);
|
|
144
|
+
}
|
|
135
145
|
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
|
|
143
|
-
if (debug) console.log("[MaterialX] Disposing previous irradiance texture");
|
|
144
|
-
this.irradianceTexture.dispose();
|
|
145
|
-
this.irradianceTexture = null;
|
|
146
|
-
}
|
|
146
|
+
private _pmremGenerator: PMREMGenerator | null = null;
|
|
147
|
+
private readonly _texturesCache: Map<Texture | null, EnvironmentTextureSet> = new Map();
|
|
148
|
+
|
|
149
|
+
private _initialize: (context: Context) => Promise<boolean> = async (context: Context) => {
|
|
150
|
+
|
|
151
|
+
this._context = context;
|
|
152
|
+
this._pmremGenerator = new PMREMGenerator(context.renderer);
|
|
147
153
|
|
|
148
|
-
|
|
149
|
-
|
|
154
|
+
this._unsubscribehook?.();
|
|
155
|
+
this._unsubscribehook = onBeforeRender(() => {
|
|
156
|
+
this.updateLighting(false);
|
|
157
|
+
this._getTextures(context.scene.environment);
|
|
158
|
+
})
|
|
150
159
|
|
|
151
160
|
// TODO remove this delay; we should wait for the scene lighting to be ready
|
|
152
161
|
// and then update the uniforms
|
|
153
|
-
|
|
154
|
-
|
|
155
|
-
await delay(200);
|
|
156
|
-
envMap = this.context.scene.environment;
|
|
162
|
+
while (!context.scene.environment) {
|
|
163
|
+
await delay(5);
|
|
157
164
|
}
|
|
158
|
-
|
|
159
|
-
|
|
160
|
-
|
|
161
|
-
|
|
162
|
-
|
|
163
|
-
|
|
164
|
-
|
|
165
|
-
|
|
166
|
-
|
|
167
|
-
//
|
|
168
|
-
|
|
169
|
-
|
|
170
|
-
|
|
171
|
-
|
|
172
|
-
|
|
173
|
-
|
|
174
|
-
|
|
175
|
-
|
|
176
|
-
|
|
177
|
-
|
|
178
|
-
|
|
179
|
-
const irradianceMat = unlitMat.clone();
|
|
180
|
-
irradianceMat.map = this.irradianceTexture;
|
|
181
|
-
const irradianceCube = ObjectUtils.createPrimitive("Quad", { material: irradianceMat });
|
|
182
|
-
this.context.scene.add(radianceCube);
|
|
183
|
-
this.context.scene.add(irradianceCube);
|
|
184
|
-
radianceCube.position.set(2, 0, 0);
|
|
185
|
-
irradianceCube.position.set(-2, 0, 0);
|
|
186
|
-
// await this.initializeLighting(defaultLightRigXml, renderer);
|
|
187
|
-
console.log("[MaterialX] environment initialized from Needle context", this, this.context.scene);
|
|
188
|
-
}
|
|
189
|
-
|
|
190
|
-
// Find lights in scene
|
|
191
|
-
let lights = new Array<Light>();
|
|
192
|
-
this.context.scene.traverse((object: Object3D) => {
|
|
193
|
-
if ((object as Light).isLight && GameObject.isActiveInHierarchy(object))
|
|
194
|
-
lights.push(object as Light);
|
|
195
|
-
});
|
|
196
|
-
|
|
197
|
-
const { lightData, lightCount } = await registerLights(state.materialXModule, lights, state.materialXGenContext);
|
|
198
|
-
this.lightData = lightData;
|
|
199
|
-
this.lightCount = lightCount;
|
|
165
|
+
this._getTextures(context.scene.environment);
|
|
166
|
+
|
|
167
|
+
// if (debug) {
|
|
168
|
+
// console.log({ radiance: this._radianceTexture, irradiance: this._irradianceTexture });
|
|
169
|
+
// // Show both of them on cubes in the scene
|
|
170
|
+
// const unlitMat = new MeshBasicMaterial();
|
|
171
|
+
// unlitMat.side = 2;
|
|
172
|
+
// const radianceMat = unlitMat.clone();
|
|
173
|
+
// radianceMat.map = this._radianceTexture;
|
|
174
|
+
// const radianceCube = ObjectUtils.createPrimitive("Quad", { material: radianceMat });
|
|
175
|
+
// const irradianceMat = unlitMat.clone();
|
|
176
|
+
// irradianceMat.map = this._irradianceTexture;
|
|
177
|
+
// const irradianceCube = ObjectUtils.createPrimitive("Quad", { material: irradianceMat });
|
|
178
|
+
// context.scene.add(radianceCube);
|
|
179
|
+
// context.scene.add(irradianceCube);
|
|
180
|
+
// radianceCube.position.set(2, 0, 0);
|
|
181
|
+
// irradianceCube.position.set(-2, 0, 0);
|
|
182
|
+
// console.log("[MaterialX] environment initialized from Needle context", this, this._context.scene);
|
|
183
|
+
// }
|
|
184
|
+
|
|
185
|
+
this.updateLighting(true);
|
|
200
186
|
|
|
201
187
|
// Mark as initialized
|
|
202
|
-
|
|
188
|
+
return true;
|
|
203
189
|
}
|
|
204
190
|
|
|
205
|
-
getLightData() { return this.lightData; }
|
|
206
|
-
getLightCount() { return this.lightCount; }
|
|
207
|
-
getRadianceTexture() { return this.radianceTexture; }
|
|
208
|
-
getIrradianceTexture() { return this.irradianceTexture; }
|
|
209
|
-
|
|
210
|
-
setRadianceTexture(texture: any) { this.radianceTexture = texture; }
|
|
211
|
-
setIrradianceTexture(texture: any) { this.irradianceTexture = texture; }
|
|
212
|
-
|
|
213
191
|
// Reset the environment to allow re-initialization
|
|
214
192
|
reset() {
|
|
215
193
|
if (debug) console.log("[MaterialX] Resetting environment");
|
|
216
|
-
|
|
217
|
-
|
|
218
|
-
|
|
194
|
+
this._initializePromise = null;
|
|
195
|
+
this._lights = [];
|
|
196
|
+
this._lightData = null;
|
|
197
|
+
this._lightCount = 0;
|
|
198
|
+
this._pmremGenerator?.dispose();
|
|
199
|
+
this._pmremGenerator = null;
|
|
200
|
+
for(const textureSet of this._texturesCache.values()) {
|
|
201
|
+
textureSet.radianceTexture?.dispose();
|
|
202
|
+
textureSet.irradianceTexture?.dispose();
|
|
219
203
|
}
|
|
220
|
-
|
|
221
|
-
|
|
222
|
-
|
|
204
|
+
this._texturesCache.clear();
|
|
205
|
+
|
|
206
|
+
this._unsubscribehook?.();
|
|
207
|
+
this._unsubscribehook = null;
|
|
208
|
+
}
|
|
209
|
+
|
|
210
|
+
private _getTextures(texture: Texture | null | undefined): {
|
|
211
|
+
radianceTexture: Texture | null,
|
|
212
|
+
irradianceTexture: Texture | null
|
|
213
|
+
} {
|
|
214
|
+
|
|
215
|
+
let res: EnvironmentTextureSet | undefined = this._texturesCache.get(texture || null);
|
|
216
|
+
if (res) {
|
|
217
|
+
return res;
|
|
218
|
+
}
|
|
219
|
+
|
|
220
|
+
if (this._context && this._pmremGenerator && texture) {
|
|
221
|
+
if (debug) console.log("[MaterialX] Generating environment textures", texture.name);
|
|
222
|
+
|
|
223
|
+
const target = this._pmremGenerator.fromEquirectangular(texture);
|
|
224
|
+
const radianceRenderTarget = renderPMREMToEquirect(this._context.renderer, target.texture, 0.0, 1024, 512, target.height);
|
|
225
|
+
const irradianceRenderTarget = renderPMREMToEquirect(this._context.renderer, target.texture, 1.0, 32, 16, target.height);
|
|
226
|
+
target.dispose();
|
|
227
|
+
res = {
|
|
228
|
+
radianceTexture: radianceRenderTarget.texture,
|
|
229
|
+
irradianceTexture: irradianceRenderTarget.texture
|
|
230
|
+
}
|
|
231
|
+
}
|
|
232
|
+
else {
|
|
233
|
+
res = {
|
|
234
|
+
radianceTexture: null,
|
|
235
|
+
irradianceTexture: null
|
|
236
|
+
}
|
|
237
|
+
}
|
|
238
|
+
this._texturesCache.set(texture || null, res);
|
|
239
|
+
return res;
|
|
240
|
+
}
|
|
241
|
+
|
|
242
|
+
private updateLighting = (collectLights: boolean = false) => {
|
|
243
|
+
if (!this._context) return;
|
|
244
|
+
|
|
245
|
+
// Find lights in scene
|
|
246
|
+
if (collectLights) {
|
|
247
|
+
const lights = new Array<Light>();
|
|
248
|
+
this._context.scene.traverse((object: Object3D) => {
|
|
249
|
+
if ((object as Light).isLight && GameObject.isActiveInHierarchy(object))
|
|
250
|
+
lights.push(object as Light);
|
|
251
|
+
});
|
|
252
|
+
this._lights = lights;
|
|
253
|
+
}
|
|
254
|
+
|
|
255
|
+
if (state.materialXGenContext) {
|
|
256
|
+
const { lightData, lightCount } = getLightData(this._lights, state.materialXGenContext);
|
|
257
|
+
this._lightData = lightData;
|
|
258
|
+
this._lightCount = lightCount;
|
|
223
259
|
}
|
|
224
|
-
this.initialized = false;
|
|
225
|
-
// this.lights = [];
|
|
226
|
-
this.lightData = null;
|
|
227
260
|
}
|
|
228
261
|
}
|
|
@@ -0,0 +1,50 @@
|
|
|
1
|
+
|
|
2
|
+
|
|
3
|
+
|
|
4
|
+
export namespace MaterialX {
|
|
5
|
+
|
|
6
|
+
export type MODULE = {
|
|
7
|
+
ShaderInterfaceType: any;
|
|
8
|
+
HwSpecularEnvironmentMethod: any;
|
|
9
|
+
HwShaderGenerator: {
|
|
10
|
+
bindLightShader(def: any, id: number, genContext: GenContext): void;
|
|
11
|
+
unbindLightShaders(context: any): void;
|
|
12
|
+
};
|
|
13
|
+
createDocument(): Document;
|
|
14
|
+
readFromXmlString(doc: Document, xml: string, unknown: string): void;
|
|
15
|
+
loadStandardLibraries(genContext: GenContext): StandardLibrary;
|
|
16
|
+
isTransparentSurface(renderableElement: any, target: string): boolean;
|
|
17
|
+
}
|
|
18
|
+
|
|
19
|
+
|
|
20
|
+
export type GenContext = {
|
|
21
|
+
}
|
|
22
|
+
|
|
23
|
+
export type StandardLibrary = {
|
|
24
|
+
|
|
25
|
+
}
|
|
26
|
+
|
|
27
|
+
// https://github.com/AcademySoftwareFoundation/MaterialX/blob/b74787db6544283dc32afc8085ebc93cabe937cb/source/MaterialXGenShader/ShaderStage.h#L56
|
|
28
|
+
export type ShaderStage = {
|
|
29
|
+
getUniformBlocks(): Record<string, any>;
|
|
30
|
+
}
|
|
31
|
+
|
|
32
|
+
export type Document = {
|
|
33
|
+
setDataLibrary(lib: StandardLibrary): void;
|
|
34
|
+
importLibrary(lib: Document): void;
|
|
35
|
+
|
|
36
|
+
getNodes(): Node[];
|
|
37
|
+
}
|
|
38
|
+
|
|
39
|
+
export type Node = {
|
|
40
|
+
getType(): string;
|
|
41
|
+
}
|
|
42
|
+
|
|
43
|
+
export type Matrix = {
|
|
44
|
+
numRows(): number;
|
|
45
|
+
numColumns(): number;
|
|
46
|
+
get size(): number;
|
|
47
|
+
getItem(row: number, col: number): number;
|
|
48
|
+
}
|
|
49
|
+
|
|
50
|
+
}
|
package/src/textureHelper.ts
CHANGED
|
@@ -40,7 +40,7 @@ export function renderPMREMToEquirect(renderer: WebGLRenderer, pmremTexture: Tex
|
|
|
40
40
|
} else {
|
|
41
41
|
imageHeight = 256; // Final fallback
|
|
42
42
|
}
|
|
43
|
-
|
|
43
|
+
|
|
44
44
|
const maxMip = Math.log2(imageHeight) - 2;
|
|
45
45
|
const cubeUVHeight = imageHeight;
|
|
46
46
|
const cubeUVWidth = 3 * Math.max(Math.pow(2, maxMip), 7 * 16);
|
|
@@ -129,14 +129,14 @@ export function renderPMREMToEquirect(renderer: WebGLRenderer, pmremTexture: Tex
|
|
|
129
129
|
const currentAutoClear = renderer.autoClear;
|
|
130
130
|
const currentXrEnabled = renderer.xr.enabled;
|
|
131
131
|
const currentShadowMapEnabled = renderer.shadowMap.enabled;
|
|
132
|
-
|
|
132
|
+
|
|
133
133
|
renderTarget.texture.generateMipmaps = true;
|
|
134
|
-
|
|
134
|
+
|
|
135
135
|
try {
|
|
136
136
|
// Disable XR and shadow mapping during our render to avoid interference
|
|
137
137
|
renderer.xr.enabled = false;
|
|
138
138
|
renderer.shadowMap.enabled = false;
|
|
139
|
-
|
|
139
|
+
|
|
140
140
|
// Render to our target
|
|
141
141
|
renderer.autoClear = true;
|
|
142
142
|
renderer.setRenderTarget(renderTarget);
|
|
@@ -148,7 +148,7 @@ export function renderPMREMToEquirect(renderer: WebGLRenderer, pmremTexture: Tex
|
|
|
148
148
|
renderer.autoClear = currentAutoClear;
|
|
149
149
|
renderer.xr.enabled = currentXrEnabled;
|
|
150
150
|
renderer.shadowMap.enabled = currentShadowMapEnabled;
|
|
151
|
-
|
|
151
|
+
|
|
152
152
|
// Clean up temporary objects
|
|
153
153
|
geometry.dispose();
|
|
154
154
|
material.dispose();
|
|
@@ -159,7 +159,7 @@ export function renderPMREMToEquirect(renderer: WebGLRenderer, pmremTexture: Tex
|
|
|
159
159
|
renderTarget.texture.mapping = EquirectangularReflectionMapping;
|
|
160
160
|
|
|
161
161
|
// Log mipmap infos
|
|
162
|
-
if (debug) console.log('PMREM to Equirect Render Target:', {
|
|
162
|
+
if (debug) console.log('[MaterialX] PMREM to Equirect Render Target:', {
|
|
163
163
|
width: renderTarget.width,
|
|
164
164
|
height: renderTarget.height,
|
|
165
165
|
mipmaps: renderTarget.texture.mipmaps?.length,
|