@galacean/effects-plugin-model 2.0.0-alpha.2 → 2.0.0-alpha.4

package/dist/index.mjs

@@ -3,10 +3,10 @@
  * Description: Galacean Effects player model plugin
  * Author: Ant Group CO., Ltd.
  * Contributors: 飂兮
- * Version: v2.0.0-alpha.2
+ * Version: v2.0.0-alpha.4
  */
 
-import { math, Transform, PLAYER_OPTIONS_ENV_EDITOR, spec, glContext, Texture, TextureSourceType, RenderPassAttachmentStorageType, Material, Mesh, Geometry, DestroyOptions, addItem, removeItem, effectsClass, RendererComponent, ItemBehaviour, TimelineComponent, HitTestType, Renderer, RenderPass, TextureLoadAction, RenderPassDestroyAttachmentType, Player, getDefaultTextureFactory, loadImage, VFXItem, AbstractPlugin, registerPlugin, logger } from '@galacean/effects';
+import { math, Transform, PLAYER_OPTIONS_ENV_EDITOR, spec, glContext, Texture, TextureSourceType, RenderPassAttachmentStorageType, Material, Mesh, Geometry, Shader, GLSLVersion, DestroyOptions, addItem, removeItem, effectsClass, DataType, RendererComponent, ItemBehaviour, TimelineComponent, HitTestType, RenderPass, TextureLoadAction, RenderPassDestroyAttachmentType, Player, Renderer, getDefaultTextureFactory, loadImage, VFXItem, AbstractPlugin, registerPlugin, logger } from '@galacean/effects';
 
 /**
  * Model 插件元素类型
@@ -1894,8 +1894,8 @@ var PCamera = /** @class */ (function (_super) {
      * @param height - 画布高度
      * @param owner - 所属的相机组件
      */
-    function PCamera(name, width, height, options, owner) {
-        var _a;
+    function PCamera(name, width, height, data, owner) {
+        var _a, _b, _c, _d, _e;
         var _this = _super.call(this) || this;
         /**
          * 画布宽度
@@ -1916,7 +1916,7 @@ var PCamera = /** @class */ (function (_super) {
         /**
          * Y 轴上视角
          */
-        _this.fovy = 45;
+        _this.fov = 45;
         /**
          * 纵横比
          */
@@ -1940,11 +1940,11 @@ var PCamera = /** @class */ (function (_super) {
         _this.name = name;
         _this.width = width;
         _this.height = height;
-        _this.nearPlane = options.near;
-        _this.farPlane = options.far;
-        _this.fovy = options.fov;
-        _this.aspect = (_a = options.aspect) !== null && _a !== void 0 ? _a : (_this.width / _this.height);
-        _this.clipMode = options.clipMode;
+        _this.nearPlane = (_a = data.near) !== null && _a !== void 0 ? _a : 0.001;
+        _this.farPlane = (_b = data.far) !== null && _b !== void 0 ? _b : 1000;
+        _this.fov = (_c = data.fov) !== null && _c !== void 0 ? _c : 45;
+        _this.aspect = (_d = data.aspect) !== null && _d !== void 0 ? _d : (_this.width / _this.height);
+        _this.clipMode = (_e = data.clipMode) !== null && _e !== void 0 ? _e : spec.CameraClipMode.landscape;
         _this.update();
         return _this;
     }
@@ -1956,7 +1956,7 @@ var PCamera = /** @class */ (function (_super) {
             this.transform.fromEffectsTransform(this.owner.transform);
         }
         var reverse = this.clipMode === spec.CameraClipMode.portrait;
-        this.projectionMatrix.perspective(this.fovy * deg2rad, this.aspect, this.nearPlane, this.farPlane, reverse);
+        this.projectionMatrix.perspective(this.fov * deg2rad, this.aspect, this.nearPlane, this.farPlane, reverse);
         this.viewMatrix = this.matrix.invert();
     };
     /**
@@ -1974,7 +1974,7 @@ var PCamera = /** @class */ (function (_super) {
      * @returns 视角中的包围盒
      */
     PCamera.prototype.computeViewAABB = function (box) {
-        var tanTheta = Math.tan(this.fovy * deg2rad * 0.5);
+        var tanTheta = Math.tan(this.fov * deg2rad * 0.5);
         var aspect = this.aspect;
         var yFarCoord = 0;
         var yNearCoord = 0;
@@ -2044,11 +2044,13 @@ var PCameraManager = /** @class */ (function () {
         this.winHeight = 512;
         this.cameraList = [];
         this.defaultCamera = new PCamera('camera', 512, 512, {
+            id: '0',
+            dataType: 'camera',
             fov: 60,
             far: 1000,
             near: 0.001,
-            position: [0, 0, -1.5],
             clipMode: spec.CameraClipMode.portrait,
+            item: { id: '0' },
         });
     }
     /**
@@ -2067,12 +2069,13 @@ var PCameraManager = /** @class */ (function () {
     };
     /**
      * 插入相机数据，创建新的相机对象
-     * @param inCamera - 相机数据
-     * @param owner - 所属的相机组件
+     * @param name - 相机名称
+     * @param data - 相机相关数据
+     * @param owner - 相机所属组件
      * @returns 新的相机对象
      */
-    PCameraManager.prototype.insert = function (name, options, owner) {
-        var camera = new PCamera(name, this.winWidth, this.winHeight, options, owner);
+    PCameraManager.prototype.insert = function (name, data, owner) {
+        var camera = new PCamera(name, this.winWidth, this.winHeight, data, owner);
         this.cameraList.push(camera);
         return camera;
     };
@@ -2119,7 +2122,7 @@ var PCameraManager = /** @class */ (function () {
      * @param clipMode - 剪裁模式
      */
     PCameraManager.prototype.updateDefaultCamera = function (fovy, aspect, nearPlane, farPlane, position, rotation, clipMode) {
-        this.defaultCamera.fovy = fovy;
+        this.defaultCamera.fov = fovy;
         this.defaultCamera.aspect = aspect;
         this.defaultCamera.nearPlane = nearPlane;
         this.defaultCamera.farPlane = farPlane;
@@ -2174,10 +2177,12 @@ var PLight = /** @class */ (function (_super) {
     __extends(PLight, _super);
     /**
      * 创建灯光对象
-     * @param light - 灯光参数
-     * @param ownerI - 所属灯光组件
+     * @param name - 灯光名称
+     * @param data - 灯光相关数据
+     * @param owner - 所属灯光组件
      */
-    function PLight(name, options, owner) {
+    function PLight(name, data, owner) {
+        var _a, _b, _c, _d;
         var _this = _super.call(this) || this;
         /**
          * 方向，仅用于方向光和聚光灯
@@ -2217,20 +2222,20 @@ var PLight = /** @class */ (function (_super) {
         _this.outerConeAngle = 0;
         _this.innerConeAngle = 0;
         //
-        var pluginColor = PluginHelper.toPluginColor4(options.color);
-        _this.color = new Vector3(pluginColor[0], pluginColor[1], pluginColor[2]);
-        _this.intensity = options.intensity;
-        if (options.lightType === 'point') {
+        var color = data.color;
+        _this.color = new Vector3(color.r, color.g, color.b);
+        _this.intensity = data.intensity;
+        if (data.lightType === 'point') {
             _this.lightType = PLightType.point;
-            _this.range = options.range;
+            _this.range = (_a = data.range) !== null && _a !== void 0 ? _a : -1;
         }
-        else if (options.lightType === 'spot') {
+        else if (data.lightType === 'spot') {
             _this.lightType = PLightType.spot;
-            _this.range = options.range;
-            _this.outerConeAngle = options.outerConeAngle;
-            _this.innerConeAngle = options.innerConeAngle;
+            _this.range = (_b = data.range) !== null && _b !== void 0 ? _b : -1;
+            _this.outerConeAngle = (_c = data.outerConeAngle) !== null && _c !== void 0 ? _c : Math.PI;
+            _this.innerConeAngle = (_d = data.innerConeAngle) !== null && _d !== void 0 ? _d : 0;
         }
-        else if (options.lightType === 'directional') {
+        else if (data.lightType === 'directional') {
             _this.lightType = PLightType.directional;
         }
         else {
@@ -2546,12 +2551,12 @@ var PMesh = /** @class */ (function (_super) {
      * 构造函数，创建 Mesh 对象，并与所属组件和父元素相关联
      * @param engine - 引擎
      * @param name - 名称
-     * @param meshContent - Mesh 参数
+     * @param meshData - Mesh 参数
      * @param owner - 所属的 Mesh 组件
      * @param parentId - 父元素索引
      * @param parent - 父元素
      */
-    function PMesh(engine, name, meshContent, owner, parentId, parent) {
+    function PMesh(engine, name, meshData, owner, parentId, parent) {
         var _a;
         var _this = _super.call(this) || this;
         _this.engine = engine;
@@ -2587,7 +2592,7 @@ var PMesh = /** @class */ (function (_super) {
          * 是否销毁
          */
         _this.isDisposed = false;
-        var proxy = new EffectsMeshProxy(meshContent, parent);
+        var proxy = new EffectsMeshProxy(meshData, parent);
         _this.name = name;
         _this.type = PObjectType.mesh;
         _this.visible = false;
@@ -2610,7 +2615,7 @@ var PMesh = /** @class */ (function (_super) {
         if (_this.primitives.length <= 0) {
             console.warn("No primitive inside mesh item ".concat(name));
         }
-        _this.boundingBox = _this.getItemBoundingBox(meshContent.interaction);
+        _this.boundingBox = _this.getItemBoundingBox(meshData.interaction);
         return _this;
     }
     /**
@@ -2880,15 +2885,15 @@ var PPrimitive = /** @class */ (function () {
     }
     /**
      * 创建 Primitive 对象
-     * @param options - Primitive 参数
+     * @param data - Primitive 参数
      * @param parent - 所属 Mesh 对象
      */
-    PPrimitive.prototype.create = function (options, parent) {
+    PPrimitive.prototype.create = function (data, parent) {
         this.parent = parent;
         this.skin = parent.skin;
         this.morph = parent.morph;
-        this.setGeometry(options.geometry);
-        this.setMaterial(options.material);
+        this.setGeometry(data.geometry);
+        this.setMaterial(data.material);
         this.name = parent.name;
         this.effectsPriority = parent.priority;
         this.geometry.setHide(parent.hide);
@@ -2932,15 +2937,36 @@ var PPrimitive = /** @class */ (function () {
         //newSemantics["uView"] = 'VIEWINVERSE';
         newSemantics['u_ModelMatrix'] = 'MODEL';
         newSemantics['uEditorTransform'] = 'EDITOR_TRANSFORM';
-        var material = Material.create(this.engine, {
-            shader: {
+        var material;
+        var isWebGL2 = PGlobalState.getInstance().isWebGL2;
+        if (this.material.material) {
+            material = this.material.material;
+            // @ts-expect-error
+            material.uniformSemantics = newSemantics;
+            var shader = new Shader(this.engine);
+            shader.fromData({
+                id: '10000000000000000000000000000000',
+                dataType: 'Shader',
                 vertex: this.material.vertexShaderCode,
                 fragment: this.material.fragmentShaderCode,
-                shared: globalState.shaderShared,
-            },
-            uniformSemantics: newSemantics,
-        });
-        this.material.setMaterialStates(material);
+                // @ts-expect-error
+                glslVersion: isWebGL2 ? GLSLVersion.GLSL3 : GLSLVersion.GLSL1,
+            });
+            // @ts-expect-error
+            material.shader = shader;
+            this.material.setMaterialStates(material);
+        }
+        else {
+            material = Material.create(this.engine, {
+                shader: {
+                    vertex: this.material.vertexShaderCode,
+                    fragment: this.material.fragmentShaderCode,
+                    shared: globalState.shaderShared,
+                    glslVersion: isWebGL2 ? GLSLVersion.GLSL3 : GLSLVersion.GLSL1,
+                },
+                uniformSemantics: newSemantics,
+            });
+        }
         var mesh = Mesh.create(this.engine, {
             name: this.name,
             material: material,
@@ -2951,6 +2977,7 @@ var PPrimitive = /** @class */ (function () {
             this.effectsMesh.dispose();
         }
         this.effectsMesh = mesh;
+        this.material.setMaterialStates(material);
     };
     PPrimitive.prototype.getFeatureList = function (lightCount, pbrPass, skybox) {
         var featureList = [];
@@ -3240,7 +3267,35 @@ var PPrimitive = /** @class */ (function () {
             this.geometry = val;
         }
         else {
-            this.geometry = new PGeometry(val);
+            // FIXME: 临时兼容代码，后续要解决掉
+            // @ts-expect-error
+            var aNormal = val.attributes['aNormal'];
+            // @ts-expect-error
+            var aPos = val.attributes['aPos'];
+            // @ts-expect-error
+            var aUV = val.attributes['aUV'];
+            if (aNormal && aPos && aUV) {
+                var aNormalData = val.getAttributeData('aNormal');
+                var aPosData = val.getAttributeData('aPos');
+                var aUVData = val.getAttributeData('aUV');
+                var newGeom = Geometry.create(val.engine, {
+                    attributes: {
+                        a_Position: __assign(__assign({}, aPos), { data: aPosData }),
+                        a_UV1: __assign(__assign({}, aUV), { data: aUVData }),
+                        a_Normal: __assign(__assign({}, aNormal), { data: aNormalData }),
+                    },
+                    // @ts-expect-error
+                    indices: { data: val.getIndexData() },
+                    // @ts-expect-error
+                    mode: val.mode,
+                    drawStart: val.getDrawStart(),
+                    drawCount: val.getDrawCount(),
+                });
+                this.geometry = new PGeometry(newGeom);
+            }
+            else {
+                this.geometry = new PGeometry(val);
+            }
         }
     };
     /**
@@ -3424,16 +3479,15 @@ var PGeometry = /** @class */ (function () {
     return PGeometry;
 }());
 var EffectsMeshProxy = /** @class */ (function () {
-    function EffectsMeshProxy(itemContent, parentItem) {
-        this.itemContent = itemContent;
+    function EffectsMeshProxy(itemData, parentItem) {
+        this.itemData = itemData;
         this.parentItem = parentItem;
-        this.options = itemContent.options;
+        this.data = itemData;
         // Morph 对象创建，需要为每个 Primitive 中 Geometry 对象创建 Morph
         // 并且要求创建的 Morph 对象状态是相同的，否则就报错
         var isSuccess = true;
         var morphObj = new PMorph();
-        var meshOptions = itemContent.options;
-        var primitives = meshOptions.primitives;
+        var _a = this.data, primitives = _a.primitives, morph = _a.morph;
         primitives.forEach(function (prim, idx) {
             if (idx === 0) {
                 morphObj.create(prim.geometry);
@@ -3453,8 +3507,8 @@ var EffectsMeshProxy = /** @class */ (function () {
         });
         if (isSuccess) {
             // 设置初始权重数组
-            if (meshOptions.weights !== undefined) {
-                morphObj.initWeights(meshOptions.weights);
+            if ((morph === null || morph === void 0 ? void 0 : morph.weights) !== undefined) {
+                morphObj.initWeights(morph.weights);
             }
             this.morphObj = morphObj;
         }
@@ -3478,7 +3532,7 @@ var EffectsMeshProxy = /** @class */ (function () {
         return this.morphObj;
     };
     EffectsMeshProxy.prototype.isHide = function () {
-        return this.options.hide === true;
+        return this.data.hide === true;
     };
     EffectsMeshProxy.prototype.getParentNode = function () {
         var _a;
@@ -3490,20 +3544,23 @@ var EffectsMeshProxy = /** @class */ (function () {
         return undefined;
     };
     EffectsMeshProxy.prototype.getParentIndex = function () {
-        var _a;
-        return (_a = this.options.parent) !== null && _a !== void 0 ? _a : -1;
+        return -1;
     };
     EffectsMeshProxy.prototype.getPrimitives = function () {
-        return this.options.primitives;
+        return this.data.primitives;
     };
     EffectsMeshProxy.prototype.getPrimitiveCount = function () {
-        return this.options.primitives.length;
+        return this.data.primitives.length;
     };
     EffectsMeshProxy.prototype.hasSkin = function () {
-        return this.options.skin !== undefined;
+        // FIXME: skin
+        //return this.options.skin !== undefined;
+        return false;
     };
     EffectsMeshProxy.prototype.getSkinOpts = function () {
-        return this.options.skin;
+        // FIXME: skin
+        //return this.options.skin;
+        return;
     };
     EffectsMeshProxy.prototype.getSkinObj = function (engine) {
         var skin = this.getSkinOpts();
@@ -3920,7 +3977,7 @@ var PSceneManager = /** @class */ (function () {
 
 var primitiveVert = "precision highp float;\n#define FEATURES\n#include <webglCompatibility.glsl>\n#include <animation.vert.glsl>\nvsIn vec4 a_Position;vsOut vec3 v_Position;\n#ifdef HAS_NORMALS\nvsIn vec4 a_Normal;\n#endif\n#ifdef HAS_TANGENTS\nvsIn vec4 a_Tangent;\n#endif\n#ifdef HAS_NORMALS\n#ifdef HAS_TANGENTS\nvsOut mat3 v_TBN;\n#else\nvsOut vec3 v_Normal;\n#endif\n#endif\n#ifdef HAS_UV_SET1\nvsIn vec2 a_UV1;\n#endif\n#ifdef HAS_UV_SET2\nvsIn vec2 a_UV2;\n#endif\nvsOut vec2 v_UVCoord1;\n#ifdef HAS_UV_SET2\nvsOut vec2 v_UVCoord2;\n#endif\n#ifdef HAS_VERTEX_COLOR_VEC3\nvsIn vec3 a_Color;vsOut vec3 v_Color;\n#endif\n#ifdef HAS_VERTEX_COLOR_VEC4\nvsIn vec4 a_Color;vsOut vec4 v_Color;\n#endif\nuniform mat4 u_ViewProjectionMatrix;uniform mat4 u_ModelMatrix;uniform mat4 u_NormalMatrix;\n#ifdef EDITOR_TRANSFORM\nuniform vec4 uEditorTransform;\n#endif\n#ifdef USE_SHADOW_MAPPING\nuniform mat4 u_LightViewProjectionMatrix;uniform float u_DeltaSceneSize;vsOut vec4 v_PositionLightSpace;vsOut vec4 v_dPositionLightSpace;\n#endif\nvec4 getPosition(){vec4 pos=vec4(a_Position.xyz,1.0);\n#ifdef USE_MORPHING\npos+=getTargetPosition();\n#endif\n#ifdef USE_SKINNING\npos=getSkinningMatrix()*pos;\n#endif\nreturn pos;}\n#ifdef HAS_NORMALS\nvec4 getNormal(){vec4 normal=a_Normal;\n#ifdef USE_MORPHING\nnormal+=getTargetNormal();\n#endif\n#ifdef USE_SKINNING\nnormal=getSkinningNormalMatrix()*normal;\n#endif\nreturn normalize(normal);}\n#endif\n#ifdef HAS_TANGENTS\nvec4 getTangent(){vec4 tangent=a_Tangent;\n#ifdef USE_MORPHING\ntangent+=getTargetTangent();\n#endif\n#ifdef USE_SKINNING\ntangent=getSkinningMatrix()*tangent;\n#endif\nreturn normalize(tangent);}\n#endif\nvoid main(){vec4 pos=u_ModelMatrix*getPosition();v_Position=vec3(pos.xyz)/pos.w;\n#ifdef HAS_NORMALS\n#ifdef HAS_TANGENTS\nvec4 tangent=getTangent();vec3 normalW=normalize(vec3(u_NormalMatrix*vec4(getNormal().xyz,0.0)));vec3 tangentW=normalize(vec3(u_ModelMatrix*vec4(tangent.xyz,0.0)));vec3 bitangentW=cross(normalW,tangentW)*tangent.w;v_TBN=mat3(tangentW,bitangentW,normalW);\n#else\nv_Normal=normalize(vec3(u_NormalMatrix*vec4(getNormal().xyz,0.0)));\n#endif\n#endif\nv_UVCoord1=vec2(0.0,0.0);\n#ifdef HAS_UV_SET1\nv_UVCoord1=a_UV1;\n#endif\n#ifdef HAS_UV_SET2\nv_UVCoord2=a_UV2;\n#endif\n#if defined(HAS_VERTEX_COLOR_VEC3) || defined(HAS_VERTEX_COLOR_VEC4)\nv_Color=a_Color;\n#endif\n#ifdef USE_SHADOW_MAPPING\nv_PositionLightSpace=u_LightViewProjectionMatrix*pos;vec3 dpos=vec3(u_DeltaSceneSize);v_dPositionLightSpace=u_LightViewProjectionMatrix*(pos+vec4(dpos,0));\n#endif\ngl_Position=u_ViewProjectionMatrix*pos;\n#ifdef EDITOR_TRANSFORM\ngl_Position=vec4(gl_Position.xy*uEditorTransform.xy+uEditorTransform.zw*gl_Position.w,gl_Position.zw);\n#endif\n}";
 
-var metallicRoughnessFrag = "\n#define FEATURES\n#ifndef WEBGL2\n#extension GL_OES_standard_derivatives : enable\n#endif\n#if !defined(WEBGL2) && defined(USE_TEX_LOD)\n#extension GL_EXT_shader_texture_lod : enable\n#endif\n#ifdef USE_HDR\n#extension GL_OES_texture_float : enable\n#extension GL_OES_texture_float_linear : enable\n#endif\n#if !defined(WEBGL2) && defined(USE_WBOIT)\n#extension GL_EXT_draw_buffers: require\n#endif\n#ifdef GL_FRAGMENT_PRECISION_HIGH\nprecision highp float;\n#else\nprecision mediump float;\n#endif\n#ifdef WEBGL2\n#ifdef USE_WBOIT\nlayout(location=0)out vec4 outFragColor0;layout(location=1)out vec4 outFragColor1;\n#else\nout vec4 outFragColor;\n#endif\n#else\n#ifdef USE_WBOIT\n#define outFragColor0 gl_FragData[0]\n#define outFragColor1 gl_FragData[1]\n#else\n#define outFragColor gl_FragColor\n#endif\n#endif\n#include <webglCompatibility.glsl>\n#include <extensions.frag.glsl>\n#include <tonemapping.frag.glsl>\n#include <textures.vert.glsl>\n#include <functions.frag.glsl>\n#include <shadowCommon.vert.glsl>\n#include <shadow.frag.glsl>\nstruct Light{vec3 direction;float range;vec3 color;float intensity;vec3 position;float innerConeCos;float outerConeCos;int type;vec2 padding;};const int LightType_Directional=0;const int LightType_Point=1;const int LightType_Spot=2;const int LightType_Ambient=3;\n#ifdef USE_PUNCTUAL\nuniform Light u_Lights[LIGHT_COUNT];\n#endif\n#if defined(MATERIAL_SPECULARGLOSSINESS) || defined(MATERIAL_METALLICROUGHNESS)\nuniform float u_MetallicFactor;uniform float u_RoughnessFactor;uniform vec4 u_BaseColorFactor;\n#endif\n#ifdef MATERIAL_SPECULARGLOSSINESS\nuniform vec3 u_SpecularFactor;uniform vec4 u_DiffuseFactor;uniform float u_GlossinessFactor;\n#endif\n#ifdef ALPHAMODE_MASK\nuniform float u_AlphaCutoff;\n#endif\n#ifdef ADD_FOG\nuniform vec4 u_FogColor;\n#ifdef LINEAR_FOG\nuniform float u_FogNear;uniform float u_FogFar;\n#endif\n#ifdef EXP_FOG\nuniform float u_FogDensity;\n#endif\n#endif\n#ifdef PREVIEW_BORDER\nuniform vec4 uPreviewColor;\n#endif\nuniform vec3 u_Camera;uniform int u_MipCount;struct MaterialInfo{float perceptualRoughness;vec3 reflectance0;float alphaRoughness;vec3 diffuseColor;vec3 reflectance90;vec3 specularColor;};\n#ifdef ADD_FOG\nvec3 getMixFogColor(vec3 baseColor){vec3 distance=u_Camera-v_Position;float fogAmount=0.0;\n#ifdef LINEAR_FOG\nfogAmount=smoothstep(u_FogNear,u_FogFar,distance[2]);\n#endif\n#ifdef EXP_FOG\n#define LOG2 1.442695\nfogAmount=1.-exp2(-u_FogDensity*u_FogDensity*distance[2]*distance[2]*LOG2);fogAmount=clamp(fogAmount,0.,1.);\n#endif\nvec3 mixColor=baseColor.rgb+(vec3(u_FogColor)-baseColor.rgb)*fogAmount;return mixColor;}\n#endif\n#ifdef IRRADIANCE_COEFFICIENTS\nvec3 getIrradiance(vec3 norm,SHCoefficients c){float x=norm.x;float y=norm.y;float z=norm.z;float c1=0.429043;float c2=0.511664;float c3=0.743125;float c4=0.886227;float c5=0.247708;vec3 irradiance=c1*c.l22*(x*x-y*y)+c3*c.l20*(z*z)+c4*c.l00-c5*c.l20+2.0*c1*(c.l2m2*x*y+c.l21*x*z+c.l2m1*y*z)+2.0*c2*(c.l11*x+c.l1m1*y+c.l10*z);return irradiance;}\n#endif\n#ifdef USE_IBL\nvec3 getIBLContribution(MaterialInfo materialInfo,vec3 n,vec3 v){float NdotV=clamp(dot(n,v),0.0,1.0);float lod=clamp(materialInfo.perceptualRoughness*float(u_MipCount),0.0,float(u_MipCount));vec3 reflection=normalize(reflect(-v,n));vec2 brdfSamplePoint=clamp(vec2(NdotV,materialInfo.perceptualRoughness),vec2(0.0,0.0),vec2(1.0,1.0));vec2 brdf=texture2D(u_brdfLUT,brdfSamplePoint).rg;vec4 diffuseColor=vec4(1.0,0.0,0.0,1.0);\n#ifdef IRRADIANCE_COEFFICIENTS\nvec3 irradiance=getIrradiance(n,u_shCoefficients);diffuseColor=vec4(irradiance,1.0);\n#else\ndiffuseColor=textureCube(u_DiffuseEnvSampler,n);\n#endif\n#ifdef USE_TEX_LOD\nvec4 specularSample=_textureCubeLodEXT(u_SpecularEnvSampler,reflection,lod);\n#else\nvec4 specularSample=textureCube(u_SpecularEnvSampler,reflection,lod);\n#endif\n#ifdef USE_HDR\nvec3 diffuseLight=diffuseColor.rgb;vec3 specularLight=specularSample.rgb;\n#else\nvec3 diffuseLight=SRGBtoLINEAR(diffuseColor).rgb;vec3 specularLight=SRGBtoLINEAR(specularSample).rgb;\n#endif\nvec3 diffuse=diffuseLight*materialInfo.diffuseColor;vec3 specular=specularLight*(materialInfo.specularColor*brdf.x+brdf.y);return diffuse*u_IblIntensity[0]+specular*u_IblIntensity[1];}\n#endif\nvec3 diffuse(MaterialInfo materialInfo){return materialInfo.diffuseColor/M_PI;}vec3 specularReflection(MaterialInfo materialInfo,AngularInfo angularInfo){return materialInfo.reflectance0+(materialInfo.reflectance90-materialInfo.reflectance0)*pow(clamp(1.0-angularInfo.VdotH,0.0,1.0),5.0);}float visibilityOcclusion(MaterialInfo materialInfo,AngularInfo angularInfo){float NdotL=angularInfo.NdotL;float NdotV=angularInfo.NdotV;float alphaRoughnessSq=materialInfo.alphaRoughness*materialInfo.alphaRoughness;float GGXV=NdotL*sqrt(NdotV*NdotV*(1.0-alphaRoughnessSq)+alphaRoughnessSq);float GGXL=NdotV*sqrt(NdotL*NdotL*(1.0-alphaRoughnessSq)+alphaRoughnessSq);float GGX=GGXV+GGXL;if(GGX>0.0){return 0.5/GGX;}return 0.0;}float microfacetDistribution(MaterialInfo materialInfo,AngularInfo angularInfo){float alphaRoughnessSq=materialInfo.alphaRoughness*materialInfo.alphaRoughness;float f=(angularInfo.NdotH*alphaRoughnessSq-angularInfo.NdotH)*angularInfo.NdotH+1.0;return alphaRoughnessSq/(M_PI*f*f);}vec3 getPointShade(vec3 pointToLight,MaterialInfo materialInfo,vec3 normal,vec3 view){AngularInfo angularInfo=getAngularInfo(pointToLight,normal,view);if(angularInfo.NdotL>0.0||angularInfo.NdotV>0.0){vec3 F=specularReflection(materialInfo,angularInfo);float Vis=visibilityOcclusion(materialInfo,angularInfo);float D=microfacetDistribution(materialInfo,angularInfo);vec3 diffuseContrib=(1.0-F)*diffuse(materialInfo);vec3 specContrib=F*Vis*D;return angularInfo.NdotL*(diffuseContrib+specContrib);}return vec3(0.0,0.0,0.0);}float getRangeAttenuation(float range,float distance){if(range<=0.0){return 1.0;}return 1.0/(pow(5.0*distance/range,2.0)+1.0);}float getSpotAttenuation(vec3 pointToLight,vec3 spotDirection,float outerConeCos,float innerConeCos){float actualCos=dot(normalize(spotDirection),normalize(-pointToLight));if(actualCos>outerConeCos){if(actualCos<innerConeCos){return smoothstep(outerConeCos,innerConeCos,actualCos);}return 1.0;}return 0.0;}vec3 applyDirectionalLight(Light light,MaterialInfo materialInfo,vec3 normal,vec3 view,float shadow){vec3 pointToLight=-light.direction;vec3 shade=getPointShade(pointToLight,materialInfo,normal,view)*shadow;return light.intensity*light.color*shade;}vec3 applyPointLight(Light light,MaterialInfo materialInfo,vec3 normal,vec3 view){vec3 pointToLight=light.position-v_Position;float distance=length(pointToLight);float attenuation=getRangeAttenuation(light.range,distance);vec3 shade=getPointShade(pointToLight,materialInfo,normal,view);return light.color*shade*attenuation*light.intensity;}vec3 applySpotLight(Light light,MaterialInfo materialInfo,vec3 normal,vec3 view,float shadow){vec3 pointToLight=light.position-v_Position;float distance=length(pointToLight);float rangeAttenuation=getRangeAttenuation(light.range,distance);float spotAttenuation=getSpotAttenuation(pointToLight,light.direction,light.outerConeCos,light.innerConeCos);vec3 shade=getPointShade(pointToLight,materialInfo,normal,view)*shadow;return rangeAttenuation*spotAttenuation*light.intensity*light.color*shade;}vec3 applyAmbientLight(Light light,MaterialInfo materialInfo){return light.intensity*light.color*diffuse(materialInfo);}float weight(float z,float a){return clamp(pow(min(1.0,a*10.0)+0.01,3.0)*1e8*pow(1.0-z*0.9,3.0),1e-2,3e3);}void writeFragmentColor(vec4 fragColor){\n#if !defined(ALPHAMODE_OPAQUE) && defined(USE_WBOIT)\nfloat w=weight(gl_FragCoord.z,fragColor.a);fragColor.rgb*=fragColor.a;outFragColor0=vec4(fragColor.rgb*w,fragColor.a);outFragColor1=vec4(fragColor.a*w);\n#else\noutFragColor=fragColor;\n#endif\n}void main(){float perceptualRoughness=0.0;float metallic=0.0;vec4 baseColor=vec4(0.0,0.0,0.0,1.0);vec3 diffuseColor=vec3(0.0);vec3 specularColor=vec3(0.0);vec3 f0=vec3(0.04);\n#ifdef PREVIEW_BORDER\nwriteFragmentColor(uPreviewColor);return;\n#endif\n#ifdef MATERIAL_SPECULARGLOSSINESS\n#ifdef HAS_SPECULAR_GLOSSINESS_MAP\nvec4 sgSample=SRGBtoLINEAR(texture2D(u_SpecularGlossinessSampler,getSpecularGlossinessUV()));perceptualRoughness=(1.0-sgSample.a*u_GlossinessFactor);f0=sgSample.rgb*u_SpecularFactor;\n#else\nf0=u_SpecularFactor;perceptualRoughness=1.0-u_GlossinessFactor;\n#endif\n#ifdef HAS_DIFFUSE_MAP\nbaseColor=SRGBtoLINEAR(texture2D(u_DiffuseSampler,getDiffuseUV()))*u_DiffuseFactor;\n#else\nbaseColor=SRGBtoLINEAR(u_DiffuseFactor);\n#endif\nbaseColor*=getVertexColor();specularColor=f0;float oneMinusSpecularStrength=1.0-max(max(f0.r,f0.g),f0.b);diffuseColor=baseColor.rgb*oneMinusSpecularStrength;\n#ifdef DEBUG_METALLIC\nmetallic=solveMetallic(baseColor.rgb,specularColor,oneMinusSpecularStrength);\n#endif\n#endif\n#ifdef MATERIAL_METALLICROUGHNESS\n#ifdef HAS_METALLIC_ROUGHNESS_MAP\nvec4 mrSample=texture2D(u_MetallicRoughnessSampler,getMetallicRoughnessUV());perceptualRoughness=mrSample.g*u_RoughnessFactor;metallic=mrSample.b*u_MetallicFactor;\n#else\nmetallic=u_MetallicFactor;perceptualRoughness=u_RoughnessFactor;\n#endif\n#ifdef HAS_BASE_COLOR_MAP\nbaseColor=SRGBtoLINEAR(texture2D(u_BaseColorSampler,getBaseColorUV()))*u_BaseColorFactor;\n#else\nbaseColor=SRGBtoLINEAR(u_BaseColorFactor);\n#endif\nbaseColor*=getVertexColor();diffuseColor=baseColor.rgb*(vec3(1.0)-f0)*(1.0-metallic);specularColor=mix(f0,baseColor.rgb,metallic);\n#endif\n#ifdef ALPHAMODE_MASK\nif(baseColor.a<u_AlphaCutoff){discard;}baseColor.a=1.0;\n#endif\n#ifdef ALPHAMODE_OPAQUE\nbaseColor.a=1.0;\n#endif\n#ifdef MATERIAL_UNLIT\n#ifndef DEBUG_OUTPUT\n#ifdef ADD_FOG\nvec3 mixColor=getMixFogColor(baseColor.rgb);vec4 fragColorUnlit=vec4(LINEARtoSRGB(mixColor)*baseColor.a,baseColor.a);\n#else\nvec4 fragColorUnlit=vec4(LINEARtoSRGB(baseColor.rgb)*baseColor.a,baseColor.a);\n#endif\nwriteFragmentColor(fragColorUnlit);\n#else\n#ifdef DEBUG_UV\noutFragColor.rgb=vec3(getDebugUVColor(getBaseColorUV(),getNormal()));\n#endif\n#ifdef DEBUG_METALLIC\noutFragColor.rgb=vec3(metallic);\n#endif\n#ifdef DEBUG_ROUGHNESS\noutFragColor.rgb=vec3(perceptualRoughness);\n#endif\n#ifdef DEBUG_NORMAL\noutFragColor.rgb=getNormal()*0.5+0.5;\n#endif\n#ifdef DEBUG_BASECOLOR\noutFragColor.rgb=LINEARtoSRGB(baseColor.rgb);\n#endif\n#ifdef DEBUG_OCCLUSION\noutFragColor.rgb=vec3(1.0);\n#endif\n#ifdef DEBUG_EMISSIVE\noutFragColor.rgb=vec3(0.0);\n#endif\n#ifdef DEBUG_ALPHA\noutFragColor.rgb=vec3(baseColor.a);\n#endif\noutFragColor.a=1.0;\n#endif\nreturn;\n#endif\nmetallic=clamp(metallic,0.0,1.0);float alphaRoughness=perceptualRoughness*perceptualRoughness;vec3 normal=getNormal();\n#ifdef USE_SPECULAR_AA\nfloat AARoughnessFactor=getAARoughnessFactor(normal);perceptualRoughness+=AARoughnessFactor;alphaRoughness+=AARoughnessFactor;\n#endif\nperceptualRoughness=clamp(perceptualRoughness,0.04,1.0);alphaRoughness=clamp(alphaRoughness,0.04,1.0);float reflectance=max(max(specularColor.r,specularColor.g),specularColor.b);vec3 specularEnvironmentR0=specularColor.rgb;vec3 specularEnvironmentR90=vec3(clamp(reflectance*50.0,0.0,1.0));MaterialInfo materialInfo=MaterialInfo(perceptualRoughness,specularEnvironmentR0,alphaRoughness,diffuseColor,specularEnvironmentR90,specularColor);vec3 color=vec3(0.0,0.0,0.0);vec3 view=normalize(u_Camera-v_Position);float shadow=1.0;\n#ifdef USE_SHADOW_MAPPING\nshadow=getShadowContribution();\n#endif\n#ifdef USE_PUNCTUAL\nfor(int i=0;i<LIGHT_COUNT;++i){Light light=u_Lights[i];if(light.type==LightType_Directional){color+=applyDirectionalLight(light,materialInfo,normal,view,shadow);}else if(light.type==LightType_Point){color+=applyPointLight(light,materialInfo,normal,view);}else if(light.type==LightType_Spot){color+=applySpotLight(light,materialInfo,normal,view,shadow);}else if(light.type==LightType_Ambient){color+=applyAmbientLight(light,materialInfo);}}\n#endif\n#ifdef USE_IBL\ncolor+=getIBLContribution(materialInfo,normal,view);\n#endif\nfloat ao=1.0;\n#ifdef HAS_OCCLUSION_MAP\nao=texture2D(u_OcclusionSampler,getOcclusionUV()).r;color=mix(color,color*ao,u_OcclusionStrength);\n#endif\nvec3 emissive=vec3(0);\n#ifndef DEBUG_OUTPUT\n#ifdef ADD_FOG\nvec4 toneMapColor=SRGBtoLINEAR(vec4(toneMap(color),baseColor.a));color=getMixFogColor(toneMapColor.rgb);vec4 fragColorOut=vec4(LINEARtoSRGB(color.rgb)*baseColor.a,baseColor.a);\n#else\ncolor=toneMap(color)*baseColor.a;\n#ifdef HAS_EMISSIVE\ncolor+=u_EmissiveFactor;\n#endif\n#ifdef HAS_EMISSIVE_MAP\nemissive=SRGBtoLINEAR(texture2D(u_EmissiveSampler,getEmissiveUV())).rgb*u_EmissiveFactor;color+=emissive;\n#endif\nvec4 fragColorOut=vec4(color,baseColor.a);\n#endif\nwriteFragmentColor(fragColorOut);\n#else\n#ifdef DEBUG_UV\noutFragColor.rgb=vec3(getDebugUVColor(getBaseColorUV(),normal));\n#endif\n#ifdef DEBUG_METALLIC\noutFragColor.rgb=vec3(metallic);\n#endif\n#ifdef DEBUG_ROUGHNESS\noutFragColor.rgb=vec3(perceptualRoughness);\n#endif\n#ifdef DEBUG_NORMAL\noutFragColor.rgb=normal*0.5+0.5;\n#endif\n#ifdef DEBUG_BASECOLOR\noutFragColor.rgb=LINEARtoSRGB(baseColor.rgb);\n#endif\n#ifdef DEBUG_OCCLUSION\n#ifdef HAS_OCCLUSION_MAP\noutFragColor.rgb=vec3(mix(1.0,ao,u_OcclusionStrength));\n#else\noutFragColor.rgb=vec3(1.0);\n#endif\n#endif\n#ifdef DEBUG_EMISSIVE\n#ifdef HAS_EMISSIVE\nemissive=u_EmissiveFactor;\n#endif\n#ifdef HAS_EMISSIVE_MAP\nemissive=SRGBtoLINEAR(texture2D(u_EmissiveSampler,getEmissiveUV())).rgb*u_EmissiveFactor;\n#endif\noutFragColor.rgb=LINEARtoSRGB(emissive);\n#endif\n#ifdef DEBUG_F0\noutFragColor.rgb=vec3(f0);\n#endif\n#ifdef DEBUG_ALPHA\noutFragColor.rgb=vec3(baseColor.a);\n#endif\noutFragColor.a=1.0;\n#endif\n}";
+var metallicRoughnessFrag = "\n#define FEATURES\n#ifndef WEBGL2\n#extension GL_OES_standard_derivatives : enable\n#endif\n#if !defined(WEBGL2) && defined(USE_TEX_LOD)\n#extension GL_EXT_shader_texture_lod : enable\n#endif\n#ifdef USE_HDR\n#extension GL_OES_texture_float : enable\n#extension GL_OES_texture_float_linear : enable\n#endif\n#if !defined(WEBGL2) && defined(USE_WBOIT)\n#extension GL_EXT_draw_buffers: require\n#endif\n#ifdef GL_FRAGMENT_PRECISION_HIGH\nprecision highp float;\n#else\nprecision mediump float;\n#endif\n#ifdef WEBGL2\n#ifdef USE_WBOIT\nlayout(location=0)out vec4 outFragColor0;layout(location=1)out vec4 outFragColor1;\n#else\nout vec4 outFragColor;\n#endif\n#else\n#ifdef USE_WBOIT\n#define outFragColor0 gl_FragData[0]\n#define outFragColor1 gl_FragData[1]\n#else\n#define outFragColor gl_FragColor\n#endif\n#endif\n#include <webglCompatibility.glsl>\n#include <extensions.frag.glsl>\n#include <tonemapping.frag.glsl>\n#include <textures.vert.glsl>\n#include <functions.frag.glsl>\n#include <shadowCommon.vert.glsl>\n#include <shadow.frag.glsl>\nstruct Light{vec3 direction;float range;vec3 color;float intensity;vec3 position;float innerConeCos;float outerConeCos;int type;vec2 padding;};const int LightType_Directional=0;const int LightType_Point=1;const int LightType_Spot=2;const int LightType_Ambient=3;\n#ifdef USE_PUNCTUAL\nuniform Light u_Lights[LIGHT_COUNT];\n#endif\n#if defined(MATERIAL_SPECULARGLOSSINESS) || defined(MATERIAL_METALLICROUGHNESS)\nuniform float u_MetallicFactor;uniform float u_RoughnessFactor;uniform vec4 u_BaseColorFactor;\n#endif\n#ifdef MATERIAL_SPECULARGLOSSINESS\nuniform vec3 u_SpecularFactor;uniform vec4 u_DiffuseFactor;uniform float u_GlossinessFactor;\n#endif\n#ifdef ALPHAMODE_MASK\nuniform float u_AlphaCutoff;\n#endif\n#ifdef ADD_FOG\nuniform vec4 u_FogColor;\n#ifdef LINEAR_FOG\nuniform float u_FogNear;uniform float u_FogFar;\n#endif\n#ifdef EXP_FOG\nuniform float u_FogDensity;\n#endif\n#endif\n#ifdef PREVIEW_BORDER\nuniform vec4 uPreviewColor;\n#endif\nuniform vec3 u_Camera;uniform int u_MipCount;struct MaterialInfo{float perceptualRoughness;vec3 reflectance0;float alphaRoughness;vec3 diffuseColor;vec3 reflectance90;vec3 specularColor;};\n#ifdef ADD_FOG\nvec3 getMixFogColor(vec3 baseColor){vec3 distance=u_Camera-v_Position;float fogAmount=0.0;\n#ifdef LINEAR_FOG\nfogAmount=smoothstep(u_FogNear,u_FogFar,distance[2]);\n#endif\n#ifdef EXP_FOG\n#define LOG2 1.442695\nfogAmount=1.-exp2(-u_FogDensity*u_FogDensity*distance[2]*distance[2]*LOG2);fogAmount=clamp(fogAmount,0.,1.);\n#endif\nvec3 mixColor=baseColor.rgb+(vec3(u_FogColor)-baseColor.rgb)*fogAmount;return mixColor;}\n#endif\n#ifdef IRRADIANCE_COEFFICIENTS\nvec3 getIrradiance(vec3 norm,SHCoefficients c){float x=norm.x;float y=norm.y;float z=norm.z;float c1=0.429043;float c2=0.511664;float c3=0.743125;float c4=0.886227;float c5=0.247708;vec3 irradiance=c1*c.l22*(x*x-y*y)+c3*c.l20*(z*z)+c4*c.l00-c5*c.l20+2.0*c1*(c.l2m2*x*y+c.l21*x*z+c.l2m1*y*z)+2.0*c2*(c.l11*x+c.l1m1*y+c.l10*z);return irradiance;}\n#endif\n#ifdef USE_IBL\nvec3 getIBLContribution(MaterialInfo materialInfo,vec3 n,vec3 v){float NdotV=clamp(dot(n,v),0.0,1.0);float lod=clamp(materialInfo.perceptualRoughness*float(u_MipCount),0.0,float(u_MipCount));vec3 reflection=normalize(reflect(-v,n));vec2 brdfSamplePoint=clamp(vec2(NdotV,materialInfo.perceptualRoughness),vec2(0.0,0.0),vec2(1.0,1.0));vec2 brdf=texture2D(u_brdfLUT,brdfSamplePoint).rg;vec4 diffuseColor=vec4(1.0,0.0,0.0,1.0);\n#ifdef IRRADIANCE_COEFFICIENTS\nvec3 irradiance=getIrradiance(n,u_shCoefficients);diffuseColor=vec4(irradiance,1.0);\n#else\ndiffuseColor=textureCube(u_DiffuseEnvSampler,n);\n#endif\n#ifdef USE_TEX_LOD\nvec4 specularSample=_textureCubeLodEXT(u_SpecularEnvSampler,reflection,lod);\n#else\nvec4 specularSample=textureCube(u_SpecularEnvSampler,reflection,lod);\n#endif\n#ifdef USE_HDR\nvec3 diffuseLight=diffuseColor.rgb;vec3 specularLight=specularSample.rgb;\n#else\nvec3 diffuseLight=SRGBtoLINEAR(diffuseColor).rgb;vec3 specularLight=SRGBtoLINEAR(specularSample).rgb;\n#endif\nvec3 diffuse=diffuseLight*materialInfo.diffuseColor;vec3 specular=specularLight*(materialInfo.specularColor*brdf.x+brdf.y);return diffuse*u_IblIntensity[0]+specular*u_IblIntensity[1];}\n#endif\nvec3 diffuse(MaterialInfo materialInfo){return materialInfo.diffuseColor/M_PI;}vec3 specularReflection(MaterialInfo materialInfo,AngularInfo angularInfo){return materialInfo.reflectance0+(materialInfo.reflectance90-materialInfo.reflectance0)*pow(clamp(1.0-angularInfo.VdotH,0.0,1.0),5.0);}float visibilityOcclusion(MaterialInfo materialInfo,AngularInfo angularInfo){float NdotL=angularInfo.NdotL;float NdotV=angularInfo.NdotV;float alphaRoughnessSq=materialInfo.alphaRoughness*materialInfo.alphaRoughness;float GGXV=NdotL*sqrt(NdotV*NdotV*(1.0-alphaRoughnessSq)+alphaRoughnessSq);float GGXL=NdotV*sqrt(NdotL*NdotL*(1.0-alphaRoughnessSq)+alphaRoughnessSq);float GGX=GGXV+GGXL;if(GGX>0.0){return 0.5/GGX;}return 0.0;}float microfacetDistribution(MaterialInfo materialInfo,AngularInfo angularInfo){float alphaRoughnessSq=materialInfo.alphaRoughness*materialInfo.alphaRoughness;float f=(angularInfo.NdotH*alphaRoughnessSq-angularInfo.NdotH)*angularInfo.NdotH+1.0;return alphaRoughnessSq/(M_PI*f*f);}vec3 getPointShade(vec3 pointToLight,MaterialInfo materialInfo,vec3 normal,vec3 view){AngularInfo angularInfo=getAngularInfo(pointToLight,normal,view);if(angularInfo.NdotL>0.0||angularInfo.NdotV>0.0){vec3 F=specularReflection(materialInfo,angularInfo);float Vis=visibilityOcclusion(materialInfo,angularInfo);float D=microfacetDistribution(materialInfo,angularInfo);vec3 diffuseContrib=(1.0-F)*diffuse(materialInfo);vec3 specContrib=F*Vis*D;return angularInfo.NdotL*(diffuseContrib+specContrib);}return vec3(0.0,0.0,0.0);}float getRangeAttenuation(float range,float distance){if(range<=0.0){return 1.0;}return 1.0/(pow(5.0*distance/range,2.0)+1.0);}float getSpotAttenuation(vec3 pointToLight,vec3 spotDirection,float outerConeCos,float innerConeCos){float actualCos=dot(normalize(spotDirection),normalize(-pointToLight));if(actualCos>outerConeCos){if(actualCos<innerConeCos){return smoothstep(outerConeCos,innerConeCos,actualCos);}return 1.0;}return 0.0;}vec3 applyDirectionalLight(Light light,MaterialInfo materialInfo,vec3 normal,vec3 view,float shadow){vec3 pointToLight=-light.direction;vec3 shade=getPointShade(pointToLight,materialInfo,normal,view)*shadow;return light.intensity*light.color*shade;}vec3 applyPointLight(Light light,MaterialInfo materialInfo,vec3 normal,vec3 view){vec3 pointToLight=light.position-v_Position;float distance=length(pointToLight);float attenuation=getRangeAttenuation(light.range,distance);vec3 shade=getPointShade(pointToLight,materialInfo,normal,view);return light.color*shade*attenuation*light.intensity;}vec3 applySpotLight(Light light,MaterialInfo materialInfo,vec3 normal,vec3 view,float shadow){vec3 pointToLight=light.position-v_Position;float distance=length(pointToLight);float rangeAttenuation=getRangeAttenuation(light.range,distance);float spotAttenuation=getSpotAttenuation(pointToLight,light.direction,light.outerConeCos,light.innerConeCos);vec3 shade=getPointShade(pointToLight,materialInfo,normal,view)*shadow;return rangeAttenuation*spotAttenuation*light.intensity*light.color*shade;}vec3 applyAmbientLight(Light light,MaterialInfo materialInfo){return light.intensity*light.color*diffuse(materialInfo);}float weight(float z,float a){return clamp(pow(min(1.0,a*10.0)+0.01,3.0)*1e8*pow(1.0-z*0.9,3.0),1e-2,3e3);}void writeFragmentColor(vec4 fragColor){\n#if !defined(ALPHAMODE_OPAQUE) && defined(USE_WBOIT)\nfloat w=weight(gl_FragCoord.z,fragColor.a);fragColor.rgb*=fragColor.a;outFragColor0=vec4(fragColor.rgb*w,fragColor.a);outFragColor1=vec4(fragColor.a*w);\n#else\noutFragColor=fragColor;\n#endif\n}void main(){float perceptualRoughness=0.0;float metallic=0.0;vec4 baseColor=vec4(0.0,0.0,0.0,1.0);vec3 diffuseColor=vec3(0.0);vec3 specularColor=vec3(0.0);vec3 f0=vec3(0.04);\n#ifdef PREVIEW_BORDER\nwriteFragmentColor(uPreviewColor);return;\n#endif\n#ifdef MATERIAL_SPECULARGLOSSINESS\n#ifdef HAS_SPECULAR_GLOSSINESS_MAP\nvec4 sgSample=SRGBtoLINEAR(texture2D(u_SpecularGlossinessSampler,getSpecularGlossinessUV()));perceptualRoughness=(1.0-sgSample.a*u_GlossinessFactor);f0=sgSample.rgb*u_SpecularFactor;\n#else\nf0=u_SpecularFactor;perceptualRoughness=1.0-u_GlossinessFactor;\n#endif\n#ifdef HAS_DIFFUSE_MAP\nbaseColor=SRGBtoLINEAR(texture2D(u_DiffuseSampler,getDiffuseUV()))*u_DiffuseFactor;\n#else\nbaseColor=SRGBtoLINEAR(u_DiffuseFactor);\n#endif\nbaseColor*=getVertexColor();specularColor=f0;float oneMinusSpecularStrength=1.0-max(max(f0.r,f0.g),f0.b);diffuseColor=baseColor.rgb*oneMinusSpecularStrength;\n#ifdef DEBUG_METALLIC\nmetallic=solveMetallic(baseColor.rgb,specularColor,oneMinusSpecularStrength);\n#endif\n#endif\n#ifdef MATERIAL_METALLICROUGHNESS\n#ifdef HAS_METALLIC_ROUGHNESS_MAP\nvec4 mrSample=texture2D(u_MetallicRoughnessSampler,getMetallicRoughnessUV());perceptualRoughness=mrSample.g*u_RoughnessFactor;metallic=mrSample.b*u_MetallicFactor;\n#else\nmetallic=u_MetallicFactor;perceptualRoughness=u_RoughnessFactor;\n#endif\n#ifdef HAS_BASE_COLOR_MAP\nbaseColor=SRGBtoLINEAR(texture2D(u_BaseColorSampler,getBaseColorUV()))*u_BaseColorFactor;\n#else\nbaseColor=SRGBtoLINEAR(u_BaseColorFactor);\n#endif\nbaseColor*=getVertexColor();diffuseColor=baseColor.rgb*(vec3(1.0)-f0)*(1.0-metallic);specularColor=mix(f0,baseColor.rgb,metallic);\n#endif\n#ifdef ALPHAMODE_MASK\nif(baseColor.a<u_AlphaCutoff){discard;}baseColor.a=1.0;\n#endif\n#ifdef ALPHAMODE_OPAQUE\nbaseColor.a=1.0;\n#endif\n#ifdef MATERIAL_UNLIT\n#ifndef DEBUG_OUTPUT\n#ifdef ADD_FOG\nvec3 mixColor=getMixFogColor(baseColor.rgb);vec4 fragColorUnlit=vec4(LINEARtoSRGB(mixColor)*baseColor.a,baseColor.a);\n#else\nvec4 fragColorUnlit=vec4(LINEARtoSRGB(baseColor.rgb)*baseColor.a,baseColor.a);\n#endif\nwriteFragmentColor(fragColorUnlit);\n#else\n#ifdef DEBUG_UV\noutFragColor.rgb=vec3(getDebugUVColor(getBaseColorUV(),getNormal()));\n#endif\n#ifdef DEBUG_METALLIC\noutFragColor.rgb=vec3(metallic);\n#endif\n#ifdef DEBUG_ROUGHNESS\noutFragColor.rgb=vec3(perceptualRoughness);\n#endif\n#ifdef DEBUG_NORMAL\noutFragColor.rgb=getNormal()*0.5+0.5;\n#endif\n#ifdef DEBUG_BASECOLOR\noutFragColor.rgb=LINEARtoSRGB(baseColor.rgb);\n#endif\n#ifdef DEBUG_OCCLUSION\noutFragColor.rgb=vec3(1.0);\n#endif\n#ifdef DEBUG_EMISSIVE\noutFragColor.rgb=vec3(0.0);\n#endif\n#ifdef DEBUG_ALPHA\noutFragColor.rgb=vec3(baseColor.a);\n#endif\noutFragColor.a=1.0;\n#endif\nreturn;\n#endif\nmetallic=clamp(metallic,0.0,1.0);float alphaRoughness=perceptualRoughness*perceptualRoughness;vec3 normal=getNormal();\n#ifdef USE_SPECULAR_AA\nfloat AARoughnessFactor=getAARoughnessFactor(normal);perceptualRoughness+=AARoughnessFactor;alphaRoughness+=AARoughnessFactor;\n#endif\nperceptualRoughness=clamp(perceptualRoughness,0.04,1.0);alphaRoughness=clamp(alphaRoughness,0.04,1.0);float reflectance=max(max(specularColor.r,specularColor.g),specularColor.b);vec3 specularEnvironmentR0=specularColor.rgb;vec3 specularEnvironmentR90=vec3(clamp(reflectance*50.0,0.0,1.0));MaterialInfo materialInfo=MaterialInfo(perceptualRoughness,specularEnvironmentR0,alphaRoughness,diffuseColor,specularEnvironmentR90,specularColor);vec3 color=vec3(0.0,0.0,0.0);vec3 view=normalize(u_Camera-v_Position);float shadow=1.0;\n#ifdef USE_SHADOW_MAPPING\nshadow=getShadowContribution();\n#endif\n#ifdef USE_PUNCTUAL\nfor(int i=0;i<LIGHT_COUNT;++i){Light light=u_Lights[i];if(light.type==LightType_Directional){color+=applyDirectionalLight(light,materialInfo,normal,view,shadow);}else if(light.type==LightType_Point){color+=applyPointLight(light,materialInfo,normal,view);}else if(light.type==LightType_Spot){color+=applySpotLight(light,materialInfo,normal,view,shadow);}else if(light.type==LightType_Ambient){color+=applyAmbientLight(light,materialInfo);}}\n#endif\n#ifdef USE_IBL\ncolor+=getIBLContribution(materialInfo,normal,view);\n#endif\nfloat ao=1.0;\n#ifdef HAS_OCCLUSION_MAP\nao=texture2D(u_OcclusionSampler,getOcclusionUV()).r;color=mix(color,color*ao,u_OcclusionStrength);\n#endif\nvec3 emissive=vec3(0);\n#ifndef DEBUG_OUTPUT\n#ifdef ADD_FOG\nvec4 toneMapColor=SRGBtoLINEAR(vec4(toneMap(color),baseColor.a));color=getMixFogColor(toneMapColor.rgb);vec4 fragColorOut=vec4(LINEARtoSRGB(color.rgb)*baseColor.a,baseColor.a);\n#else\ncolor=toneMap(color)*baseColor.a;\n#ifdef HAS_EMISSIVE\ncolor+=u_EmissiveFactor.rgb;\n#endif\n#ifdef HAS_EMISSIVE_MAP\nemissive=SRGBtoLINEAR(texture2D(u_EmissiveSampler,getEmissiveUV())).rgb*u_EmissiveFactor.rgb;color+=emissive;\n#endif\nvec4 fragColorOut=vec4(color,baseColor.a);\n#endif\nwriteFragmentColor(fragColorOut);\n#else\n#ifdef DEBUG_UV\noutFragColor.rgb=vec3(getDebugUVColor(getBaseColorUV(),normal));\n#endif\n#ifdef DEBUG_METALLIC\noutFragColor.rgb=vec3(metallic);\n#endif\n#ifdef DEBUG_ROUGHNESS\noutFragColor.rgb=vec3(perceptualRoughness);\n#endif\n#ifdef DEBUG_NORMAL\noutFragColor.rgb=normal*0.5+0.5;\n#endif\n#ifdef DEBUG_BASECOLOR\noutFragColor.rgb=LINEARtoSRGB(baseColor.rgb);\n#endif\n#ifdef DEBUG_OCCLUSION\n#ifdef HAS_OCCLUSION_MAP\noutFragColor.rgb=vec3(mix(1.0,ao,u_OcclusionStrength));\n#else\noutFragColor.rgb=vec3(1.0);\n#endif\n#endif\n#ifdef DEBUG_EMISSIVE\n#ifdef HAS_EMISSIVE\nemissive=u_EmissiveFactor.rgb;\n#endif\n#ifdef HAS_EMISSIVE_MAP\nemissive=SRGBtoLINEAR(texture2D(u_EmissiveSampler,getEmissiveUV())).rgb*u_EmissiveFactor.rgb;\n#endif\noutFragColor.rgb=LINEARtoSRGB(emissive);\n#endif\n#ifdef DEBUG_F0\noutFragColor.rgb=vec3(f0);\n#endif\n#ifdef DEBUG_ALPHA\noutFragColor.rgb=vec3(baseColor.a);\n#endif\noutFragColor.a=1.0;\n#endif\n}";
 
 var shadowPassFrag = "#define FEATURES\n#include <shadowCommon.vert.glsl>\n#include <webglCompatibility.glsl>\n#if defined(SHADOWMAP_VSM) && !defined(WEBGL2)\n#extension GL_OES_standard_derivatives : enable\n#endif\n#ifdef GL_FRAGMENT_PRECISION_HIGH\nprecision highp float;\n#else\nprecision mediump float;\n#endif\n#ifdef WEBGL2\nout vec4 outFragColor;\n#else\n#define outFragColor gl_FragColor\n#endif\nvec4 CalcMomentVSM(float depth){float dx=0.0;float dy=0.0;\n#if defined(SHADOWMAP_VSM) && (defined(GL_OES_standard_derivatives) || defined(WEBGL2))\ndx=dFdx(depth);dy=dFdy(depth);\n#endif\nfloat moment2=depth*depth+0.25*(dx*dx+dy*dy);return vec4(1.0-depth,1.0-moment2,0.0,1.0);}vec4 CalcMomentEVSM(float depth){float pos=EVSM_FUNC0(depth);float neg=EVSM_FUNC1(depth);return vec4(pos,pos*pos,neg,neg*neg);}void main(){\n#if defined(SHADOWMAP_STANDARD) || defined(SHADOWMAP_VSM)\noutFragColor=CalcMomentVSM(gl_FragCoord.z);\n#else\noutFragColor=CalcMomentEVSM(gl_FragCoord.z);\n#endif\n}";
 
@@ -3934,7 +3991,7 @@ var extensionsFragGLSL = "vec3 _dFdx(vec3 coord){\n#if defined(GL_OES_standard_d
 
 var tonemappingFragGLSL = "uniform float u_Exposure;const float GAMMA=2.2;const float INV_GAMMA=1.0/GAMMA;vec3 LINEARtoSRGB(vec3 color){return pow(color,vec3(INV_GAMMA));}vec4 SRGBtoLINEAR(vec4 srgbIn){return vec4(pow(srgbIn.xyz,vec3(GAMMA)),srgbIn.w);}vec3 toneMapUncharted2Impl(vec3 color){const float A=0.15;const float B=0.50;const float C=0.10;const float D=0.20;const float E=0.02;const float F=0.30;return((color*(A*color+C*B)+D*E)/(color*(A*color+B)+D*F))-E/F;}vec3 toneMapUncharted(vec3 color){const float W=11.2;color=toneMapUncharted2Impl(color*2.0);vec3 whiteScale=1.0/toneMapUncharted2Impl(vec3(W));return LINEARtoSRGB(color*whiteScale);}vec3 toneMapHejlRichard(vec3 color){color=max(vec3(0.0),color-vec3(0.004));return(color*(6.2*color+.5))/(color*(6.2*color+1.7)+0.06);}vec3 toneMapACES(vec3 color){const float A=2.51;const float B=0.03;const float C=2.43;const float D=0.59;const float E=0.14;return LINEARtoSRGB(clamp((color*(A*color+B))/(color*(C*color+D)+E),0.0,1.0));}vec3 toneMap(vec3 color){color*=u_Exposure;\n#ifdef TONEMAP_UNCHARTED\nreturn toneMapUncharted(color);\n#endif\n#ifdef TONEMAP_HEJLRICHARD\nreturn toneMapHejlRichard(color);\n#endif\n#ifdef TONEMAP_ACES\nreturn toneMapACES(color);\n#endif\nreturn LINEARtoSRGB(color);}";
 
-var texturesVertGLSL = "fsIn vec2 v_UVCoord1;\n#ifdef HAS_UV_SET2\nfsIn vec2 v_UVCoord2;\n#endif\n#ifdef HAS_NORMAL_MAP\nuniform sampler2D u_NormalSampler;uniform float u_NormalScale;uniform int u_NormalUVSet;uniform mat3 u_NormalUVTransform;\n#endif\n#ifdef HAS_EMISSIVE_MAP\nuniform sampler2D u_EmissiveSampler;uniform int u_EmissiveUVSet;uniform vec3 u_EmissiveFactor;uniform mat3 u_EmissiveUVTransform;\n#endif\n#ifdef HAS_EMISSIVE\nuniform vec3 u_EmissiveFactor;\n#endif\n#ifdef HAS_OCCLUSION_MAP\nuniform sampler2D u_OcclusionSampler;uniform int u_OcclusionUVSet;uniform float u_OcclusionStrength;uniform mat3 u_OcclusionUVTransform;\n#endif\n#ifdef HAS_BASE_COLOR_MAP\nuniform sampler2D u_BaseColorSampler;uniform int u_BaseColorUVSet;uniform mat3 u_BaseColorUVTransform;\n#endif\n#ifdef HAS_METALLIC_ROUGHNESS_MAP\nuniform sampler2D u_MetallicRoughnessSampler;uniform int u_MetallicRoughnessUVSet;uniform mat3 u_MetallicRoughnessUVTransform;\n#endif\n#ifdef HAS_DIFFUSE_MAP\nuniform sampler2D u_DiffuseSampler;uniform int u_DiffuseUVSet;uniform mat3 u_DiffuseUVTransform;\n#endif\n#ifdef HAS_SPECULAR_GLOSSINESS_MAP\nuniform sampler2D u_SpecularGlossinessSampler;uniform int u_SpecularGlossinessUVSet;uniform mat3 u_SpecularGlossinessUVTransform;\n#endif\n#ifdef USE_IBL\nuniform samplerCube u_DiffuseEnvSampler;uniform samplerCube u_SpecularEnvSampler;uniform sampler2D u_brdfLUT;uniform vec2 u_IblIntensity;\n#endif\n#ifdef IRRADIANCE_COEFFICIENTS\nstruct SHCoefficients{vec3 l00,l1m1,l10,l11,l2m2,l2m1,l20,l21,l22;};uniform SHCoefficients u_shCoefficients;\n#endif\n#ifdef USE_SHADOW_MAPPING\nuniform sampler2D u_ShadowSampler;\n#endif\nvec2 getNormalUV(){vec3 uv=vec3(v_UVCoord1,1.0);\n#ifdef HAS_NORMAL_MAP\n#ifdef HAS_UV_SET2\nuv.xy=u_NormalUVSet<1 ? v_UVCoord1 : v_UVCoord2;\n#endif\n#ifdef HAS_NORMAL_UV_TRANSFORM\nuv*=u_NormalUVTransform;\n#endif\n#endif\nreturn uv.xy;}vec2 getEmissiveUV(){vec3 uv=vec3(v_UVCoord1,1.0);\n#ifdef HAS_EMISSIVE_MAP\n#ifdef HAS_UV_SET2\nuv.xy=u_EmissiveUVSet<1 ? v_UVCoord1 : v_UVCoord2;\n#endif\n#ifdef HAS_EMISSIVE_UV_TRANSFORM\nuv*=u_EmissiveUVTransform;\n#endif\n#endif\nreturn uv.xy;}vec2 getOcclusionUV(){vec3 uv=vec3(v_UVCoord1,1.0);\n#ifdef HAS_OCCLUSION_MAP\n#ifdef HAS_UV_SET2\nuv.xy=u_OcclusionUVSet<1 ? v_UVCoord1 : v_UVCoord2;\n#endif\n#ifdef HAS_OCCLUSION_UV_TRANSFORM\nuv*=u_OcclusionUVTransform;\n#endif\n#endif\nreturn uv.xy;}vec2 getBaseColorUV(){vec3 uv=vec3(v_UVCoord1,1.0);\n#ifdef HAS_BASE_COLOR_MAP\n#ifdef HAS_UV_SET2\nuv.xy=u_BaseColorUVSet<1 ? v_UVCoord1 : v_UVCoord2;\n#endif\n#ifdef HAS_BASECOLOR_UV_TRANSFORM\nuv*=u_BaseColorUVTransform;\n#endif\n#endif\nreturn uv.xy;}vec2 getMetallicRoughnessUV(){vec3 uv=vec3(v_UVCoord1,1.0);\n#ifdef HAS_METALLIC_ROUGHNESS_MAP\n#ifdef HAS_UV_SET2\nuv.xy=u_MetallicRoughnessUVSet<1 ? v_UVCoord1 : v_UVCoord2;\n#endif\n#ifdef HAS_METALLICROUGHNESS_UV_TRANSFORM\nuv*=u_MetallicRoughnessUVTransform;\n#endif\n#endif\nreturn uv.xy;}vec2 getSpecularGlossinessUV(){vec3 uv=vec3(v_UVCoord1,1.0);\n#ifdef HAS_SPECULAR_GLOSSINESS_MAP\n#ifdef HAS_UV_SET2\nuv.xy=u_SpecularGlossinessUVSet<1 ? v_UVCoord1 : v_UVCoord2;\n#endif\n#ifdef HAS_SPECULARGLOSSINESS_UV_TRANSFORM\nuv*=u_SpecularGlossinessUVTransform;\n#endif\n#endif\nreturn uv.xy;}vec2 getDiffuseUV(){vec3 uv=vec3(v_UVCoord1,1.0);\n#ifdef HAS_DIFFUSE_MAP\n#ifdef HAS_UV_SET2\nuv.xy=u_DiffuseUVSet<1 ? v_UVCoord1 : v_UVCoord2;\n#endif\n#ifdef HAS_DIFFUSE_UV_TRANSFORM\nuv*=u_DiffuseUVTransform;\n#endif\n#endif\nreturn uv.xy;}";
+var texturesVertGLSL = "fsIn vec2 v_UVCoord1;\n#ifdef HAS_UV_SET2\nfsIn vec2 v_UVCoord2;\n#endif\n#ifdef HAS_NORMAL_MAP\nuniform sampler2D u_NormalSampler;uniform float u_NormalScale;uniform int u_NormalUVSet;uniform mat3 u_NormalUVTransform;\n#endif\n#ifdef HAS_EMISSIVE_MAP\nuniform sampler2D u_EmissiveSampler;uniform int u_EmissiveUVSet;uniform vec4 u_EmissiveFactor;uniform mat3 u_EmissiveUVTransform;\n#endif\n#ifdef HAS_EMISSIVE\nuniform vec4 u_EmissiveFactor;\n#endif\n#ifdef HAS_OCCLUSION_MAP\nuniform sampler2D u_OcclusionSampler;uniform int u_OcclusionUVSet;uniform float u_OcclusionStrength;uniform mat3 u_OcclusionUVTransform;\n#endif\n#ifdef HAS_BASE_COLOR_MAP\nuniform sampler2D u_BaseColorSampler;uniform int u_BaseColorUVSet;uniform mat3 u_BaseColorUVTransform;\n#endif\n#ifdef HAS_METALLIC_ROUGHNESS_MAP\nuniform sampler2D u_MetallicRoughnessSampler;uniform int u_MetallicRoughnessUVSet;uniform mat3 u_MetallicRoughnessUVTransform;\n#endif\n#ifdef HAS_DIFFUSE_MAP\nuniform sampler2D u_DiffuseSampler;uniform int u_DiffuseUVSet;uniform mat3 u_DiffuseUVTransform;\n#endif\n#ifdef HAS_SPECULAR_GLOSSINESS_MAP\nuniform sampler2D u_SpecularGlossinessSampler;uniform int u_SpecularGlossinessUVSet;uniform mat3 u_SpecularGlossinessUVTransform;\n#endif\n#ifdef USE_IBL\nuniform samplerCube u_DiffuseEnvSampler;uniform samplerCube u_SpecularEnvSampler;uniform sampler2D u_brdfLUT;uniform vec2 u_IblIntensity;\n#endif\n#ifdef IRRADIANCE_COEFFICIENTS\nstruct SHCoefficients{vec3 l00,l1m1,l10,l11,l2m2,l2m1,l20,l21,l22;};uniform SHCoefficients u_shCoefficients;\n#endif\n#ifdef USE_SHADOW_MAPPING\nuniform sampler2D u_ShadowSampler;\n#endif\nvec2 getNormalUV(){vec3 uv=vec3(v_UVCoord1,1.0);\n#ifdef HAS_NORMAL_MAP\n#ifdef HAS_UV_SET2\nuv.xy=u_NormalUVSet<1 ? v_UVCoord1 : v_UVCoord2;\n#endif\n#ifdef HAS_NORMAL_UV_TRANSFORM\nuv*=u_NormalUVTransform;\n#endif\n#endif\nreturn uv.xy;}vec2 getEmissiveUV(){vec3 uv=vec3(v_UVCoord1,1.0);\n#ifdef HAS_EMISSIVE_MAP\n#ifdef HAS_UV_SET2\nuv.xy=u_EmissiveUVSet<1 ? v_UVCoord1 : v_UVCoord2;\n#endif\n#ifdef HAS_EMISSIVE_UV_TRANSFORM\nuv*=u_EmissiveUVTransform;\n#endif\n#endif\nreturn uv.xy;}vec2 getOcclusionUV(){vec3 uv=vec3(v_UVCoord1,1.0);\n#ifdef HAS_OCCLUSION_MAP\n#ifdef HAS_UV_SET2\nuv.xy=u_OcclusionUVSet<1 ? v_UVCoord1 : v_UVCoord2;\n#endif\n#ifdef HAS_OCCLUSION_UV_TRANSFORM\nuv*=u_OcclusionUVTransform;\n#endif\n#endif\nreturn uv.xy;}vec2 getBaseColorUV(){vec3 uv=vec3(v_UVCoord1,1.0);\n#ifdef HAS_BASE_COLOR_MAP\n#ifdef HAS_UV_SET2\nuv.xy=u_BaseColorUVSet<1 ? v_UVCoord1 : v_UVCoord2;\n#endif\n#ifdef HAS_BASECOLOR_UV_TRANSFORM\nuv*=u_BaseColorUVTransform;\n#endif\n#endif\nreturn uv.xy;}vec2 getMetallicRoughnessUV(){vec3 uv=vec3(v_UVCoord1,1.0);\n#ifdef HAS_METALLIC_ROUGHNESS_MAP\n#ifdef HAS_UV_SET2\nuv.xy=u_MetallicRoughnessUVSet<1 ? v_UVCoord1 : v_UVCoord2;\n#endif\n#ifdef HAS_METALLICROUGHNESS_UV_TRANSFORM\nuv*=u_MetallicRoughnessUVTransform;\n#endif\n#endif\nreturn uv.xy;}vec2 getSpecularGlossinessUV(){vec3 uv=vec3(v_UVCoord1,1.0);\n#ifdef HAS_SPECULAR_GLOSSINESS_MAP\n#ifdef HAS_UV_SET2\nuv.xy=u_SpecularGlossinessUVSet<1 ? v_UVCoord1 : v_UVCoord2;\n#endif\n#ifdef HAS_SPECULARGLOSSINESS_UV_TRANSFORM\nuv*=u_SpecularGlossinessUVTransform;\n#endif\n#endif\nreturn uv.xy;}vec2 getDiffuseUV(){vec3 uv=vec3(v_UVCoord1,1.0);\n#ifdef HAS_DIFFUSE_MAP\n#ifdef HAS_UV_SET2\nuv.xy=u_DiffuseUVSet<1 ? v_UVCoord1 : v_UVCoord2;\n#endif\n#ifdef HAS_DIFFUSE_UV_TRANSFORM\nuv*=u_DiffuseUVTransform;\n#endif\n#endif\nreturn uv.xy;}";
 
 var functionsFragGLSL = "const float M_PI=3.141592653589793;const float c_MinReflectance=0.04;fsIn vec3 v_Position;\n#ifdef HAS_NORMALS\n#ifdef HAS_TANGENTS\nfsIn mat3 v_TBN;\n#else\nfsIn vec3 v_Normal;\n#endif\n#endif\n#ifdef HAS_VERTEX_COLOR_VEC3\nfsIn vec3 v_Color;\n#endif\n#ifdef HAS_VERTEX_COLOR_VEC4\nfsIn vec4 v_Color;\n#endif\nstruct AngularInfo{float NdotL;float NdotV;float NdotH;float LdotH;float VdotH;vec3 padding;};vec4 getVertexColor(){vec4 color=vec4(1.0,1.0,1.0,1.0);\n#ifdef HAS_VERTEX_COLOR_VEC3\ncolor.rgb=v_Color;\n#endif\n#ifdef HAS_VERTEX_COLOR_VEC4\ncolor=v_Color;\n#endif\nreturn color;}vec3 getNormal(){vec2 UV=getNormalUV();\n#ifndef HAS_TANGENTS\nvec3 pos_dx=_dFdx(v_Position);vec3 pos_dy=_dFdy(v_Position);vec3 tex_dx=_dFdx(vec3(UV,0.0));vec3 tex_dy=_dFdy(vec3(UV,0.0));vec3 t=(tex_dy.t*pos_dx-tex_dx.t*pos_dy)/(tex_dx.s*tex_dy.t-tex_dy.s*tex_dx.t);\n#ifdef HAS_NORMALS\nvec3 ng=normalize(v_Normal);\n#else\nvec3 ng=cross(pos_dx,pos_dy);\n#endif\nt=normalize(t-ng*dot(ng,t));vec3 b=normalize(cross(ng,t));mat3 tbn=mat3(t,b,ng);\n#else\nmat3 tbn=v_TBN;\n#endif\n#ifdef HAS_NORMAL_MAP\nvec3 n=texture2D(u_NormalSampler,UV).rgb;n=normalize(tbn*((2.0*n-1.0)*vec3(u_NormalScale,u_NormalScale,1.0)));\n#else\nvec3 n=normalize(tbn[2].xyz);\n#endif\n#ifdef DOUBLE_SIDED\nfloat faceDirection=gl_FrontFacing ? 1.0 :-1.0;n=n*faceDirection;\n#endif\nreturn n;}float getPerceivedBrightness(vec3 vector){return sqrt(0.299*vector.r*vector.r+0.587*vector.g*vector.g+0.114*vector.b*vector.b);}float solveMetallic(vec3 diffuse,vec3 specular,float oneMinusSpecularStrength){float specularBrightness=getPerceivedBrightness(specular);if(specularBrightness<c_MinReflectance){return 0.0;}float diffuseBrightness=getPerceivedBrightness(diffuse);float a=c_MinReflectance;float b=diffuseBrightness*oneMinusSpecularStrength/(1.0-c_MinReflectance)+specularBrightness-2.0*c_MinReflectance;float c=c_MinReflectance-specularBrightness;float D=b*b-4.0*a*c;return clamp((-b+sqrt(D))/(2.0*a),0.0,1.0);}AngularInfo getAngularInfo(vec3 pointToLight,vec3 normal,vec3 view){vec3 n=normalize(normal);vec3 v=normalize(view);vec3 l=normalize(pointToLight);vec3 h=normalize(l+v);float NdotL=clamp(dot(n,l),0.0,1.0);float NdotV=clamp(dot(n,v),0.0,1.0);float NdotH=clamp(dot(n,h),0.0,1.0);float LdotH=clamp(dot(l,h),0.0,1.0);float VdotH=clamp(dot(v,h),0.0,1.0);return AngularInfo(NdotL,NdotV,NdotH,LdotH,VdotH,vec3(0,0,0));}float getAARoughnessFactor(vec3 normal){vec3 dxy=max(abs(_dFdx(normal)),abs(_dFdy(normal)));return max(max(dxy.x,dxy.y),dxy.z)*2.0;}\n#ifdef DEBUG_UV\nuniform float u_DebugUVGridSize;float getDebugUVColor(vec2 uv,vec3 n){float s=dot(abs(n),vec3(1,1,1))*0.6;uv=uv/(u_DebugUVGridSize*2.0);uv=uv-floor(uv);uv=uv*2.0-vec2(1.0);return s*(uv.x*uv.y>=0.0 ? 0.2: 1.0);}\n#endif\n";
 
@@ -4338,15 +4395,6 @@ function getPMeshList(player) {
     return meshList;
 }
 
-var ModelDataType;
-(function (ModelDataType) {
-    ModelDataType[ModelDataType["MeshComponent"] = 10000] = "MeshComponent";
-    ModelDataType[ModelDataType["SkyboxComponent"] = 10001] = "SkyboxComponent";
-    ModelDataType[ModelDataType["LightComponent"] = 10002] = "LightComponent";
-    ModelDataType[ModelDataType["CameraComponent"] = 10003] = "CameraComponent";
-    ModelDataType[ModelDataType["ModelPluginComponent"] = 10004] = "ModelPluginComponent";
-    ModelDataType[ModelDataType["TreeComponent"] = 10005] = "TreeComponent";
-})(ModelDataType || (ModelDataType = {}));
 /**
  * 插件 Mesh 组件类，支持 3D Mesh 渲染能力
  * @since 2.0.0
@@ -4357,9 +4405,9 @@ var ModelMeshComponent = /** @class */ (function (_super) {
     /**
      * 构造函数，只保存传入参数，不在这里创建内部对象
      * @param engine - 引擎
-     * @param options - Mesh 参数
+     * @param data - Mesh 参数
      */
-    function ModelMeshComponent(engine, options) {
+    function ModelMeshComponent(engine, data) {
         var _this = _super.call(this, engine) || this;
         /**
          * 获取点击测试参数，根据元素包围盒进行相交测试，Mesh 对象会进行更加精确的点击测试
@@ -4414,8 +4462,8 @@ var ModelMeshComponent = /** @class */ (function (_super) {
                 }
             }
         };
-        if (options) {
-            _this.fromData(options);
+        if (data) {
+            _this.fromData(data);
         }
         return _this;
     }
@@ -4467,22 +4515,20 @@ var ModelMeshComponent = /** @class */ (function (_super) {
     };
     /**
      * 反序列化，记录传入参数
-     * @param options - 组件参数
+     * @param data - 组件参数
      */
-    ModelMeshComponent.prototype.fromData = function (options) {
-        _super.prototype.fromData.call(this, options);
-        this.options = options;
+    ModelMeshComponent.prototype.fromData = function (data) {
+        _super.prototype.fromData.call(this, data);
+        this.data = data;
     };
     /**
      * 创建内部对象
      */
     ModelMeshComponent.prototype.createContent = function () {
-        if (this.options) {
-            var bounding = this.options.interaction;
+        if (this.data) {
+            var bounding = this.data.interaction;
             this.bounding = bounding && JSON.parse(JSON.stringify(bounding));
-            var meshOptions = this.options.options;
-            CheckerHelper.assertModelMeshOptions(meshOptions);
-            this.content = new PMesh(this.engine, this.item.name, this.options, this, this.item.parentId);
+            this.content = new PMesh(this.engine, this.item.name, this.data, this, this.item.parentId);
         }
     };
     /**
@@ -4524,7 +4570,7 @@ var ModelMeshComponent = /** @class */ (function (_super) {
         }
     };
     ModelMeshComponent = __decorate([
-        effectsClass(ModelDataType.MeshComponent)
+        effectsClass(DataType.MeshComponent)
     ], ModelMeshComponent);
     return ModelMeshComponent;
 }(RendererComponent));
@@ -4538,12 +4584,12 @@ var ModelSkyboxComponent = /** @class */ (function (_super) {
     /**
      * 构造函数，只保存传入参数，不在这里创建内部对象
      * @param engine - 引擎
-     * @param options - Mesh 参数
+     * @param data - Mesh 参数
      */
-    function ModelSkyboxComponent(engine, options) {
+    function ModelSkyboxComponent(engine, data) {
         var _this = _super.call(this, engine) || this;
-        if (options) {
-            _this.fromData(options);
+        if (data) {
+            _this.fromData(data);
         }
         return _this;
     }
@@ -4581,20 +4627,19 @@ var ModelSkyboxComponent = /** @class */ (function (_super) {
     };
     /**
      * 反序列化，记录传入参数
-     * @param options - 组件参数
+     * @param data - 组件参数
      */
-    ModelSkyboxComponent.prototype.fromData = function (options) {
-        _super.prototype.fromData.call(this, options);
-        this.options = options;
+    ModelSkyboxComponent.prototype.fromData = function (data) {
+        _super.prototype.fromData.call(this, data);
+        this.data = data;
     };
     /**
      * 创建内部对象
      */
     ModelSkyboxComponent.prototype.createContent = function () {
-        if (this.options) {
-            var skyboxOptions = this.options.options;
-            CheckerHelper.assertModelSkyboxOptions(skyboxOptions);
-            this.content = new PSkybox(this.item.name, skyboxOptions, this);
+        if (this.data) {
+            var skyboxData = this.data;
+            this.content = new PSkybox(this.item.name, skyboxData, this);
         }
     };
     /**
@@ -4613,7 +4658,7 @@ var ModelSkyboxComponent = /** @class */ (function (_super) {
         return (_b = (_a = this.content) === null || _a === void 0 ? void 0 : _a.visible) !== null && _b !== void 0 ? _b : false;
     };
     ModelSkyboxComponent = __decorate([
-        effectsClass(ModelDataType.SkyboxComponent)
+        effectsClass(DataType.SkyboxComponent)
     ], ModelSkyboxComponent);
     return ModelSkyboxComponent;
 }(RendererComponent));
@@ -4627,12 +4672,12 @@ var ModelLightComponent = /** @class */ (function (_super) {
     /**
      * 构造函数，只保存传入参数，不在这里创建内部对象
      * @param engine - 引擎
-     * @param options - Mesh 参数
+     * @param data - Mesh 参数
      */
-    function ModelLightComponent(engine, options) {
+    function ModelLightComponent(engine, data) {
         var _this = _super.call(this, engine) || this;
-        if (options) {
-            _this.fromData(options);
+        if (data) {
+            _this.fromData(data);
         }
         return _this;
     }
@@ -4661,20 +4706,19 @@ var ModelLightComponent = /** @class */ (function (_super) {
     };
     /**
      * 反序列化，记录传入参数
-     * @param options - 组件参数
+     * @param data - 组件参数
      */
-    ModelLightComponent.prototype.fromData = function (options) {
-        _super.prototype.fromData.call(this, options);
-        this.options = options;
+    ModelLightComponent.prototype.fromData = function (data) {
+        _super.prototype.fromData.call(this, data);
+        this.data = data;
     };
     /**
      * 创建内部对象
      */
     ModelLightComponent.prototype.createContent = function () {
-        if (this.options) {
-            var lightOptions = this.options.options;
-            CheckerHelper.assertModelLightOptions(lightOptions);
-            this.content = new PLight(this.item.name, lightOptions, this);
+        if (this.data) {
+            var lightData = this.data;
+            this.content = new PLight(this.item.name, lightData, this);
         }
     };
     /**
@@ -4693,7 +4737,7 @@ var ModelLightComponent = /** @class */ (function (_super) {
         return (_b = (_a = this.content) === null || _a === void 0 ? void 0 : _a.visible) !== null && _b !== void 0 ? _b : false;
     };
     ModelLightComponent = __decorate([
-        effectsClass(ModelDataType.LightComponent)
+        effectsClass(DataType.LightComponent)
     ], ModelLightComponent);
     return ModelLightComponent;
 }(ItemBehaviour));
@@ -4707,12 +4751,12 @@ var ModelCameraComponent = /** @class */ (function (_super) {
     /**
      * 构造函数，只保存传入参数，不在这里创建内部对象
      * @param engine - 引擎
-     * @param options - Mesh 参数
+     * @param data - Mesh 参数
      */
-    function ModelCameraComponent(engine, options) {
+    function ModelCameraComponent(engine, data) {
         var _this = _super.call(this, engine) || this;
-        if (options) {
-            _this.fromData(options);
+        if (data) {
+            _this.fromData(data);
         }
         return _this;
     }
@@ -4742,22 +4786,21 @@ var ModelCameraComponent = /** @class */ (function (_super) {
     };
     /**
      * 反序列化，记录传入参数
-     * @param options - 组件参数
+     * @param data - 组件参数
      */
-    ModelCameraComponent.prototype.fromData = function (options) {
-        _super.prototype.fromData.call(this, options);
-        this.options = options;
+    ModelCameraComponent.prototype.fromData = function (data) {
+        _super.prototype.fromData.call(this, data);
+        this.data = data;
     };
     /**
      * 创建内部对象
      */
     ModelCameraComponent.prototype.createContent = function () {
-        if (this.options) {
-            var cameraOptions = this.options.options;
-            CheckerHelper.assertModelCameraOptions(cameraOptions);
+        if (this.data) {
+            var cameraData = this.data;
             var width = this.engine.renderer.getWidth();
             var height = this.engine.renderer.getHeight();
-            this.content = new PCamera(this.item.name, width, height, cameraOptions, this);
+            this.content = new PCamera(this.item.name, width, height, cameraData, this);
         }
     };
     /**
@@ -4771,7 +4814,7 @@ var ModelCameraComponent = /** @class */ (function (_super) {
             composition.camera.setQuat(this.transform.quat);
             composition.camera.near = this.content.nearPlane;
             composition.camera.far = this.content.farPlane;
-            composition.camera.fov = this.content.fovy;
+            composition.camera.fov = this.content.fov;
         }
     };
     /**
@@ -4797,7 +4840,7 @@ var ModelCameraComponent = /** @class */ (function (_super) {
         this.updateMainCamera();
     };
     ModelCameraComponent = __decorate([
-        effectsClass(ModelDataType.CameraComponent)
+        effectsClass(DataType.CameraComponent)
     ], ModelCameraComponent);
     return ModelCameraComponent;
 }(ItemBehaviour));
@@ -5463,11 +5506,13 @@ var MeshHelper = /** @class */ (function () {
         var vertexShader = material.vertexShaderCode;
         var fragmentShader = material.fragmentShaderCode;
         var geometry = Geometry.create(engine, MeshHelper.getPlaneGeometry());
+        var isWebGL2 = engine.gpuCapability.level === 2;
         var effectsMaterial = Material.create(engine, {
             shader: {
                 vertex: vertexShader,
                 fragment: fragmentShader,
                 shared: globalState.shaderShared,
+                glslVersion: isWebGL2 ? GLSLVersion.GLSL3 : GLSLVersion.GLSL1,
             },
             uniformSemantics: uniformSemantics,
         });
@@ -7646,6 +7691,7 @@ var PMaterialBase = /** @class */ (function (_super) {
     __extends(PMaterialBase, _super);
     function PMaterialBase() {
         var _this = _super !== null && _super.apply(this, arguments) || this;
+        _this.fromMaterial = false;
         /**
          * 材质类型，主要是 pbr 和 unlit 两类
          */
@@ -7718,6 +7764,19 @@ var PMaterialBase = /** @class */ (function (_super) {
      * @param inFeatureList - 外部特性列表
      */
     PMaterialBase.prototype.build = function (inFeatureList) {
+        var finalFeatureList = this.getFeatureList(inFeatureList);
+        var isWebGL2 = PGlobalState.getInstance().isWebGL2;
+        //
+        var shaderManager = PShaderManager.getInstance();
+        var shaderResult = shaderManager.genShaderCode({
+            material: this,
+            isWebGL2: isWebGL2,
+            featureList: finalFeatureList,
+        });
+        this.vertexShaderCode = shaderResult.vertexShaderCode;
+        this.fragmentShaderCode = shaderResult.fragmentShaderCode;
+    };
+    PMaterialBase.prototype.getFeatureList = function (inFeatureList) {
         var finalFeatureList = this.getShaderFeatures();
         if (inFeatureList !== undefined) {
             finalFeatureList.push.apply(finalFeatureList, __spreadArray([], __read(inFeatureList), false));
@@ -7734,15 +7793,7 @@ var PMaterialBase = /** @class */ (function (_super) {
                 finalFeatureList.push('EDITOR_TRANSFORM');
             }
         }
-        //
-        var shaderManager = PShaderManager.getInstance();
-        var shaderResult = shaderManager.genShaderCode({
-            material: this,
-            isWebGL2: isWebGL2,
-            featureList: finalFeatureList,
-        });
-        this.vertexShaderCode = shaderResult.vertexShaderCode;
-        this.fragmentShaderCode = shaderResult.fragmentShaderCode;
+        return finalFeatureList;
     };
     /**
      * 获取混合模式，根据 GE 混合模式
@@ -8054,9 +8105,9 @@ var PMaterialPBR = /** @class */ (function (_super) {
          */
         _this.occlusionTextureStrength = 1;
         /**
-         * 自发光颜色值，默认是黑色 Vector3(0, 0, 0)
+         * 自发光颜色值，默认是黑色 Vector4(0, 0, 0, 0)
          */
-        _this.emissiveFactor = new Vector3(0, 0, 0);
+        _this.emissiveFactor = new Vector4(0, 0, 0, 0);
         /**
          * 自发光强度
          */
@@ -8112,7 +8163,7 @@ var PMaterialPBR = /** @class */ (function (_super) {
             this.emissiveTextureTrans = PluginHelper.createUVTransform(options.emissiveTextureTransform);
         }
         var emissiveFactor = PluginHelper.toPluginColor4(options.emissiveFactor);
-        this.emissiveFactor = Vector3.fromArray(emissiveFactor);
+        this.setEmissiveFactor(Vector3.fromArray(emissiveFactor));
         this.emissiveIntensity = options.emissiveIntensity;
         this.enableShadow = (_d = options.enableShadow) !== null && _d !== void 0 ? _d : false;
         /**
@@ -8128,6 +8179,39 @@ var PMaterialPBR = /** @class */ (function (_super) {
         this.alphaCutOff = (_e = options.alphaCutOff) !== null && _e !== void 0 ? _e : 0;
         this.faceSideMode = this.getFaceSideMode(options.side);
     };
+    PMaterialPBR.prototype.createFromMaterial = function (mat) {
+        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q;
+        this.fromMaterial = true;
+        this.material = mat;
+        this.name = mat.name;
+        this.type = PObjectType.material;
+        this.materialType = mat.getInt('shaderType') ? PMaterialType.unlit : PMaterialType.pbr;
+        //
+        this.baseColorTexture = (_a = mat.getTexture('u_BaseColorSampler')) !== null && _a !== void 0 ? _a : undefined;
+        this.baseColorFactor = (_b = mat.getVector4('u_BaseColorFactor')) !== null && _b !== void 0 ? _b : new Vector4(255, 255, 255, 255);
+        this.baseColorFactor.multiply(1 / 255.0);
+        this.metallicRoughnessTexture = (_c = mat.getTexture('u_MetallicRoughnessSampler')) !== null && _c !== void 0 ? _c : undefined;
+        this.useSpecularAA = mat.getInt('useSpecularAA') === 1;
+        this.metallicFactor = (_d = mat.getFloat('u_MetallicFactor')) !== null && _d !== void 0 ? _d : 1;
+        this.roughnessFactor = (_e = mat.getFloat('u_RoughnessFactor')) !== null && _e !== void 0 ? _e : 1;
+        this.normalTexture = (_f = mat.getTexture('u_NormalSampler')) !== null && _f !== void 0 ? _f : undefined;
+        this.normalTextureScale = (_g = mat.getFloat('u_NormalScale')) !== null && _g !== void 0 ? _g : 1;
+        this.occlusionTexture = (_h = mat.getTexture('u_OcclusionSampler')) !== null && _h !== void 0 ? _h : undefined;
+        this.occlusionTextureStrength = (_j = mat.getFloat('u_OcclusionTextureStrength')) !== null && _j !== void 0 ? _j : 1;
+        this.emissiveTexture = (_k = mat.getTexture('u_EmissiveSampler')) !== null && _k !== void 0 ? _k : undefined;
+        this.emissiveFactor = (_l = mat.getVector4('u_EmissiveFactor')) !== null && _l !== void 0 ? _l : new Vector4(0, 0, 0, 0);
+        this.emissiveFactor.multiply(1 / 255.0);
+        this.emissiveIntensity = (_m = mat.getFloat('u_EmissiveIntensity')) !== null && _m !== void 0 ? _m : 1;
+        var emissiveFactor = this.emissiveFactor.clone().multiply(this.emissiveIntensity);
+        mat.setVector4('u_EmissiveFactor', emissiveFactor);
+        this.enableShadow = false;
+        this.depthMask = false;
+        var blending = (_o = mat.getInt('blending')) !== null && _o !== void 0 ? _o : spec.MaterialBlending.opaque;
+        this.blendMode = this.getBlendMode(blending);
+        this.alphaCutOff = (_p = mat.getFloat('u_AlphaCutoff')) !== null && _p !== void 0 ? _p : 0;
+        var side = (_q = mat.getInt('side')) !== null && _q !== void 0 ? _q : spec.SideMode.FRONT;
+        this.faceSideMode = this.getFaceSideMode(side);
+    };
     /**
      * 销毁材质
      */
@@ -8190,6 +8274,35 @@ var PMaterialPBR = /** @class */ (function (_super) {
      */
     PMaterialPBR.prototype.updateUniforms = function (material) {
         _super.prototype.updateUniforms.call(this, material);
+        if (this.fromMaterial) {
+            var uvTransform_1 = new Matrix3().identity();
+            if (this.baseColorTexture !== undefined) {
+                material.setInt('u_BaseColorUVSet', 0);
+                material.setMatrix3('u_BaseColorUVTransform', uvTransform_1);
+            }
+            //
+            if (this.metallicRoughnessTexture !== undefined) {
+                material.setInt('u_MetallicRoughnessUVSet', 0);
+                material.setMatrix3('u_MetallicRoughnessUVTransform', uvTransform_1);
+            }
+            //
+            if (this.normalTexture !== undefined) {
+                material.setInt('u_NormalUVSet', 0);
+                material.setMatrix3('u_NormalUVTransform', uvTransform_1);
+            }
+            //
+            if (this.occlusionTexture !== undefined) {
+                material.setInt('u_OcclusionUVSet', 0);
+                material.setMatrix3('u_OcclusionUVTransform', uvTransform_1);
+            }
+            //
+            if (this.emissiveTexture !== undefined) {
+                material.setInt('u_EmissiveUVSet', 0);
+                material.setMatrix3('u_EmissiveUVTransform', uvTransform_1);
+            }
+            material.setFloat('u_Exposure', 3.0);
+            return;
+        }
         //
         var uvTransform = new Matrix3().identity();
         material.setVector4('u_BaseColorFactor', this.baseColorFactor);
@@ -8248,7 +8361,7 @@ var PMaterialPBR = /** @class */ (function (_super) {
         if (this.emissiveTexture !== undefined) {
             var emissiveFactor = this.getEmissiveFactor();
             material.setTexture('u_EmissiveSampler', this.emissiveTexture);
-            material.setVector3('u_EmissiveFactor', emissiveFactor);
+            material.setVector4('u_EmissiveFactor', emissiveFactor);
             material.setInt('u_EmissiveUVSet', 0);
             if (this.emissiveTextureTrans !== undefined) {
                 material.setMatrix3('u_EmissiveUVTransform', this.emissiveTextureTrans);
@@ -8260,7 +8373,7 @@ var PMaterialPBR = /** @class */ (function (_super) {
         }
         else if (this.hasEmissiveFactor()) {
             var emissiveFactor = this.getEmissiveFactor();
-            material.setVector3('u_EmissiveFactor', emissiveFactor);
+            material.setVector4('u_EmissiveFactor', emissiveFactor);
         }
         material.setFloat('u_Exposure', 3.0);
     };
@@ -8439,11 +8552,17 @@ var PMaterialPBR = /** @class */ (function (_super) {
     PMaterialPBR.prototype.setEmissiveFactor = function (val) {
         if (val instanceof Vector3) {
             // Vector3
-            this.emissiveFactor.set(val.x, val.y, val.z);
+            this.emissiveFactor.set(val.x, val.y, val.z, 0);
         }
         else {
             // vec3
-            this.emissiveFactor.set(val[0], val[1], val[2]);
+            this.emissiveFactor.set(val[0], val[1], val[2], 0);
+        }
+    };
+    PMaterialPBR.prototype.getTextureFromMaterial = function (mat, texName) {
+        var tex = mat.getTexture(texName);
+        if (tex !== null) {
+            return tex;
         }
     };
     return PMaterialPBR;
@@ -8454,15 +8573,22 @@ var PMaterialPBR = /** @class */ (function (_super) {
  * @returns 材质对象
  */
 function createPluginMaterial(options) {
-    if (options.type === spec.MaterialType.pbr) {
+    if (options instanceof Material) {
         var materialPBR = new PMaterialPBR();
-        materialPBR.create(options);
+        materialPBR.createFromMaterial(options);
         return materialPBR;
     }
     else {
-        var materialUnlit = new PMaterialUnlit();
-        materialUnlit.create(options);
-        return materialUnlit;
+        if (options.type === spec.MaterialType.pbr) {
+            var materialPBR = new PMaterialPBR();
+            materialPBR.create(options);
+            return materialPBR;
+        }
+        else {
+            var materialUnlit = new PMaterialUnlit();
+            materialUnlit.create(options);
+            return materialUnlit;
+        }
     }
 }
 function createInternalMaterial(options) {
@@ -8477,10 +8603,10 @@ var PSkybox = /** @class */ (function (_super) {
     /**
      * 构造函数
      * @param name - 名称
-     * @param options - 天空盒参数
+     * @param data - 天空盒参数
      * @param owner - 所属天空盒组件元素
      */
-    function PSkybox(name, options, owner) {
+    function PSkybox(name, data, owner) {
         var _a;
         var _this = _super.call(this) || this;
         /**
@@ -8515,14 +8641,27 @@ var PSkybox = /** @class */ (function (_super) {
         _this.type = PObjectType.skybox;
         _this.visible = false;
         _this.owner = owner;
-        _this.renderable = options.renderable;
-        _this.intensity = options.intensity;
-        _this.reflectionsIntensity = options.reflectionsIntensity;
-        _this.irradianceCoeffs = options.irradianceCoeffs;
-        _this.diffuseImage = options.diffuseImage;
-        _this.specularImage = options.specularImage;
-        _this.specularImageSize = options.specularImageSize;
-        _this.specularMipCount = options.specularMipCount;
+        var irradianceCoeffs = data.irradianceCoeffs;
+        _this.renderable = data.renderable;
+        _this.intensity = data.intensity;
+        _this.reflectionsIntensity = data.reflectionsIntensity;
+        if (irradianceCoeffs) {
+            _this.irradianceCoeffs = [];
+            for (var i = 0; i < irradianceCoeffs.length; i += 3) {
+                _this.irradianceCoeffs.push([
+                    irradianceCoeffs[i],
+                    irradianceCoeffs[i + 1],
+                    irradianceCoeffs[i + 2],
+                ]);
+            }
+        }
+        else {
+            _this.irradianceCoeffs = [];
+        }
+        _this.diffuseImage = data.diffuseImage;
+        _this.specularImage = data.specularImage;
+        _this.specularImageSize = data.specularImageSize;
+        _this.specularMipCount = data.specularMipCount;
         _this.priority = ((_a = owner === null || owner === void 0 ? void 0 : owner.item) === null || _a === void 0 ? void 0 : _a.listIndex) || 0;
         return _this;
     }
@@ -8587,7 +8726,7 @@ var PSkybox = /** @class */ (function (_super) {
             var sceneStates = scene.sceneStates;
             var camera = sceneStates.camera;
             var viewMatrix = sceneStates.viewMatrix;
-            var newProjViewMatrix = camera.getNewProjectionMatrix(camera.fovy).multiply(viewMatrix).invert();
+            var newProjViewMatrix = camera.getNewProjectionMatrix(camera.fov).multiply(viewMatrix).invert();
             var material = this.skyboxMesh.material;
             this.skyboxMaterial.updateUniforms(material);
             material.setMatrix('u_InvViewProjectionMatrix', newProjViewMatrix);
@@ -9395,6 +9534,28 @@ var ModelPlugin = /** @class */ (function (_super) {
             });
         });
     };
+    ModelPlugin.precompile = function (compositions, renderer) {
+        var isWebGL2 = renderer.engine.gpuCapability.level === 2;
+        var context = {
+            // @ts-expect-error
+            material: {
+                materialType: PMaterialType.pbr,
+            },
+            isWebGL2: isWebGL2,
+            featureList: [],
+        };
+        var pbrShader = getPBRPassShaderCode(context);
+        renderer.engine.addEffectsObjectData({
+            // FIXME: 'unlit000000000000000000000000000',
+            id: 'pbr00000000000000000000000000000',
+            dataType: 'Shader',
+            // @ts-expect-error
+            fragment: pbrShader.fragmentShaderCode,
+            vertex: pbrShader.vertexShaderCode,
+            glslVersion: isWebGL2 ? GLSLVersion.GLSL3 : GLSLVersion.GLSL1,
+        });
+        return Promise.resolve();
+    };
     /**
      * 创建 3D 场景管理器和缓存器
      * @param composition - 合成
@@ -9591,14 +9752,14 @@ var ModelPluginComponent = /** @class */ (function (_super) {
         var lightItemCount = 0;
         var items = (_b = (_a = this.item.composition) === null || _a === void 0 ? void 0 : _a.items) !== null && _b !== void 0 ? _b : [];
         items.forEach(function (item) {
-            if (item.type === spec.ItemType.light) {
+            if (item.getComponent(ModelLightComponent)) {
                 lightItemCount++;
             }
         });
         return lightItemCount;
     };
     ModelPluginComponent = __decorate([
-        effectsClass(ModelDataType.ModelPluginComponent)
+        effectsClass(DataType.ModelPluginComponent)
     ], ModelPluginComponent);
     return ModelPluginComponent;
 }(ItemBehaviour));
@@ -9811,7 +9972,7 @@ var ModelTreeComponent = /** @class */ (function (_super) {
         }
     };
     ModelTreeComponent = __decorate([
-        effectsClass(ModelDataType.TreeComponent)
+        effectsClass(DataType.TreeComponent)
     ], ModelTreeComponent);
     return ModelTreeComponent;
 }(ItemBehaviour));
@@ -9863,7 +10024,7 @@ var CameraGestureHandlerImp = /** @class */ (function () {
     CameraGestureHandlerImp.prototype.getItem = function () {
         var _this = this;
         var _a;
-        return (_a = this.composition.items) === null || _a === void 0 ? void 0 : _a.find(function (item) { return item.id === _this.getCurrentTarget(); });
+        return (_a = this.composition.items) === null || _a === void 0 ? void 0 : _a.find(function (item) { return item.name === _this.getCurrentTarget(); });
     };
     CameraGestureHandlerImp.prototype.getCurrentTarget = function () {
         return this.startParams.target;
@@ -10920,7 +11081,7 @@ var LoaderImpl = /** @class */ (function () {
             name: 'skybox',
             duration: this.getItemDuration(),
             endBehavior: this.getItemEndBehavior(),
-            type: 'skybox',
+            type: spec.ItemType.skybox,
             pluginName: 'model',
             content: {
                 options: this._skyboxOptions,
@@ -11644,8 +11805,8 @@ var GLTFHelper = /** @class */ (function () {
 
 registerPlugin('tree', ModelTreePlugin, VFXItem, true);
 registerPlugin('model', ModelPlugin, VFXItem);
-var version = "2.0.0-alpha.2";
+var version = "2.0.0-alpha.4";
 logger.info('plugin model version: ' + version);
 
-export { BoxMesh, CameraGestureHandlerImp, CameraGestureType, CheckerHelper, CompositionCache, CompositionHitTest, FBOOptions, Float16ArrayWrapper, GeometryBoxProxy, HitTestingProxy, HookOGLFunc, InterpolationSampler, LoaderHelper, LoaderImpl, MeshHelper, ModelCameraComponent, ModelDataType, ModelLightComponent, ModelMeshComponent, ModelPlugin, ModelPluginComponent, ModelSkyboxComponent, ModelTreeComponent, ModelTreeItem, ModelTreePlugin, PAnimInterpType, PAnimPathType, PAnimTexture, PAnimTrack, PAnimation, PAnimationManager, PBlendMode, PCamera, PCameraManager, PCoordinate, PEntity, PFaceSideMode, PGeometry, PGlobalState, PLight, PLightManager, PLightType, PMaterialBase, PMaterialPBR, PMaterialSkyboxFilter, PMaterialType, PMaterialUnlit, PMesh, PMorph, PObject, PObjectType, PPrimitive, PSceneManager, PShaderManager, PShadowType, PSkin, PSkybox, PSkyboxCreator, PSkyboxType, PTextureType, PTransform, PluginHelper, RayBoxTesting, RayIntersectsBoxWithRotation, RayTriangleTesting, TextureDataMode, ToggleItemBounding, TwoStatesSet, VFX_ITEM_TYPE_3D, VertexAttribBuffer, WebGLHelper, WebHelper, createAnimationSampler, createInternalMaterial, createPluginMaterial, getDefaultEffectsGLTFLoader, getDiffuseOnlyShaderCode, getGaussianBlurShaderCodeV1, getGaussianBlurShaderCodeV2, getKawaseBlurShaderCode, getNormalVisShaderCode, getPBRPassShaderCode, getPMeshList, getQuadFilterShaderCode, getRendererGPUInfo, getSceneManager, getShadowPassShaderCode, getSimpleFilterShaderCode, getSkyBoxShaderCode, getTransparecyBaseShader, getTransparecyFilterShader, setDefaultEffectsGLTFLoader, version };
+export { BoxMesh, CameraGestureHandlerImp, CameraGestureType, CheckerHelper, CompositionCache, CompositionHitTest, FBOOptions, Float16ArrayWrapper, GeometryBoxProxy, HitTestingProxy, HookOGLFunc, InterpolationSampler, LoaderHelper, LoaderImpl, MeshHelper, ModelCameraComponent, ModelLightComponent, ModelMeshComponent, ModelPlugin, ModelPluginComponent, ModelSkyboxComponent, ModelTreeComponent, ModelTreeItem, ModelTreePlugin, PAnimInterpType, PAnimPathType, PAnimTexture, PAnimTrack, PAnimation, PAnimationManager, PBlendMode, PCamera, PCameraManager, PCoordinate, PEntity, PFaceSideMode, PGeometry, PGlobalState, PLight, PLightManager, PLightType, PMaterialBase, PMaterialPBR, PMaterialSkyboxFilter, PMaterialType, PMaterialUnlit, PMesh, PMorph, PObject, PObjectType, PPrimitive, PSceneManager, PShaderManager, PShadowType, PSkin, PSkybox, PSkyboxCreator, PSkyboxType, PTextureType, PTransform, PluginHelper, RayBoxTesting, RayIntersectsBoxWithRotation, RayTriangleTesting, TextureDataMode, ToggleItemBounding, TwoStatesSet, VFX_ITEM_TYPE_3D, VertexAttribBuffer, WebGLHelper, WebHelper, createAnimationSampler, createInternalMaterial, createPluginMaterial, getDefaultEffectsGLTFLoader, getDiffuseOnlyShaderCode, getGaussianBlurShaderCodeV1, getGaussianBlurShaderCodeV2, getKawaseBlurShaderCode, getNormalVisShaderCode, getPBRPassShaderCode, getPMeshList, getQuadFilterShaderCode, getRendererGPUInfo, getSceneManager, getShadowPassShaderCode, getSimpleFilterShaderCode, getSkyBoxShaderCode, getTransparecyBaseShader, getTransparecyFilterShader, setDefaultEffectsGLTFLoader, version };
 //# sourceMappingURL=index.mjs.map