@zephyr3d/scene 0.2.0 → 0.3.0

package/dist/index.js

@@ -15,7 +15,7 @@ export { SceneRenderer } from './render/renderer.js';
 export { LightPass } from './render/lightpass.js';
 export { ShadowMapPass } from './render/shadowmap_pass.js';
 export { DepthPass } from './render/depthpass.js';
-export { RenderQueue } from './render/render_queue.js';
+export { InstanceBindGroupAllocator, RenderQueue } from './render/render_queue.js';
 export { SkyRenderer } from './render/sky.js';
 export { Clipmap } from './render/clipmap.js';
 export { EnvConstantAmbient, EnvHemisphericAmbient, EnvIBL, EnvironmentLighting } from './render/envlight.js';
@@ -51,6 +51,7 @@ export { Mesh } from './scene/mesh.js';
 export { Model } from './scene/model.js';
 export { Octree, OctreeNode, OctreeNodeChunk, OctreePlacement } from './scene/octree.js';
 export { SceneNode } from './scene/scene_node.js';
+export { BatchGroup } from './scene/batchgroup.js';
 export { Terrain } from './scene/terrain/terrain.js';
 export { HeightField, HeightfieldBBoxTree } from './scene/terrain/heightfield.js';
 export { TerrainPatch } from './scene/terrain/patch.js';

package/dist/index.js.map

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

package/dist/material/blinn.js

@@ -3,14 +3,14 @@ import { mixinVertexColor } from './mixins/vertexcolor.js';
 import { mixinBlinnPhong } from './mixins/lightmodel/blinnphong.js';
 import { ShaderHelper } from './shader/helper.js';
 
-/**
- * Blinn material
- * @public
+/**
+ * Blinn material
+ * @public
  */ class BlinnMaterial extends applyMaterialMixins(MeshMaterial, mixinBlinnPhong, mixinVertexColor) {
     /** @internal */ static FEATURE_VERTEX_NORMAL = this.defineFeature();
     /** @internal */ static FEATURE_VERTEX_TANGENT = this.defineFeature();
-    /**
-   * Creates an instance of BlinnMaterial class
+    /**
+   * Creates an instance of BlinnMaterial class
    */ constructor(){
         super();
         this.useFeature(BlinnMaterial.FEATURE_VERTEX_NORMAL, true);

package/dist/material/grassmaterial.js

@@ -5,18 +5,18 @@ import { RENDER_PASS_TYPE_LIGHT } from '../values.js';
 import { ShaderHelper } from './shader/helper.js';
 import { mixinFoliage } from './mixins/foliage.js';
 
-/**
- * Terrain grass material
- * @public
+/**
+ * Terrain grass material
+ * @public
  */ class GrassMaterial extends applyMaterialMixins(MeshMaterial, mixinPBRMetallicRoughness, mixinFoliage) {
     /** @internal */ _terrainSize;
     /** @internal */ _terrainNormalMap;
     /** @internal */ _textureSize;
-    /**
-   * Creates an instance of GrassMaterial class
-   * @param terrainSize - terrain size
-   * @param normalMap - normal map
-   * @param grassTexture - grass texture
+    /**
+   * Creates an instance of GrassMaterial class
+   * @param terrainSize - terrain size
+   * @param normalMap - normal map
+   * @param grassTexture - grass texture
    */ constructor(terrainSize, normalMap, grassTexture){
         super();
         this.metallic = 0;
@@ -31,15 +31,15 @@ import { mixinFoliage } from './mixins/foliage.js';
             this._textureSize.setXY(grassTexture.width, grassTexture.height);
         }
     }
-    /**
-   * {@inheritDoc MeshMaterial.isTransparentPass}
-   * @override
+    /**
+   * {@inheritDoc MeshMaterial.isTransparentPass}
+   * @override
    */ isTransparentPass(pass) {
         return false;
     }
-    /**
-   * {@inheritDoc Material.supportLighting}
-   * @override
+    /**
+   * {@inheritDoc Material.supportLighting}
+   * @override
    */ supportLighting() {
         return true;
     }

package/dist/material/material.js

@@ -4,48 +4,6 @@ import { Application } from '../app.js';
 import { QUEUE_OPAQUE, RENDER_PASS_TYPE_LIGHT, RENDER_PASS_TYPE_SHADOWMAP, RENDER_PASS_TYPE_DEPTH } from '../values.js';
 import { ShaderHelper } from './shader/helper.js';
 
-class InstanceBindGroupPool {
-    _bindGroups;
-    _frameStamp;
-    constructor(){
-        this._bindGroups = [];
-        this._frameStamp = -1;
-    }
-    apply(hash, index, worldMatrices) {
-        const device = Application.instance.device;
-        const maxSize = device.getDeviceCaps().shaderCaps.maxUniformBufferSize;
-        if (device.frameInfo.frameCounter !== this._frameStamp) {
-            this._frameStamp = device.frameInfo.frameCounter;
-            for (const bindGroup of this._bindGroups){
-                bindGroup.freeSize = maxSize;
-            }
-        }
-        let bindGroupIndex = -1;
-        for(let i = 0; i < this._bindGroups.length; i++){
-            if (this._bindGroups[i].freeSize >= worldMatrices.length * 64) {
-                bindGroupIndex = i;
-                break;
-            }
-        }
-        if (bindGroupIndex < 0) {
-            const program = Material.getProgramByHashIndex(hash, index);
-            const bindGroup = program?.bindGroupLayouts[3] ? device.createBindGroup(program.bindGroupLayouts[3]) : null;
-            this._bindGroups.push({
-                bindGroup: bindGroup,
-                freeSize: maxSize
-            });
-            bindGroupIndex = this._bindGroups.length - 1;
-        }
-        const bindGroup = this._bindGroups[bindGroupIndex];
-        const offset = (maxSize - bindGroup.freeSize) / 64;
-        for (const matrix of worldMatrices){
-            bindGroup.bindGroup.setRawData(ShaderHelper.getWorldMatricesUniformName(), maxSize - bindGroup.freeSize, matrix);
-            bindGroup.freeSize -= 64;
-        }
-        device.setBindGroup(3, bindGroup.bindGroup);
-        return offset;
-    }
-}
 /**
  * Base class for any kind of materials
  *
@@ -66,7 +24,7 @@ class InstanceBindGroupPool {
         inactiveTimeDuration: 30000
     };
     /** @internal */ static _boneMatrixTextureSampler = null;
-    /** @internal */ static _instanceBindGroupPool = new InstanceBindGroupPool();
+    /** @internal */ //private static _instanceBindGroupPool: InstanceBindGroupPool = new InstanceBindGroupPool();
     /** @internal */ static _drawableBindGroupMap = new WeakMap();
     /** @internal */ _numPasses;
     /** @internal */ _hash;
@@ -88,7 +46,7 @@ class InstanceBindGroupPool {
         this._optionTag = 0;
         this._materialBindGroup = null;
     }
-    /** Unique identifier of the material */ get id() {
+    /** Unique identifier of the material */ get instanceId() {
         return this._id;
     }
     get numPasses() {
@@ -125,7 +83,7 @@ class InstanceBindGroupPool {
         return true;
     }
     /** Returns true if this material supports geometry instancing  */ isBatchable() {
-        return true;
+        return false;
     }
     /**
    * Draws a primitive using this material
@@ -146,7 +104,6 @@ class InstanceBindGroupPool {
    * @param ctx - The context of current drawing task
    * @returns true if succeeded, otherwise false
    */ beginDraw(pass, ctx) {
-        const numInstances = ctx.instanceData?.worldMatrices?.length || 1;
         const device = Application.instance.device;
         const programInfo = this.getOrCreateProgram(ctx, pass);
         if (programInfo) {
@@ -159,7 +116,7 @@ class InstanceBindGroupPool {
             }
             this._materialBindGroup = this.applyMaterialBindGroups(ctx, hash, pass);
             if (pass === 0) {
-                if (numInstances > 1) {
+                if (ctx.instanceData) {
                     this.applyInstanceBindGroups(ctx, hash);
                 } else {
                     this.applyDrawableBindGroups(ctx, hash);
@@ -203,7 +160,7 @@ class InstanceBindGroupPool {
    */ getOrCreateProgram(ctx, pass) {
         const programMap = Material._programMap;
         const renderPassType = ctx.renderPass.type;
-        const hash = `${this.getHash(renderPassType, pass)}:${!!ctx.target.getBoneMatrices()}:${Number(!!(ctx.instanceData?.worldMatrices.length > 1))}:${ctx.renderPassHash}`;
+        const hash = `${this.getHash(renderPassType, pass)}:${!!ctx.target.getBoneMatrices()}:${Number(!!ctx.instanceData)}:${ctx.renderPassHash}`;
         let programInfo = programMap[hash];
         if (!programInfo || programInfo.programs[renderPassType] === undefined) {
             const program = this.createProgram(ctx, pass) ?? null;
@@ -363,11 +320,20 @@ class InstanceBindGroupPool {
         return drawableBindGroup;
     }
     /** @internal */ applyInstanceBindGroups(ctx, hash) {
-        const index = ctx.renderPass.type;
-        const offset = Material._instanceBindGroupPool.apply(hash, index, ctx.instanceData.worldMatrices);
-        const bindGroup = this.getDrawableBindGroup(ctx, hash).bindGroup?.[index];
+        if (ctx.instanceData) {
+            if (ctx.instanceData.bindGroup.dirty) {
+                ctx.instanceData.bindGroup.bindGroup.setRawData(ShaderHelper.getWorldMatricesUniformName(), 0, ctx.instanceData.bindGroup.buffer, 0, ctx.instanceData.currentSize * 4);
+                ctx.instanceData.bindGroup.dirty = false;
+            }
+            Application.instance.device.setBindGroup(3, ctx.instanceData.bindGroup.bindGroup ?? null);
+        } else {
+            Application.instance.device.setBindGroup(3, null);
+        }
+        const bindGroup = this.getDrawableBindGroup(ctx, hash).bindGroup?.[ctx.renderPass.type];
         if (bindGroup) {
-            bindGroup.setValue(ShaderHelper.getInstanceBufferOffsetUniformName(), offset);
+            if (ctx.instanceData) {
+                bindGroup.setValue(ShaderHelper.getInstanceBufferStrideUniformName(), ctx.instanceData.stride);
+            }
             Application.instance.device.setBindGroup(1, bindGroup);
         } else {
             Application.instance.device.setBindGroup(1, null);
@@ -460,8 +426,8 @@ class InstanceBindGroupPool {
    */ drawPrimitive(pass, primitive, ctx, numInstances) {
         if (numInstances > 0) {
             primitive.drawInstanced(numInstances);
-        } else if (ctx.instanceData?.worldMatrices.length > 1) {
-            primitive.drawInstanced(ctx.instanceData.worldMatrices.length);
+        } else if (ctx.instanceData) {
+            primitive.drawInstanced(ctx.instanceData.currentSize / ctx.instanceData.stride);
         } else {
             primitive.draw();
         }
@@ -493,6 +459,18 @@ class InstanceBindGroupPool {
    */ _createHash(renderPassType) {
         return '';
     }
+    /**
+   * True if this is a material instance
+   * @internal
+   **/ get $isInstance() {
+        return false;
+    }
+    /**
+   * Returns the instance uniforms if this is a material instance
+   * @internal
+   **/ get $instanceUniforms() {
+        return null;
+    }
 }
 
 export { Material };

package/dist/material/material.js.map

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

package/dist/material/meshmaterial.js

@@ -4,14 +4,15 @@ import { Material } from './material.js';
 import { encodeNormalizedFloatToRGBA } from '../shaders/misc.js';
 import { Application } from '../app.js';
 import { ShaderHelper } from './shader/helper.js';
+import { Vector4, Vector3, Vector2 } from '@zephyr3d/base';
 
-/**
- * Apply material mixins to specific material class
- * @param target - Material class
- * @param mixins - mixins
- * @returns Mixed mesh material class
- *
- * @public
+/**
+ * Apply material mixins to specific material class
+ * @param target - Material class
+ * @param mixins - mixins
+ * @returns Mixed mesh material class
+ *
+ * @public
  */ function applyMaterialMixins(target, ...mixins) {
     let r = target;
     for (const m of mixins){
@@ -22,11 +23,12 @@ import { ShaderHelper } from './shader/helper.js';
 let FEATURE_ALPHATEST = 0;
 let FEATURE_ALPHABLEND = 0;
 let FEATURE_ALPHATOCOVERAGE = 0;
-/**
- * Base class for any kind of mesh materials
- *
- * @public
+/**
+ * Base class for any kind of mesh materials
+ *
+ * @public
  */ class MeshMaterial extends Material {
+    /** @internal */ static INSTANCE_UNIFORMS = [];
     /** @internal */ static NEXT_FEATURE_INDEX = 3;
     /** @internal */ _featureStates;
     /** @internal */ _alphaCutoff;
@@ -35,9 +37,9 @@ let FEATURE_ALPHATOCOVERAGE = 0;
     /** @internal */ _opacity;
     /** @internal */ _ctx;
     /** @internal */ _materialPass;
-    /**
-   * Creates an instance of MeshMaterial class
-   * @param args - constructor arguments
+    /**
+   * Creates an instance of MeshMaterial class
+   * @param args - constructor arguments
    */ constructor(...args){
         super();
         this._featureStates = [];
@@ -56,6 +58,136 @@ let FEATURE_ALPHATOCOVERAGE = 0;
         this.NEXT_FEATURE_INDEX++;
         return val;
     }
+    /** Define instance uniform index */ static defineInstanceUniform(prop, type) {
+        if (this.INSTANCE_UNIFORMS.findIndex((val)=>val[0] === prop) >= 0) {
+            throw new Error(`${this.name}.defineInstanceUniform(): ${prop} was already defined`);
+        }
+        if (type !== 'float' && type !== 'vec2' && type !== 'vec3' && type !== 'vec4') {
+            throw new Error(`${this.name}.defineInstanceUniform(): invalid uniform type ${type}`);
+        }
+        this.INSTANCE_UNIFORMS = [
+            ...this.INSTANCE_UNIFORMS,
+            [
+                prop,
+                type
+            ]
+        ];
+        return this.INSTANCE_UNIFORMS.length - 1;
+    }
+    getInstancedUniform(scope, uniformIndex) {
+        //return ShaderHelper.getInstancedUniform(scope, 4 + uniformIndex);
+        const pb = scope.$builder;
+        const instanceID = pb.shaderKind === 'vertex' ? scope.$builtins.instanceIndex : scope.$inputs.zInstanceID;
+        const uniformName = ShaderHelper.getWorldMatricesUniformName();
+        const strideName = ShaderHelper.getInstanceBufferStrideUniformName();
+        return scope[uniformName].at(pb.add(pb.mul(scope[strideName], instanceID), 4 + uniformIndex));
+    }
+    /** Create material instance */ createInstance() {
+        const instanceUniforms = this.constructor.INSTANCE_UNIFORMS;
+        const uniformsHolder = instanceUniforms.length > 0 ? new Float32Array(4 * instanceUniforms.length) : null;
+        const batchable = Application.instance.device.type !== 'webgl';
+        // Copy original uniform values
+        for(let i = 0; i < instanceUniforms.length; i++){
+            const [prop, type] = instanceUniforms[i];
+            const value = this[prop];
+            switch(type){
+                case 'float':
+                    {
+                        uniformsHolder[i * 4] = Number(value);
+                        break;
+                    }
+                case 'vec2':
+                    {
+                        if (!(value instanceof Vector2)) {
+                            throw new Error(`Instance uniform property ${prop} must be of type Vector2`);
+                        }
+                        uniformsHolder[i * 4] = value.x;
+                        uniformsHolder[i * 4 + 1] = value.y;
+                        break;
+                    }
+                case 'vec3':
+                    {
+                        if (!(value instanceof Vector3)) {
+                            throw new Error(`Instance uniform property ${prop} must be of type Vector3`);
+                        }
+                        uniformsHolder[i * 4] = value.x;
+                        uniformsHolder[i * 4 + 1] = value.y;
+                        uniformsHolder[i * 4 + 2] = value.z;
+                        break;
+                    }
+                case 'vec4':
+                    {
+                        if (!(value instanceof Vector4)) {
+                            throw new Error(`Instance uniform property ${prop} must be of type Vector4`);
+                        }
+                        uniformsHolder[i * 4] = value.x;
+                        uniformsHolder[i * 4 + 1] = value.y;
+                        uniformsHolder[i * 4 + 2] = value.z;
+                        uniformsHolder[i * 4 + 3] = value.w;
+                        break;
+                    }
+            }
+        }
+        const handler = {
+            get (target, prop, receiver) {
+                if (prop === 'isBatchable') {
+                    return ()=>batchable;
+                } else if (prop === '$instanceUniforms') {
+                    return uniformsHolder;
+                } else if (prop === '$isInstance') {
+                    return true;
+                } else if (prop === 'beginDraw') {
+                    if (!batchable || !target.isBatchable()) {
+                        for(let i = 0; i < instanceUniforms.length; i++){
+                            const name = instanceUniforms[i][0];
+                            const type = instanceUniforms[i][1];
+                            switch(type){
+                                case 'float':
+                                    target[name] = uniformsHolder[i * 4];
+                                    break;
+                                case 'vec2':
+                                    target[name] = new Vector2(uniformsHolder[i * 4], uniformsHolder[i * 4 + 1]);
+                                    break;
+                                case 'vec3':
+                                    target[name] = new Vector3(uniformsHolder[i * 4], uniformsHolder[i * 4 + 1], uniformsHolder[i * 4 + 2]);
+                                case 'vec4':
+                                    target[name] = new Vector4(uniformsHolder[i * 4], uniformsHolder[i * 4 + 1], uniformsHolder[i * 4 + 2], uniformsHolder[i * 4 + 3]);
+                            }
+                        }
+                    }
+                } else if (typeof prop === 'string') {
+                    const index = instanceUniforms.findIndex((val)=>val[0] === prop);
+                    if (index >= 0) {
+                        switch(instanceUniforms[index][1]){
+                            case 'float':
+                                return uniformsHolder[index * 4];
+                            case 'vec2':
+                                return new Vector2(uniformsHolder[index * 4], uniformsHolder[index * 4 + 1]);
+                            case 'vec3':
+                                return new Vector3(uniformsHolder[index * 4], uniformsHolder[index * 4 + 1], uniformsHolder[index * 4 + 2]);
+                            case 'vec4':
+                                return new Vector4(uniformsHolder[index * 4], uniformsHolder[index * 4 + 1], uniformsHolder[index * 4 + 2], uniformsHolder[index * 4 + 3]);
+                        }
+                    }
+                }
+                return Reflect.get(target, prop, receiver);
+            },
+            set (target, prop, value, receiver) {
+                const i = instanceUniforms.findIndex((val)=>val[0] === prop);
+                if (i >= 0) {
+                    if (typeof value === 'number') {
+                        uniformsHolder[i * 4 + 0] = value;
+                    } else if (value instanceof Float32Array) {
+                        uniformsHolder.set(value);
+                    }
+                    return true;
+                } else {
+                    return Reflect.set(target, prop, value, receiver);
+                }
+            }
+        };
+        return new Proxy(this, handler);
+    }
     /** Draw context for shader creation */ get drawContext() {
         return this._ctx;
     }
@@ -107,10 +239,10 @@ let FEATURE_ALPHATOCOVERAGE = 0;
     /** Returns true if shading of the material will be affected by lights  */ supportLighting() {
         return true;
     }
-    /**
-   * Update render states according to draw context and current material pass
-   * @param pass - Current material pass
-   * @param ctx - Draw context
+    /**
+   * Update render states according to draw context and current material pass
+   * @param pass - Current material pass
+   * @param ctx - Draw context
    */ updateRenderStates(pass, ctx) {
         const blending = this.featureUsed(FEATURE_ALPHABLEND) || ctx.lightBlending;
         const a2c = this.featureUsed(FEATURE_ALPHATOCOVERAGE);
@@ -144,12 +276,12 @@ let FEATURE_ALPHATOCOVERAGE = 0;
             this.stateSet.defaultRasterizerState();
         }
     }
-    /**
-   * Submit Uniform values before rendering with this material.
-   *
-   * @param bindGroup - Bind group for this material
-   * @param ctx - Draw context
-   * @param pass - Current pass of the material
+    /**
+   * Submit Uniform values before rendering with this material.
+   *
+   * @param bindGroup - Bind group for this material
+   * @param ctx - Draw context
+   * @param pass - Current pass of the material
    */ applyUniformValues(bindGroup, ctx, pass) {
         if (this.featureUsed(FEATURE_ALPHATEST)) {
             bindGroup.setValue('zAlphaCutoff', this._alphaCutoff);
@@ -158,21 +290,21 @@ let FEATURE_ALPHATOCOVERAGE = 0;
             bindGroup.setValue('zOpacity', this._opacity);
         }
     }
-    /**
-   * Determine which queue should be used to render this material.
-   * @returns QUEUE_TRANSPARENT or QUEUE_OPAQUE
+    /**
+   * Determine which queue should be used to render this material.
+   * @returns QUEUE_TRANSPARENT or QUEUE_OPAQUE
    */ getQueueType() {
         return this.isTransparentPass(0) ? QUEUE_TRANSPARENT : QUEUE_OPAQUE;
     }
-    /**
-   * Determine if a certain pass of this material is translucent.
-   * @param pass - Pass of the material
-   * @returns True if it is translucent, otherwise false.
+    /**
+   * Determine if a certain pass of this material is translucent.
+   * @param pass - Pass of the material
+   * @returns True if it is translucent, otherwise false.
    */ isTransparentPass(pass) {
         return this.featureUsed(FEATURE_ALPHABLEND);
     }
-    /**
-   * {@inheritdoc Material.beginDraw}
+    /**
+   * {@inheritdoc Material.beginDraw}
    */ beginDraw(pass, ctx) {
         this.updateRenderStates(pass, ctx);
         return super.beginDraw(pass, ctx);
@@ -185,51 +317,51 @@ let FEATURE_ALPHATOCOVERAGE = 0;
         }
         return this._createProgram(pb, ctx, pass);
     }
-    /**
-   * Check if a feature is in use for given render pass type.
-   *
-   * @param feature - The feature index
-   * @returns true if the feature is in use, otherwise false.
+    /**
+   * Check if a feature is in use for given render pass type.
+   *
+   * @param feature - The feature index
+   * @returns true if the feature is in use, otherwise false.
    */ featureUsed(feature) {
         return this._featureStates[feature];
     }
-    /**
-   * Use or unuse a feature of the material, this will cause the shader to be rebuild.
-   *
-   * @param feature - Which feature will be used or unused
-   * @param use - true if use the feature, otherwise false
+    /**
+   * Use or unuse a feature of the material, this will cause the shader to be rebuild.
+   *
+   * @param feature - Which feature will be used or unused
+   * @param use - true if use the feature, otherwise false
    */ useFeature(feature, use) {
         if (this._featureStates[feature] !== use) {
             this._featureStates[feature] = use;
             this.optionChanged(true);
         }
     }
-    /**
-   * {@inheritDoc Material._createHash}
-   * @override
-   *
-   * @internal
+    /**
+   * {@inheritDoc Material._createHash}
+   * @override
+   *
+   * @internal
    */ _createHash(renderPassType) {
         return this._featureStates.map((val)=>val === undefined ? '' : val).join('|');
     }
-    /**
-   * {@inheritDoc Material._applyUniforms}
-   * @override
-   *
-   * @internal
+    /**
+   * {@inheritDoc Material._applyUniforms}
+   * @override
+   *
+   * @internal
    */ _applyUniforms(bindGroup, ctx, pass) {
         this.applyUniformValues(bindGroup, ctx, pass);
     }
-    /**
-   * Check if the color should be computed in fragment shader, this is required for forward render pass or alpha test is in use or alpha to coverage is in use.
-   *
-   * @returns - true if the color should be computed in fragment shader, otherwise false.
+    /**
+   * Check if the color should be computed in fragment shader, this is required for forward render pass or alpha test is in use or alpha to coverage is in use.
+   *
+   * @returns - true if the color should be computed in fragment shader, otherwise false.
    */ needFragmentColor(ctx) {
         return (ctx ?? this.drawContext).renderPass.type === RENDER_PASS_TYPE_LIGHT || this._alphaCutoff > 0 || this.alphaToCoverage;
     }
-    /**
-   * Vertex shader implementation of this material
-   * @param scope - Shader scope
+    /**
+   * Vertex shader implementation of this material
+   * @param scope - Shader scope
    */ vertexShader(scope) {
         const pb = scope.$builder;
         ShaderHelper.prepareVertexShader(pb, this.drawContext);
@@ -237,10 +369,13 @@ let FEATURE_ALPHATOCOVERAGE = 0;
             scope.$inputs.zBlendIndices = pb.vec4().attrib('blendIndices');
             scope.$inputs.zBlendWeights = pb.vec4().attrib('blendWeights');
         }
+        if (this.drawContext.instanceData) {
+            scope.$outputs.zInstanceID = scope.$builtins.instanceIndex;
+        }
     }
-    /**
-   * Fragment shader implementation of this material
-   * @param scope - Shader scope
+    /**
+   * Fragment shader implementation of this material
+   * @param scope - Shader scope
    */ fragmentShader(scope) {
         const pb = scope.$builder;
         ShaderHelper.prepareFragmentShader(pb, this.drawContext);
@@ -253,11 +388,11 @@ let FEATURE_ALPHATOCOVERAGE = 0;
             }
         }
     }
-    /**
-   * {@inheritDoc Material._createProgram}
-   * @override
-   *
-   * @internal
+    /**
+   * {@inheritDoc Material._createProgram}
+   * @override
+   *
+   * @internal
    */ _createProgram(pb, ctx, pass) {
         const that = this;
         this._ctx = ctx;
@@ -275,20 +410,20 @@ let FEATURE_ALPHATOCOVERAGE = 0;
                 });
             }
         });
-        /*
-    if (program) {
-      console.log(program.getShaderSource('vertex'));
-      console.log(program.getShaderSource('fragment'));
-    }
+        /*
+    if (program) {
+      console.log(program.getShaderSource('vertex'));
+      console.log(program.getShaderSource('fragment'));
+    }
     */ return program;
     }
-    /**
-   * Calculate final fragment color for output.
-   *
-   * @param scope - Shader scope
-   * @param color - Lit fragment color
-   *
-   * @returns The final fragment color
+    /**
+   * Calculate final fragment color for output.
+   *
+   * @param scope - Shader scope
+   * @param color - Lit fragment color
+   *
+   * @returns The final fragment color
    */ outputFragmentColor(scope, worldPos, color) {
         const pb = scope.$builder;
         const that = this;

package/dist/material/meshmaterial.js.map

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