@zephyr3d/scene 0.1.1 → 0.2.0

package/dist/material/lambert.js

@@ -1,49 +1,75 @@
-import { LitMaterial } from './lit.js';
-import { mixinAlbedoColor } from './mixins/albedocolor.js';
+import { mixinLight } from './mixins/lit.js';
 import { mixinVertexColor } from './mixins/vertexcolor.js';
-import { applyMaterialMixins } from './meshmaterial.js';
+import { applyMaterialMixins, MeshMaterial } from './meshmaterial.js';
+import { ShaderHelper } from './shader/helper.js';
 
 /**
  * Lambert material
  * @public
- */ class LambertMaterial extends applyMaterialMixins(LitMaterial, mixinVertexColor, mixinAlbedoColor) {
+ */ class LambertMaterial extends applyMaterialMixins(MeshMaterial, mixinLight, mixinVertexColor) {
+    static FEATURE_VERTEX_NORMAL = this.defineFeature();
+    static FEATURE_VERTEX_TANGENT = this.defineFeature();
     constructor(){
         super();
+        this.useFeature(LambertMaterial.FEATURE_VERTEX_NORMAL, true);
     }
-    vertexShader(scope, ctx) {
-        super.vertexShader(scope, ctx);
-        scope.$inputs.zPos = scope.$builder.vec3().attrib('position');
-        this.transformVertexAndNormal(scope);
+    /** true if vertex normal attribute presents */ get vertexNormal() {
+        return this.featureUsed(LambertMaterial.FEATURE_VERTEX_NORMAL);
     }
-    fragmentShader(scope, ctx) {
-        super.fragmentShader(scope, ctx);
+    set vertexNormal(val) {
+        this.useFeature(LambertMaterial.FEATURE_VERTEX_NORMAL, !!val);
+    }
+    /** true if vertex normal attribute presents */ get vertexTangent() {
+        return this.featureUsed(LambertMaterial.FEATURE_VERTEX_TANGENT);
+    }
+    set vertexTangent(val) {
+        this.useFeature(LambertMaterial.FEATURE_VERTEX_TANGENT, !!val);
+    }
+    vertexShader(scope) {
+        super.vertexShader(scope);
+        const pb = scope.$builder;
+        scope.$l.oPos = ShaderHelper.resolveVertexPosition(scope);
+        scope.$outputs.worldPos = pb.mul(ShaderHelper.getWorldMatrix(scope), pb.vec4(scope.oPos, 1)).xyz;
+        ShaderHelper.setClipSpacePosition(scope, pb.mul(ShaderHelper.getViewProjectionMatrix(scope), pb.vec4(scope.$outputs.worldPos, 1)));
+        if (this.vertexNormal) {
+            scope.$l.oNorm = ShaderHelper.resolveVertexNormal(scope);
+            scope.$outputs.wNorm = pb.mul(ShaderHelper.getNormalMatrix(scope), pb.vec4(scope.oNorm, 0)).xyz;
+            if (this.vertexTangent) {
+                scope.$l.oTangent = ShaderHelper.resolveVertexTangent(scope);
+                scope.$outputs.wTangent = pb.mul(ShaderHelper.getNormalMatrix(scope), pb.vec4(scope.oTangent.xyz, 0)).xyz;
+                scope.$outputs.wBinormal = pb.mul(pb.cross(scope.$outputs.wNorm, scope.$outputs.wTangent), scope.oTangent.w);
+            }
+        }
+    }
+    fragmentShader(scope) {
+        super.fragmentShader(scope);
         const pb = scope.$builder;
         const that = this;
-        if (this.needFragmentColor(ctx)) {
-            scope.$l.albedo = this.calculateAlbedoColor(scope, ctx);
+        if (this.needFragmentColor()) {
+            scope.$l.albedo = this.calculateAlbedoColor(scope);
             if (this.vertexColor) {
-                scope.albedo = pb.mul(scope.albedo, this.getVertexColor(scope, ctx));
+                scope.albedo = pb.mul(scope.albedo, this.getVertexColor(scope));
             }
             scope.$l.color = pb.vec3(0);
-            scope.$l.normal = this.calculateNormal(scope, ctx);
-            if (this.needCalculateEnvLight(ctx)) {
-                scope.color = pb.add(scope.color, this.getEnvLightIrradiance(scope, scope.normal, ctx));
+            scope.$l.normal = this.calculateNormal(scope, scope.$inputs.worldPos, scope.$inputs.wNorm, scope.$inputs.wTangent, scope.$inputs.wBinormal);
+            if (this.needCalculateEnvLight()) {
+                scope.color = pb.add(scope.color, this.getEnvLightIrradiance(scope, scope.normal));
             }
-            this.forEachLight(scope, ctx, function(type, posRange, dirCutoff, colorIntensity, shadow) {
-                this.$l.lightAtten = that.calculateLightAttenuation(this, type, posRange, dirCutoff);
-                this.$l.lightDir = that.calculateLightDirection(this, type, posRange, dirCutoff);
+            this.forEachLight(scope, function(type, posRange, dirCutoff, colorIntensity, shadow) {
+                this.$l.lightAtten = that.calculateLightAttenuation(this, type, scope.$inputs.worldPos, posRange, dirCutoff);
+                this.$l.lightDir = that.calculateLightDirection(this, type, scope.$inputs.worldPos, posRange, dirCutoff);
                 this.$l.NoL = pb.clamp(pb.dot(this.normal, this.lightDir), 0, 1);
                 this.$l.lightContrib = pb.mul(colorIntensity.rgb, colorIntensity.a, this.NoL, this.lightAtten);
                 if (shadow) {
-                    this.$l.shadow = pb.vec3(that.calculateShadow(this, this.NoL, ctx));
+                    this.$l.shadow = pb.vec3(that.calculateShadow(this, scope.$inputs.worldPos, this.NoL));
                     this.lightContrib = pb.mul(this.lightContrib, this.shadow);
                 }
                 this.color = pb.add(this.color, this.lightContrib);
             });
             scope.$l.litColor = pb.mul(scope.albedo, pb.vec4(scope.color, 1));
-            this.outputFragmentColor(scope, scope.litColor, ctx);
+            this.outputFragmentColor(scope, scope.$inputs.worldPos, scope.litColor);
         } else {
-            this.outputFragmentColor(scope, null, ctx);
+            this.outputFragmentColor(scope, scope.$inputs.worldPos, null);
         }
     }
 }

package/dist/material/lambert.js.map

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

package/dist/material/lightmodel.js

@@ -906,10 +906,10 @@ const TEX_NAME_CLEARCOAT_NORMAL = 'clearcoatNormal';
                     ], function() {
                         this.$l.n = this.bits;
                         this.n = pb.compOr(pb.sal(this.n, 16), pb.sar(this.n, 16));
-                        this.n = pb.compOr(pb.sal(pb.compAnd(this.n, 0x55555555), 1), pb.sar(pb.compAnd(this.n, 0xAAAAAAAA), 1));
-                        this.n = pb.compOr(pb.sal(pb.compAnd(this.n, 0x33333333), 2), pb.sar(pb.compAnd(this.n, 0xCCCCCCCC), 2));
-                        this.n = pb.compOr(pb.sal(pb.compAnd(this.n, 0x0F0F0F0F), 4), pb.sar(pb.compAnd(this.n, 0xF0F0F0F0), 4));
-                        this.n = pb.compOr(pb.sal(pb.compAnd(this.n, 0x00FF00FF), 8), pb.sar(pb.compAnd(this.n, 0xFF00FF00), 8));
+                        this.n = pb.compOr(pb.sal(pb.compAnd(this.n, 0x55555555), 1), pb.sar(pb.compAnd(this.n, 0xaaaaaaaa), 1));
+                        this.n = pb.compOr(pb.sal(pb.compAnd(this.n, 0x33333333), 2), pb.sar(pb.compAnd(this.n, 0xcccccccc), 2));
+                        this.n = pb.compOr(pb.sal(pb.compAnd(this.n, 0x0f0f0f0f), 4), pb.sar(pb.compAnd(this.n, 0xf0f0f0f0), 4));
+                        this.n = pb.compOr(pb.sal(pb.compAnd(this.n, 0x00ff00ff), 8), pb.sar(pb.compAnd(this.n, 0xff00ff00), 8));
                         this.$return(pb.mul(pb.float(this.n), 2.3283064365386963e-10));
                     });
                     pb.func('hammersley2d', [

package/dist/material/material.js

@@ -1,7 +1,8 @@
 import { List } from '@zephyr3d/base';
 import { ProgramBuilder } from '@zephyr3d/device';
 import { Application } from '../app.js';
-import { RENDER_PASS_TYPE_FORWARD, RENDER_PASS_TYPE_SHADOWMAP, RENDER_PASS_TYPE_DEPTH_ONLY } from '../values.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;
@@ -38,7 +39,7 @@ class InstanceBindGroupPool {
         const bindGroup = this._bindGroups[bindGroupIndex];
         const offset = (maxSize - bindGroup.freeSize) / 64;
         for (const matrix of worldMatrices){
-            bindGroup.bindGroup.setRawData('worldMatrix', maxSize - bindGroup.freeSize, matrix);
+            bindGroup.bindGroup.setRawData(ShaderHelper.getWorldMatricesUniformName(), maxSize - bindGroup.freeSize, matrix);
             bindGroup.freeSize -= 64;
         }
         device.setBindGroup(3, bindGroup.bindGroup);
@@ -47,9 +48,9 @@ class InstanceBindGroupPool {
 }
 /**
  * Base class for any kind of materials
+ *
  * @public
  */ class Material {
-    /** @internal */ static _debugChannel = '';
     /** @internal */ static _nextId = 0;
     /** @internal */ static _programMap = {};
     /** @internal */ static _drawableTimestamps = new WeakMap();
@@ -59,7 +60,7 @@ class InstanceBindGroupPool {
     /** @internal */ static _materialIterators = new WeakMap();
     /** @internal */ static _materialLRU = new List();
     /** @internal */ static _gcOptions = {
-        disabled: false,
+        disabled: true,
         drawableCountThreshold: 500,
         materialCountThreshold: 200,
         inactiveTimeDuration: 30000
@@ -67,6 +68,7 @@ class InstanceBindGroupPool {
     /** @internal */ static _boneMatrixTextureSampler = null;
     /** @internal */ static _instanceBindGroupPool = new InstanceBindGroupPool();
     /** @internal */ static _drawableBindGroupMap = new WeakMap();
+    /** @internal */ _numPasses;
     /** @internal */ _hash;
     /** @internal */ _renderStateSet;
     /** @internal */ _bindGroupMap;
@@ -77,26 +79,32 @@ class InstanceBindGroupPool {
    * Creates an instance of material
    */ constructor(){
         this._id = ++Material._nextId;
-        this._hash = [];
+        this._numPasses = 1;
+        this._hash = [
+            []
+        ];
         this._renderStateSet = null;
         this._bindGroupMap = {};
         this._optionTag = 0;
         this._materialBindGroup = null;
     }
-    /** Debug channel */ static get debugChannel() {
-        return this._debugChannel;
-    }
-    static set debugChannel(val) {
-        this._debugChannel = val;
-    }
     /** Unique identifier of the material */ get id() {
         return this._id;
     }
-    /** @internal */ getHash(renderPassType) {
-        if (this._hash[renderPassType] === void 0) {
-            this._hash[renderPassType] = this.createHash(renderPassType);
+    get numPasses() {
+        return this._numPasses;
+    }
+    set numPasses(val) {
+        while(this._hash.length < val){
+            this._hash.push([]);
+        }
+        this._numPasses = val;
+    }
+    /** @internal */ getHash(renderPassType, pass) {
+        if (this._hash[pass][renderPassType] === void 0) {
+            this._hash[pass][renderPassType] = this.createHash(renderPassType, pass);
         }
-        return this._hash[renderPassType];
+        return this._hash[pass][renderPassType];
     }
     /** Render states associated to this material */ get stateSet() {
         if (!this._renderStateSet) {
@@ -107,44 +115,55 @@ class InstanceBindGroupPool {
     set stateSet(stateset) {
         this._renderStateSet = stateset;
     }
-    /** Returns true if this is a transparency material */ isTransparent() {
+    getQueueType() {
+        return QUEUE_OPAQUE;
+    }
+    /** Returns true if this is a transparency material */ isTransparentPass(pass) {
         return false;
     }
     /** Returns true if shading of the material will be affected by lights  */ supportLighting() {
         return true;
     }
+    /** Returns true if this material supports geometry instancing  */ isBatchable() {
+        return true;
+    }
     /**
    * Draws a primitive using this material
+   *
    * @param primitive - The prmitive to be drawn
    * @param ctx - The context of current drawing task
-   */ draw(primitive, ctx) {
-        if (this.beginDraw(ctx)) {
-            if (ctx.instanceData?.worldMatrices.length > 1) {
-                primitive.drawInstanced(ctx.instanceData.worldMatrices.length);
-            } else {
-                primitive.draw();
+   * @param numInstances - How many instances should be drawn. if zero, the instance count will be automatically detected.
+   */ draw(primitive, ctx, numInstances = 0) {
+        for(let i = 0; i < this._numPasses; i++){
+            if (this.beginDraw(i, ctx)) {
+                this.drawPrimitive(i, primitive, ctx, numInstances);
+                this.endDraw(i);
             }
-            this.endDraw();
         }
     }
     /**
    * Prepares for drawing
    * @param ctx - The context of current drawing task
    * @returns true if succeeded, otherwise false
-   */ beginDraw(ctx) {
+   */ beginDraw(pass, ctx) {
         const numInstances = ctx.instanceData?.worldMatrices?.length || 1;
         const device = Application.instance.device;
-        const programInfo = this.getOrCreateProgram(ctx);
+        const programInfo = this.getOrCreateProgram(ctx, pass);
         if (programInfo) {
             const hash = programInfo.hash;
             if (!programInfo.programs[ctx.renderPass.type]) {
-                return null;
+                return false;
             }
-            this._materialBindGroup = this.applyMaterialBindGroups(ctx, hash);
-            if (numInstances > 1) {
-                this.applyInstanceBindGroups(ctx, hash);
-            } else {
-                this.applyDrawableBindGroups(ctx, hash);
+            if (pass > 0) {
+                this.optionChanged(false);
+            }
+            this._materialBindGroup = this.applyMaterialBindGroups(ctx, hash, pass);
+            if (pass === 0) {
+                if (numInstances > 1) {
+                    this.applyInstanceBindGroups(ctx, hash);
+                } else {
+                    this.applyDrawableBindGroups(ctx, hash);
+                }
             }
             ctx.renderPass.applyRenderStates(device, this.stateSet, ctx);
             device.setProgram(programInfo.programs[ctx.renderPass.type]);
@@ -158,7 +177,7 @@ class InstanceBindGroupPool {
     }
     /**
    * Ends drawing a primitive
-   */ endDraw() {
+   */ endDraw(pass) {
         this._materialBindGroup = null;
     }
     /**
@@ -172,24 +191,22 @@ class InstanceBindGroupPool {
    * @param bindGroup - The bind group of the material
    * @param ctx - The context of current drawing task
    * @param needUpdate - true if the uniform values needs to update
-   */ applyUniforms(bindGroup, ctx, needUpdate) {
+   */ applyUniforms(bindGroup, ctx, needUpdate, pass) {
         if (needUpdate) {
-            this._applyUniforms(bindGroup, ctx);
+            this._applyUniforms(bindGroup, ctx, pass);
         }
     }
     /**
    * Fetch the gpu program of the material for drawing
    * @param ctx - The context for current drawing task
    * @returns Information of the gpu program
-   */ getOrCreateProgram(ctx) {
+   */ getOrCreateProgram(ctx, pass) {
         const programMap = Material._programMap;
         const renderPassType = ctx.renderPass.type;
-        const hash = `${Material.debugChannel}:${this.getHash(renderPassType)}:${!!ctx.target.getBoneMatrices()}:${Number(!!(ctx.instanceData?.worldMatrices.length > 1))}:${ctx.renderPassHash}`;
+        const hash = `${this.getHash(renderPassType, pass)}:${!!ctx.target.getBoneMatrices()}:${Number(!!(ctx.instanceData?.worldMatrices.length > 1))}:${ctx.renderPassHash}`;
         let programInfo = programMap[hash];
-        if (!programInfo || !programInfo.programs[renderPassType] || programInfo.programs[renderPassType].disposed) {
-            console.time(hash);
-            const program = this.createProgram(ctx);
-            console.timeEnd(hash);
+        if (!programInfo || programInfo.programs[renderPassType] === undefined) {
+            const program = this.createProgram(ctx, pass) ?? null;
             if (!programInfo) {
                 programInfo = {
                     programs: [
@@ -203,7 +220,7 @@ class InstanceBindGroupPool {
             }
             programInfo.programs[renderPassType] = program;
         }
-        return programInfo || null;
+        return programInfo;
     }
     dispose() {
         this.clearBindGroupCache();
@@ -267,21 +284,23 @@ class InstanceBindGroupPool {
     /** @internal */ optionChanged(changeHash) {
         this._optionTag++;
         if (changeHash) {
-            this._hash = [];
+            for(let i = 0; i < this._numPasses; i++){
+                this._hash[i] = [];
+            }
         }
     }
     /** @internal */ static getProgramByHashIndex(hash, index) {
         return this._programMap[hash].programs[index];
     }
-    /** @internal */ applyMaterialBindGroups(ctx, hash) {
+    /** @internal */ applyMaterialBindGroups(ctx, hash, pass) {
         const index = ctx.renderPass.type;
         let bindGroupInfo = this._bindGroupMap[hash];
         if (!bindGroupInfo) {
             // bindGroups not created or have been garbage collected
             const materialBindGroup = [
-                RENDER_PASS_TYPE_FORWARD,
+                RENDER_PASS_TYPE_LIGHT,
                 RENDER_PASS_TYPE_SHADOWMAP,
-                RENDER_PASS_TYPE_DEPTH_ONLY
+                RENDER_PASS_TYPE_DEPTH
             ].map((k)=>{
                 const program = Material._programMap[hash].programs[k];
                 return program?.bindGroupLayouts[2] ? Application.instance.device.createBindGroup(program.bindGroupLayouts[2]) : null;
@@ -302,7 +321,7 @@ class InstanceBindGroupPool {
         }
         const bindGroup = bindGroupInfo.materialBindGroup[index];
         if (bindGroup) {
-            this.applyUniforms(bindGroup, ctx, bindGroupInfo.materialTag[index] < this._optionTag || bindGroupInfo.bindGroupTag[index] !== bindGroup.cid);
+            this.applyUniforms(bindGroup, ctx, bindGroupInfo.materialTag[index] < this._optionTag || bindGroupInfo.bindGroupTag[index] !== bindGroup.cid, pass);
             bindGroupInfo.materialTag[index] = this._optionTag;
             bindGroupInfo.bindGroupTag[index] = bindGroup.cid;
             Application.instance.device.setBindGroup(2, bindGroup);
@@ -320,9 +339,9 @@ class InstanceBindGroupPool {
         let drawableBindGroup = drawableBindGroups[hash];
         if (!drawableBindGroup) {
             const bindGroup = [
-                RENDER_PASS_TYPE_FORWARD,
+                RENDER_PASS_TYPE_LIGHT,
                 RENDER_PASS_TYPE_SHADOWMAP,
-                RENDER_PASS_TYPE_DEPTH_ONLY
+                RENDER_PASS_TYPE_DEPTH
             ].map((k)=>{
                 const program = Material._programMap[hash].programs[k];
                 return program?.bindGroupLayouts[1] ? Application.instance.device.createBindGroup(program.bindGroupLayouts[1]) : null;
@@ -348,7 +367,7 @@ class InstanceBindGroupPool {
         const offset = Material._instanceBindGroupPool.apply(hash, index, ctx.instanceData.worldMatrices);
         const bindGroup = this.getDrawableBindGroup(ctx, hash).bindGroup?.[index];
         if (bindGroup) {
-            bindGroup.setValue('instanceBufferOffset', offset);
+            bindGroup.setValue(ShaderHelper.getInstanceBufferOffsetUniformName(), offset);
             Application.instance.device.setBindGroup(1, bindGroup);
         } else {
             Application.instance.device.setBindGroup(1, null);
@@ -361,7 +380,7 @@ class InstanceBindGroupPool {
         if (drawableBindGroup.bindGroup) {
             const bindGroup = drawableBindGroup.bindGroup[index];
             if (drawableBindGroup.xformTag[index] < ctx.target.getXForm().getTag() || drawableBindGroup.bindGroupTag[index] !== bindGroup.cid) {
-                bindGroup.setValue('worldMatrix', ctx.target.getXForm().worldMatrix);
+                bindGroup.setValue(ShaderHelper.getWorldMatrixUniformName(), ctx.target.getXForm().worldMatrix);
                 drawableBindGroup.xformTag[index] = ctx.target.getXForm().getTag();
                 drawableBindGroup.bindGroupTag[index] = bindGroup.cid;
             }
@@ -374,17 +393,25 @@ class InstanceBindGroupPool {
                         mipFilter: 'none'
                     });
                 }
-                bindGroup.setTexture('boneMatrices', boneMatrices);
-                bindGroup.setValue('boneTextureSize', boneMatrices.width);
-                bindGroup.setValue('invBindMatrix', ctx.target.getInvBindMatrix());
+                bindGroup.setTexture(ShaderHelper.getBoneMatricesUniformName(), boneMatrices);
+                bindGroup.setValue(ShaderHelper.getBoneTextureSizeUniformName(), boneMatrices.width);
+                bindGroup.setValue(ShaderHelper.getBoneInvBindMatrixUniformName(), ctx.target.getInvBindMatrix());
             }
             device.setBindGroup(1, bindGroup);
         } else {
             device.setBindGroup(1, null);
         }
+        device.setBindGroup(3, null);
+    }
+    /**
+   * Convert pass to hash
+   * @param pass - pass number
+   * @returns String hash
+   */ passToHash(pass) {
+        return String(pass);
     }
-    /** @internal */ createHash(renderPassType) {
-        return `${this.constructor.name}|${this._createHash(renderPassType)}`;
+    /** @internal */ createHash(renderPassType, pass) {
+        return `${this.constructor.name}|${this.passToHash(pass)}|${this._createHash(renderPassType)}`;
     }
     /** @internal */ clearBindGroupCache() {
         let n = 0;
@@ -425,9 +452,23 @@ class InstanceBindGroupPool {
         }
         this._materialIterators.set(material, this._materialLRU.append(material));
     }
-    /** @internal */ createProgram(ctx) {
+    /**
+   * Draw primitve
+   *
+   * @param primitive - Primitive to be drawn
+   * @param ctx - Draw context
+   */ 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 {
+            primitive.draw();
+        }
+    }
+    /** @internal */ createProgram(ctx, pass) {
         const pb = new ProgramBuilder(Application.instance.device);
-        return this._createProgram(pb, ctx);
+        return this._createProgram(pb, ctx, pass);
     }
     /** @internal */ createRenderStateSet() {
         return Application.instance.device.createRenderStateSet();
@@ -438,14 +479,14 @@ class InstanceBindGroupPool {
    * @param ctx - The drawing context
    * @param func - The material func
    * @returns The created shader program
-   */ _createProgram(pb, ctx) {
+   */ _createProgram(pb, ctx, pass) {
         return null;
     }
     /**
    * Applies uniform values
    * @param bindGroup - The bind group
    * @param ctx - The drawing context
-   */ _applyUniforms(bindGroup, ctx) {}
+   */ _applyUniforms(bindGroup, ctx, pass) {}
     /**
    * Calculates the hash code of the shader program
    * @returns The hash code

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":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}