@zephyr3d/scene 0.1.0

package/dist/material/standard.js

@@ -0,0 +1,282 @@
+import { Material } from './material.js';
+import { forwardComputeLighting } from '../shaders/lighting.js';
+import { RENDER_PASS_TYPE_FORWARD, RENDER_PASS_TYPE_SHADOWMAP, RENDER_PASS_TYPE_DEPTH_ONLY } from '../values.js';
+import { nonLinearDepthToLinearNormalized, encodeNormalizedFloatToRGBA } from '../shaders/misc.js';
+import { Application } from '../app.js';
+import { MESH_MATERIAL } from '../shaders/builtins.js';
+
+/**
+ * The standard mesh material
+ * @public
+ */ class StandardMaterial extends Material {
+    /** @internal */ _vertexColor;
+    /** @internal */ _hasNormal;
+    /** @internal */ _useTangent;
+    /** @internal */ _alphaBlend;
+    /** @internal */ _alphaCutoff;
+    /** @internal */ _opacity;
+    /** @internal */ _lightModel;
+    /**
+   * Creates an instance of StandardMaterial
+   */ constructor(){
+        super();
+        this._vertexColor = false;
+        this._useTangent = false;
+        this._hasNormal = true;
+        this._alphaBlend = false;
+        this._alphaCutoff = 0;
+        this._opacity = 1;
+        this._lightModel = null;
+    }
+    /** Light model of the material */ get lightModel() {
+        return this._lightModel;
+    }
+    set lightModel(lm) {
+        this._lightModel = lm || null;
+    }
+    /** true if vertex color attribute presents */ get vertexColor() {
+        return this._vertexColor;
+    }
+    set vertexColor(val) {
+        if (this._vertexColor !== !!val) {
+            this._vertexColor = !!val;
+            this.optionChanged(true);
+        }
+    }
+    /** true if vertex tangent attribute presents */ get vertexTangent() {
+        return this._useTangent;
+    }
+    set vertexTangent(val) {
+        if (this._useTangent !== !!val) {
+            this._useTangent = !!val;
+            this.optionChanged(true);
+        }
+    }
+    /** true if vertex normal attribute presents */ get vertexNormal() {
+        return this._hasNormal;
+    }
+    set vertexNormal(val) {
+        if (this._hasNormal !== !!val) {
+            this._hasNormal = !!val;
+            this.optionChanged(true);
+        }
+    }
+    /** true if alpha blending is enabled */ get alphaBlend() {
+        return this._alphaBlend;
+    }
+    set alphaBlend(val) {
+        if (this._alphaBlend !== !!val) {
+            this._alphaBlend = !!val;
+            const blending = this._alphaBlend || this._opacity < 1;
+            if (blending && !this.stateSet.blendingState?.enabled) {
+                this.stateSet.useBlendingState().enable(true).setBlendFunc('one', 'inv-src-alpha');
+            } else if (this.stateSet.blendingState?.enabled && !blending) {
+                this.stateSet.defaultBlendingState();
+            }
+            this.optionChanged(true);
+        }
+    }
+    /** A value between 0 and 1, presents the cutoff for alpha testing */ get alphaCutoff() {
+        return this._alphaCutoff;
+    }
+    set alphaCutoff(val) {
+        if (this._alphaCutoff !== val) {
+            this.optionChanged(this._alphaCutoff === 0 || val === 0);
+            this._alphaCutoff = val;
+        }
+    }
+    /** A value between 0 and 1, presents the opacity */ get opacity() {
+        return this._opacity;
+    }
+    set opacity(val) {
+        val = val < 0 ? 0 : val > 1 ? 1 : val;
+        if (this._opacity !== val) {
+            this.optionChanged(this._opacity === 1 || val === 1);
+            this._opacity = val;
+            const blending = this._alphaBlend || this._opacity < 1;
+            if (blending && !this.stateSet.blendingState?.enabled) {
+                this.stateSet.useBlendingState().enable(true).setBlendFunc('one', 'inv-src-alpha');
+            } else if (this.stateSet.blendingState?.enabled && !blending) {
+                this.stateSet.defaultBlendingState();
+            }
+        }
+    }
+    /** true if the material is transparency */ isTransparent() {
+        return this._alphaBlend || this._opacity < 1;
+    }
+    /**
+   * {@inheritDoc Material.supportLighting}
+   * @override
+   */ supportLighting() {
+        return this._lightModel ? this._lightModel.supportLighting() : false;
+    }
+    /**
+   * {@inheritDoc Material.applyUniforms}
+   * @override
+   */ applyUniforms(bindGroup, ctx, needUpdate) {
+        super.applyUniforms(bindGroup, ctx, needUpdate);
+        if (ctx.renderPass.type === RENDER_PASS_TYPE_FORWARD || this._alphaCutoff > 0) {
+            this._lightModel?.applyUniformsIfOutdated(bindGroup, ctx);
+        }
+    }
+    /**
+   * Gets the texture transform matrix for given texture coordinate index.
+   * @param texCoordIndex - The texture coordinate index
+   * @returns Texture transform matrix
+   */ getTexCoordTransform(texCoordIndex) {
+        return this._lightModel?.getTexCoordTransform(texCoordIndex) ?? null;
+    }
+    /**
+   * Sets the texture transform matrix for given texture coordinate index.
+   * @param texCoordIndex - The texture coordinate index.
+   * @param transform - Texture transform matrix, if null, the identity matrix will be set.
+   */ setTexCoordTransform(texCoordIndex, transform) {
+        this._lightModel?.setTexCoordTransform(texCoordIndex, transform);
+    }
+    /**
+   * {@inheritDoc Material._applyUniforms}
+   * @override
+   */ _applyUniforms(bindGroup, ctx) {
+        if (this._alphaCutoff > 0) {
+            bindGroup.setValue('alphaCutoff', this._alphaCutoff);
+        }
+        if (this._alphaBlend || this._opacity < 1) {
+            bindGroup.setValue('opacity', this._opacity);
+        }
+    }
+    /** @internal */ getHash(renderPassType) {
+        if (this._hash[renderPassType] === void 0 || this._lightModel && !this._lightModel.peekHash()) {
+            this._hash[renderPassType] = this.createHash(renderPassType);
+        }
+        return this._hash[renderPassType];
+    }
+    /**
+   * {@inheritDoc Material._createHash}
+   * @override
+   */ _createHash(renderPassType) {
+        return renderPassType === RENDER_PASS_TYPE_FORWARD || this._alphaCutoff > 0 ? `|${Number(!!this._vertexColor)}` + `|${Number(!!this._useTangent)}` + `|${Number(!!this._hasNormal)}` + `|${Number(this._opacity < 1 || this._alphaBlend)}` + `|${Number(this._alphaCutoff > 0)}` + `|${this._lightModel?.getHash() || ''}` : '';
+    }
+    /**
+   * {@inheritDoc Material._createProgram}
+   * @override
+   */ _createProgram(pb, ctx) {
+        const that = this;
+        const useNormal = that._hasNormal && ctx.renderPass.type === RENDER_PASS_TYPE_FORWARD && that._lightModel?.isNormalUsed();
+        if (ctx.renderPass.type === RENDER_PASS_TYPE_SHADOWMAP) {
+            const shadowMapParams = ctx.shadowMapInfo.get(ctx.renderPass.light);
+            pb.emulateDepthClamp = !!shadowMapParams.depthClampEnabled;
+        }
+        const useLightModel = ctx.renderPass.type === RENDER_PASS_TYPE_FORWARD || that._alphaCutoff > 0;
+        const program = pb.buildRenderProgram({
+            label: ctx.target?.getName() ?? '',
+            vertex () {
+                MESH_MATERIAL.VERTEX_SHADER(this, ctx);
+                this.$inputs.pos = pb.vec3().attrib('position');
+                if (ctx.target.getBoneMatrices()) {
+                    this.$inputs.blendIndices = pb.vec4().attrib('blendIndices');
+                    this.$inputs.blendWeights = pb.vec4().attrib('blendWeights');
+                }
+                if (useLightModel) {
+                    if (useNormal) {
+                        this.$inputs.normal = pb.vec3().attrib('normal');
+                    }
+                    if (that._vertexColor) {
+                        this.$inputs.vertexColor = pb.vec4().attrib('diffuse');
+                    }
+                    for(let i = 0; i < Application.instance.device.getDeviceCaps().miscCaps.maxTexCoordIndex; i++){
+                        if (that._lightModel?.isTexCoordSrcLocationUsed(i)) {
+                            this.$inputs[`texcoord${i}`] = pb.vec2().attrib(`texCoord${i}`);
+                        }
+                    }
+                    if (useNormal && that._useTangent) {
+                        this.$inputs.tangent = pb.vec4().attrib('tangent');
+                    }
+                    that._lightModel?.setupUniforms(this, ctx);
+                }
+                pb.main(function() {
+                    MESH_MATERIAL.FTRANSFORM(this);
+                    if (ctx.renderPass.type === RENDER_PASS_TYPE_FORWARD || that._alphaCutoff > 0) {
+                        if (that._vertexColor) {
+                            this.$outputs.outVertexColor = MESH_MATERIAL.DEFINE_VERTEX_COLOR(this.$inputs.vertexColor);
+                        }
+                        for(let i = 0; i < Application.instance.device.getDeviceCaps().miscCaps.maxTexCoordIndex; i++){
+                            if (that._lightModel?.isTexCoordIndexUsed(i)) {
+                                this.$outputs[`texcoord${i}`] = that._lightModel.calculateTexCoord(this, i);
+                            }
+                        }
+                    }
+                });
+            },
+            fragment () {
+                MESH_MATERIAL.FRAGMENT_SHADER(this, ctx);
+                if (that._alphaCutoff > 0) {
+                    this.alphaCutoff = pb.float().uniform(2);
+                }
+                if (useLightModel) {
+                    that._lightModel?.setupUniforms(this, ctx);
+                }
+                if (ctx.renderPass.type === RENDER_PASS_TYPE_FORWARD) {
+                    const blend = that._alphaBlend || that._opacity < 1;
+                    if (blend) {
+                        this.opacity = pb.float().uniform(2);
+                    }
+                    this.$outputs.outColor = pb.vec4();
+                    pb.main(function() {
+                        this.$l.litColor = that._lightModel ? forwardComputeLighting(this, that._lightModel, ctx) : pb.vec4(1);
+                        MESH_MATERIAL.DISCARD_IF_CLIPPED(this);
+                        if (!blend && that._alphaCutoff === 0) {
+                            this.litColor.a = 1;
+                        } else if (blend) {
+                            this.litColor.a = pb.mul(this.litColor.a, this.opacity);
+                        }
+                        if (that._alphaCutoff > 0) {
+                            this.$if(pb.lessThan(this.litColor.a, this.alphaCutoff), function() {
+                                pb.discard();
+                            });
+                        }
+                        this.litColor = pb.vec4(pb.mul(this.litColor.rgb, this.litColor.a), this.litColor.a);
+                        MESH_MATERIAL.APPLY_FOG(this, this.litColor, ctx);
+                        this.$outputs.outColor = MESH_MATERIAL.FRAGMENT_OUTPUT(this, this.litColor);
+                    });
+                } else if (ctx.renderPass.type === RENDER_PASS_TYPE_DEPTH_ONLY) {
+                    this.$outputs.outColor = pb.vec4();
+                    pb.main(function() {
+                        MESH_MATERIAL.DISCARD_IF_CLIPPED(this);
+                        if (that._alphaCutoff > 0) {
+                            this.$l.albedoColor = that._lightModel.calculateAlbedo(this);
+                            this.$if(pb.lessThan(this.albedoColor.a, this.alphaCutoff), function() {
+                                pb.discard();
+                            });
+                        }
+                        this.$l.depth = nonLinearDepthToLinearNormalized(this, this.$builtins.fragCoord.z);
+                        if (Application.instance.device.type === 'webgl') {
+                            this.$outputs.outColor = encodeNormalizedFloatToRGBA(this, this.depth);
+                        } else {
+                            this.$outputs.outColor = pb.vec4(this.depth, 0, 0, 1);
+                        }
+                    });
+                } else if (ctx.renderPass.type === RENDER_PASS_TYPE_SHADOWMAP) {
+                    this.$outputs.outColor = pb.vec4();
+                    pb.main(function() {
+                        MESH_MATERIAL.DISCARD_IF_CLIPPED(this);
+                        if (that._alphaCutoff > 0) {
+                            this.$l.albedoColor = that._lightModel.calculateAlbedo(this);
+                            this.$if(pb.lessThan(this.albedoColor.a, this.alphaCutoff), function() {
+                                pb.discard();
+                            });
+                        }
+                        const shadowMapParams = ctx.shadowMapInfo.get(ctx.renderPass.light);
+                        this.$outputs.outColor = shadowMapParams.impl.computeShadowMapDepth(shadowMapParams, this);
+                    });
+                } else {
+                    throw new Error(`unknown render pass type: ${ctx.renderPass.type}`);
+                }
+            }
+        });
+        //console.log(program.getShaderSource('fragment'));
+        return program;
+    }
+}
+
+export { StandardMaterial };
+//# sourceMappingURL=standard.js.map

package/dist/material/standard.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"standard.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/material/terrainlightmodel.js

@@ -0,0 +1,259 @@
+import { PBRLightModelMR } from './lightmodel.js';
+import { Vector4 } from '@zephyr3d/base';
+import { RENDER_PASS_TYPE_FORWARD } from '../values.js';
+import { Application } from '../app.js';
+import { drawFullscreenQuad } from '../render/helper.js';
+
+const TEX_NAME_SPLATMAP = 'splat';
+const TEX_NAME_DETAIL_COLOR = 'detailColor';
+const TEX_NAME_DETAIL_NORMAL = 'detailNormal';
+class TerrainLightModel extends PBRLightModelMR {
+    static _metallicRoughnessGenerationProgram = null;
+    static _metallicRoughnessGenerationBindGroup = null;
+    _options;
+    _uvScales;
+    _numDetailMaps;
+    constructor(options){
+        super();
+        this._normalMapMode = 'object-space';
+        this._options = null;
+        this._numDetailMaps = 0;
+        this._uvScales = null;
+        if (options && options.splatMap && options.detailMaps && options.detailMaps.albedoTextures) {
+            this._options = Object.assign({}, options);
+            const albedoTextures = this._options.detailMaps.albedoTextures;
+            this._numDetailMaps = Array.isArray(albedoTextures) ? albedoTextures.length : albedoTextures.depth;
+            if (!this._numDetailMaps) {
+                throw new Error(`TerrainLightModel(): Invalid detail textures`);
+            }
+            if (this._numDetailMaps > 4) {
+                throw new Error(`TerrainLightModel(): The maximum detail levels is 4`);
+            }
+            if (!this._options.detailMaps.uvScale || this._options.detailMaps.uvScale.length !== this._numDetailMaps) {
+                throw new Error(`TerrainLightModel(): Invalid uv scale`);
+            }
+            this._uvScales = new Float32Array(this._numDetailMaps * 4);
+            for(let i = 0; i < this._numDetailMaps; i++){
+                this._uvScales[i * 4] = this._options.detailMaps.uvScale[i];
+                this._uvScales[i * 4 + 1] = 1;
+                this._uvScales[i * 4 + 2] = 0.01;
+                this._uvScales[i * 4 + 3] = 0.99;
+            }
+            if (this._options.detailMaps.metallic) {
+                if (this._options.detailMaps.metallic.length !== this._numDetailMaps) {
+                    throw new Error(`TerrainLightModel(): Invalid metallic values`);
+                }
+                for(let i = 0; i < this._numDetailMaps; i++){
+                    this._uvScales[i * 4 + 2] = this._options.detailMaps.metallic[i];
+                }
+            }
+            if (this._options.detailMaps.roughness) {
+                if (this._options.detailMaps.roughness.length !== this._numDetailMaps) {
+                    throw new Error(`TerrainLightModel(): Invalid roughness values`);
+                }
+                for(let i = 0; i < this._numDetailMaps; i++){
+                    this._uvScales[i * 4 + 3] = this._options.detailMaps.roughness[i];
+                }
+            }
+            const normalTextures = options.detailMaps.normalTextures;
+            if (normalTextures) {
+                const m = Array.isArray(normalTextures) ? normalTextures.length : normalTextures.depth;
+                if (m !== this._numDetailMaps) {
+                    throw new Error(`TerrainLightModel(): The number of normal textures not match the number of albedo textures`);
+                }
+                if (options.detailMaps.normalScale) {
+                    if (options.detailMaps.normalScale.length !== this._numDetailMaps) {
+                        throw new Error(`TerrainLightModel(): Invalid normal scale`);
+                    }
+                    for(let i = 0; i < this._numDetailMaps; i++){
+                        this._uvScales[i * 4 + 1] = options.detailMaps.normalScale[i];
+                    }
+                }
+            }
+            this._options = Object.assign({}, options);
+            this._options.splatMapTexCoordIndex = this.setTextureOptions(TEX_NAME_SPLATMAP, this._options.splatMap, null, 0, null);
+            if (Array.isArray(albedoTextures)) {
+                this._options.detailMaps.albedoTexCoordIndex = [];
+                for(let i = 0; i < albedoTextures.length; i++){
+                    if (!albedoTextures[i]) {
+                        throw new Error(`TerrainLightModel(): Invalid detail albedo texture`);
+                    }
+                    this._options.detailMaps.albedoTexCoordIndex[i] = this.setTextureOptions(`${TEX_NAME_DETAIL_COLOR}${i}`, albedoTextures[i], null, -1, null);
+                    albedoTextures[i].samplerOptions = {
+                        addressU: 'repeat',
+                        addressV: 'repeat'
+                    };
+                }
+            } else {
+                this._options.detailMaps.albedoTexCoordIndex = this.setTextureOptions(TEX_NAME_DETAIL_COLOR, albedoTextures, null, -1, null);
+                albedoTextures.samplerOptions = {
+                    addressU: 'repeat',
+                    addressV: 'repeat'
+                };
+            }
+            if (Array.isArray(normalTextures)) {
+                this._options.detailMaps.normalTexCoordIndex = [];
+                for(let i = 0; i < normalTextures.length; i++){
+                    if (!normalTextures[i]) {
+                        throw new Error(`TerrainLightModel(): Invalid detail normal texture`);
+                    }
+                    this._options.detailMaps.normalTexCoordIndex[i] = this.setTextureOptions(`${TEX_NAME_DETAIL_NORMAL}${i}`, normalTextures[i], null, -1, null);
+                    normalTextures[i].samplerOptions = {
+                        addressU: 'repeat',
+                        addressV: 'repeat'
+                    };
+                }
+            } else if (normalTextures) {
+                this._options.detailMaps.normalTexCoordIndex = this.setTextureOptions(TEX_NAME_DETAIL_NORMAL, normalTextures, null, -1, null);
+                normalTextures.samplerOptions = {
+                    addressU: 'repeat',
+                    addressV: 'repeat'
+                };
+            }
+        }
+        this.setMetallicMap(this.generateMetallicRoughnessMap(), null, -1);
+    }
+    setupUniforms(scope, ctx) {
+        super.setupUniforms(scope, ctx);
+        const pb = scope.$builder;
+        if (pb.shaderKind === 'fragment' && this._options) {
+            scope.detailScales = pb.vec4[this._numDetailMaps]().uniform(2);
+        }
+    }
+    applyUniforms(bindGroup, ctx) {
+        super.applyUniforms(bindGroup, ctx);
+        if (ctx.renderPass.type === RENDER_PASS_TYPE_FORWARD) {
+            if (this._options) {
+                bindGroup.setValue('detailScales', this._uvScales);
+            }
+        }
+    }
+    fillSurfaceData(scope, envLight) {
+        super.fillSurfaceData(scope, envLight);
+    }
+    calculateAlbedo(scope) {
+        if (!this._options) {
+            return super.calculateAlbedo(scope);
+        }
+        const that = this;
+        const pb = scope.$builder;
+        const funcName = 'getTerrainAlbedo';
+        pb.func(funcName, [], function() {
+            this.$l.mask = pb.textureSample(this[that.getTextureUniformName(TEX_NAME_SPLATMAP)], this.$inputs[`texcoord${that._options.splatMapTexCoordIndex}`]);
+            this.$l.color = pb.vec3(0);
+            const useTextureArray = !Array.isArray(that._options.detailMaps.albedoTextures);
+            for(let i = 0; i < that._numDetailMaps; i++){
+                const texCoordIndex = useTextureArray ? that._options.detailMaps.albedoTexCoordIndex : that._options.detailMaps.albedoTexCoordIndex[i];
+                const uv = pb.mul(this.$inputs[`texcoord${texCoordIndex}`], this.detailScales.at(i).x);
+                const sample = useTextureArray ? pb.textureArraySample(this[that.getTextureUniformName(TEX_NAME_DETAIL_COLOR)], uv, i).rgb : pb.textureSample(this[that.getTextureUniformName(`${TEX_NAME_DETAIL_COLOR}${i}`)], uv).rgb;
+                this.color = pb.add(this.color, pb.mul(sample, this.mask[i]));
+            }
+            this.$return(pb.vec4(this.color, 1));
+        });
+        return pb.getGlobalScope()[funcName]();
+    }
+    calculateNormal(scope, worldPosition, worldNormal, worldTangent, worldBinormal) {
+        scope.$l.terrainBaseNormal = super.calculateNormal(scope, worldPosition, worldNormal, worldTangent, worldBinormal);
+        const pb = scope.$builder;
+        let calcNormal = false;
+        if (this._options && this._options.detailMaps.normalTextures) {
+            if (Array.isArray(this._options.detailMaps.normalTextures)) {
+                for(let i = 0; i < this._options.detailMaps.normalTextures.length; i++){
+                    const tex = scope[this.getTextureUniformName(`${TEX_NAME_DETAIL_NORMAL}${i}`)];
+                    const scale = scope.detailScales.at(i).y;
+                    const texCoord = pb.mul(scope.$inputs[`texcoord${this._options.detailMaps.normalTexCoordIndex[i]}`], scope.detailScales.at(i).x);
+                    scope.terrainBaseNormal.normal = pb.add(scope.terrainBaseNormal.normal, this.sampleNormalMapWithTBN(scope, tex, texCoord, scale, scope.terrainBaseNormal.TBN));
+                    calcNormal = true;
+                }
+            } else {
+                const tex = scope[this.getTextureUniformName(TEX_NAME_DETAIL_NORMAL)];
+                for(let i = 0; i < this._numDetailMaps; i++){
+                    const scale = scope.detailScales.at(i).y;
+                    const texCoord = pb.mul(scope.$inputs[`texcoord${this._options.detailMaps.normalTexCoordIndex}`], scope.detailScales.at(i).x);
+                    const pixel = pb.sub(pb.mul(pb.textureArraySample(tex, texCoord, i).rgb, 2), pb.vec3(1));
+                    const normalTex = pb.mul(pixel, pb.vec3(pb.vec3(scale).xx, 1));
+                    const detailNormal = pb.normalize(pb.mul(scope.terrainBaseNormal.TBN, normalTex));
+                    scope.terrainBaseNormal.normal = pb.add(scope.terrainBaseNormal.normal, detailNormal);
+                    calcNormal = true;
+                }
+            }
+        }
+        if (calcNormal) {
+            scope.terrainBaseNormal.normal = pb.normalize(scope.terrainBaseNormal.normal);
+        }
+        return scope.terrainBaseNormal;
+    }
+    generateMetallicRoughnessMap() {
+        const device = Application.instance.device;
+        if (!this._options) {
+            const tex = device.createTexture2D('rgba8unorm', 1, 1, {
+                samplerOptions: {
+                    mipFilter: 'none'
+                }
+            });
+            tex.update(new Uint8Array([
+                0,
+                1,
+                0,
+                0
+            ]), 0, 0, 1, 1);
+            tex.name = 'TerrainMetallicRoughnessMap';
+            return tex;
+        }
+        if (!TerrainLightModel._metallicRoughnessGenerationProgram) {
+            TerrainLightModel._metallicRoughnessGenerationProgram = device.buildRenderProgram({
+                vertex (pb) {
+                    this.$inputs.pos = pb.vec2().attrib('position');
+                    this.$outputs.uv = pb.vec2();
+                    pb.main(function() {
+                        this.$builtins.position = pb.vec4(this.$inputs.pos, 0, 1);
+                        this.$outputs.uv = pb.add(pb.mul(this.$inputs.pos.xy, 0.5), pb.vec2(0.5));
+                        if (device.type === 'webgpu') {
+                            this.$builtins.position.y = pb.neg(this.$builtins.position.y);
+                        }
+                    });
+                },
+                fragment (pb) {
+                    this.$outputs.outColor = pb.vec4();
+                    this.roughness = pb.vec4().uniform(0);
+                    this.metallic = pb.vec4().uniform(0);
+                    this.splatMap = pb.tex2D().uniform(0);
+                    pb.main(function() {
+                        this.weights = pb.textureSample(this.splatMap, this.$inputs.uv);
+                        this.roughnessValue = pb.dot(this.weights, this.roughness);
+                        this.metallicValue = pb.dot(this.weights, this.metallic);
+                        this.$outputs.outColor = pb.vec4(0, this.roughnessValue, this.metallicValue, 1);
+                    });
+                }
+            });
+            TerrainLightModel._metallicRoughnessGenerationBindGroup = device.createBindGroup(TerrainLightModel._metallicRoughnessGenerationProgram.bindGroupLayouts[0]);
+        }
+        const roughnessValues = Vector4.one();
+        const metallicValues = Vector4.zero();
+        for(let i = 0; i < this._numDetailMaps; i++){
+            metallicValues[i] = this._uvScales[i * 4 + 2];
+            roughnessValues[i] = this._uvScales[i * 4 + 3];
+        }
+        const tex = device.createTexture2D('rgba8unorm', this._options.splatMap.width, this._options.splatMap.height);
+        tex.name = 'TerrainMetallicRoughnessMap';
+        const program = TerrainLightModel._metallicRoughnessGenerationProgram;
+        const bindgroup = TerrainLightModel._metallicRoughnessGenerationBindGroup;
+        bindgroup.setValue('roughness', roughnessValues);
+        bindgroup.setValue('metallic', metallicValues);
+        bindgroup.setTexture('splatMap', this._options.splatMap);
+        const fb = device.createFrameBuffer([
+            tex
+        ], null);
+        device.pushDeviceStates();
+        device.setFramebuffer(fb);
+        device.setProgram(program);
+        device.setBindGroup(0, bindgroup);
+        drawFullscreenQuad();
+        device.popDeviceStates();
+        fb.dispose();
+        return tex;
+    }
+}
+
+export { TerrainLightModel };
+//# sourceMappingURL=terrainlightmodel.js.map

package/dist/material/terrainlightmodel.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"terrainlightmodel.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}