@galacean/effects-threejs 1.1.3 → 1.1.5

package/dist/index.mjs

@@ -3,7 +3,7 @@
  * Description: Galacean Effects runtime threejs plugin for the web
  * Author: Ant Group CO., Ltd.
  * Contributors: 燃然,飂兮,十弦,云垣,茂安,意绮
- * Version: v1.1.3
+ * Version: v1.1.5
  */
 
 import * as THREE from 'three';
@@ -14731,6 +14731,9 @@ var VFXItem = /** @class */ (function () {
     VFXItem.isTree = function (item) {
         return item.type === ItemType$1.tree;
     };
+    VFXItem.isCamera = function (item) {
+        return item.type === ItemType$1.camera;
+    };
     VFXItem.isExtraCamera = function (item) {
         return item.id === 'extra-camera' && item.name === 'extra-camera';
     };
@@ -14931,10 +14934,11 @@ var VFXItem = /** @class */ (function () {
                         }
                         else if (this.endBehavior === END_BEHAVIOR_DESTROY$1) {
                             this._contentVisible = false;
+                            shouldUpdate = true;
+                            dt = 0;
                             // 预合成配置 reusable 且销毁时， 需要隐藏其中的元素
                             if (this.type === ItemType$1.composition) {
                                 this.handleVisibleChanged(false);
-                                this.onItemUpdate(0, lifetime);
                             }
                         }
                         lifetime = Math.min(lifetime, 1);
@@ -14943,7 +14947,6 @@ var VFXItem = /** @class */ (function () {
                         shouldUpdate = true;
                         if (this.endBehavior === END_BEHAVIOR_RESTART$1) {
                             this.ended = true;
-                            lifetime = lifetime % 1;
                         }
                     }
                 }
@@ -14951,7 +14954,7 @@ var VFXItem = /** @class */ (function () {
                     this.setVisible(true);
                     this.callEnd = false;
                 }
-                this.lifetime = lifetime;
+                this.lifetime = lifetime % 1;
                 shouldUpdate && this.onItemUpdate(dt, lifetime);
             }
         }
@@ -15518,10 +15521,6 @@ var CameraVFXItem = /** @class */ (function (_super) {
         (_a = this.controller) === null || _a === void 0 ? void 0 : _a.update(lifetime);
         this.updateCamera();
     };
-    // override onEnd () {
-    //   this.controller?.update(1);
-    //   this.updateCamera();
-    // }
     CameraVFXItem.prototype.updateCamera = function () {
         if (this.controller && this.composition) {
             var camera = this.composition.camera;
@@ -19278,19 +19277,28 @@ var SpriteMesh = /** @class */ (function () {
         var aPointLen = 0;
         var indexLen = 0;
         var pointCount = 0;
+        var renderInfo;
         if (!items.length) {
             this.mesh.setVisible(false);
             return true;
         }
+        for (var i = 0; i < items.length; i++) {
+            if (items[i].renderInfo) {
+                renderInfo = items[i].renderInfo;
+                break;
+            }
+        }
+        if (!renderInfo) {
+            return true;
+        }
         this.items = items.slice();
         if (items.length > 2) {
             itemSlot = maxSpriteMeshItemCount;
         }
-        var renderInfo = items[0].renderInfo;
         if (this.mtlSlotCount !== itemSlot) {
             this.mesh.setMaterial(this.createMaterial(renderInfo, itemSlot), { textures: DestroyOptions.keep });
         }
-        var attachmentLength = (_d = (_c = (_b = (_a = renderInfo === null || renderInfo === void 0 ? void 0 : renderInfo.filter) === null || _a === void 0 ? void 0 : _a.passSplitOptions) === null || _b === void 0 ? void 0 : _b.attachments) === null || _c === void 0 ? void 0 : _c.length) !== null && _d !== void 0 ? _d : 0;
+        var attachmentLength = (_d = (_c = (_b = (_a = renderInfo.filter) === null || _a === void 0 ? void 0 : _a.passSplitOptions) === null || _b === void 0 ? void 0 : _b.attachments) === null || _c === void 0 ? void 0 : _c.length) !== null && _d !== void 0 ? _d : 0;
         this.splitLayer = attachmentLength > 0;
         for (var i = 0; i < items.length; i++) {
             var item = items[i];
@@ -23566,7 +23574,7 @@ var ParticleSystem = /** @class */ (function () {
         configurable: true
     });
     ParticleSystem.prototype.updateEmitterTransform = function (time) {
-        var parentTransform = this.parentTransform;
+        var parentTransform = this.transform.parentTransform;
         var _a = this.basicTransform, path = _a.path, position = _a.position;
         var selfPos = position.clone();
         if (path) {
@@ -23576,9 +23584,9 @@ var ParticleSystem = /** @class */ (function () {
         this.transform.setPosition(selfPos.x, selfPos.y, selfPos.z);
         if (this.options.particleFollowParent && parentTransform) {
             var tempMatrix = parentTransform.getWorldMatrix();
-            this.particleMesh.mesh.worldMatrix = tempMatrix.clone();
+            this.particleMesh.mesh.worldMatrix = tempMatrix;
             if (this.trailMesh) {
-                this.trailMesh.mesh.worldMatrix = tempMatrix.clone();
+                this.trailMesh.mesh.worldMatrix = tempMatrix;
             }
         }
     };
@@ -23597,8 +23605,8 @@ var ParticleSystem = /** @class */ (function () {
         link.pushNode(linkContent);
         this.particleMesh.setPoint(point, pointIndex);
         this.clearPointTrail(pointIndex);
-        if (this.parentTransform && this.trailMesh) {
-            this.trailMesh.setPointStartPos(pointIndex, this.parentTransform.position.clone());
+        if (this.trailMesh) {
+            this.trailMesh.setPointStartPos(pointIndex, this.transform.parentTransform.position.clone());
         }
     };
     ParticleSystem.prototype.setVisible = function (visible) {
@@ -23636,7 +23644,8 @@ var ParticleSystem = /** @class */ (function () {
         }
     };
     ParticleSystem.prototype.setParentTransform = function (transform) {
-        this.parentTransform = transform;
+        // this.transform.parentTransform = transform;
+        // this.parentTransform = transform;
     };
     ParticleSystem.prototype.getTextures = function () {
         var e_1, _a, e_2, _b;
@@ -23888,9 +23897,7 @@ var ParticleSystem = /** @class */ (function () {
                         if (options.removeParticle) {
                             mesh.removePoint(pointIndex);
                             this.clearPointTrail(pointIndex);
-                            link.removeNode(node);
-                            node.content = [0];
-                            // link.shiftNode(node.content); // 删了又加回去 没明白什么意思
+                            node.content[0] = 0;
                         }
                         hitPositions.push(pos);
                         if (!options.multiple) {
@@ -23929,8 +23936,8 @@ var ParticleSystem = /** @class */ (function () {
         if (trails.sizeAffectsLifetime) {
             lifetime *= size[0];
         }
-        if (trails.parentAffectsPosition && this.parentTransform) {
-            position.add(this.parentTransform.position);
+        if (trails.parentAffectsPosition && this.transform.parentTransform) {
+            position.add(this.transform.parentTransform.position);
             var pos = this.trailMesh.getPointStartPos(pointIndex);
             if (pos) {
                 position.subtract(pos);
@@ -24144,7 +24151,9 @@ function randomArrItem(arr, keepArr) {
 var ParticleVFXItem = /** @class */ (function (_super) {
     __extends(ParticleVFXItem, _super);
     function ParticleVFXItem() {
-        return _super !== null && _super.apply(this, arguments) || this;
+        var _this = _super !== null && _super.apply(this, arguments) || this;
+        _this.destroyed = false;
+        return _this;
     }
     Object.defineProperty(ParticleVFXItem.prototype, "type", {
         get: function () {
@@ -24170,12 +24179,11 @@ var ParticleVFXItem = /** @class */ (function (_super) {
     ParticleVFXItem.prototype.onItemUpdate = function (dt, lifetime) {
         var _a;
         if (this.content) {
-            var hide = !this.contentVisible;
+            var hide = !this.visible;
             var parentItem = this.parentId && ((_a = this.composition) === null || _a === void 0 ? void 0 : _a.getItemByID(this.parentId));
             if (!hide && parentItem) {
                 var parentData = parentItem.getRenderData();
                 if (parentData) {
-                    this.content.setParentTransform(parentData.transform);
                     if (!parentData.visible) {
                         hide = false;
                     }
@@ -29178,7 +29186,6 @@ var CompositionSourceManager = /** @class */ (function () {
         }
         var cachedTextures = textureOptions.map(function (option) { return option && (option instanceof Texture ? option : Texture.create(engine, option)); });
         // 缓存创建的Texture对象
-        // @ts-expect-error
         scene.textureOptions = cachedTextures;
         cachedTextures === null || cachedTextures === void 0 ? void 0 : cachedTextures.forEach(function (tex) { return tex === null || tex === void 0 ? void 0 : tex.initialize(); });
         try {
@@ -29408,24 +29415,24 @@ var AssetManager = /** @class */ (function () {
         this.timeout = timeout;
     };
     /**
-     * 场景创建
-     * 通过 json 创建出场景对象，并进行提前编译等工作
+     * 场景创建，通过 json 创建出场景对象，并进行提前编译等工作
      * @param url - json 的 URL 链接或者 json 对象
      * @param renderer - renderer 对象，用于获取管理、编译 shader 及 GPU 上下文的参数
      * @param options - 扩展参数
      * @returns
      */
     AssetManager.prototype.loadScene = function (url, renderer, options) {
-        var _a, _b;
+        var _a, _b, _c;
         return __awaiter(this, void 0, void 0, function () {
-            var rawJSON, timeLabel, startTime, timeInfos, gpuInstance, asyncShaderCompile, loadTimer, cancelLoading, waitPromise, hookTimeInfo, loadResourcePromise;
+            var rawJSON, timeLabel, startTime, timeInfos, gpuInstance, asyncShaderCompile, compressedTexture, loadTimer, cancelLoading, waitPromise, hookTimeInfo, loadResourcePromise;
             var _this = this;
-            return __generator(this, function (_c) {
+            return __generator(this, function (_d) {
                 timeLabel = "Load asset: ".concat(isString(url) ? url : this.id);
                 startTime = performance.now();
                 timeInfos = [];
                 gpuInstance = renderer === null || renderer === void 0 ? void 0 : renderer.engine.gpuCapability;
                 asyncShaderCompile = (_b = (_a = gpuInstance === null || gpuInstance === void 0 ? void 0 : gpuInstance.detail) === null || _a === void 0 ? void 0 : _a.asyncShaderCompile) !== null && _b !== void 0 ? _b : false;
+                compressedTexture = (_c = gpuInstance === null || gpuInstance === void 0 ? void 0 : gpuInstance.detail.compressedTexture) !== null && _c !== void 0 ? _c : 0;
                 cancelLoading = false;
                 waitPromise = new Promise(function (resolve, reject) {
                     return loadTimer = window.setTimeout(function () {
@@ -29450,10 +29457,10 @@ var AssetManager = /** @class */ (function () {
                     });
                 }); };
                 loadResourcePromise = function () { return __awaiter(_this, void 0, void 0, function () {
-                    var _a, usedImages, jsonScene, _b, bins, images, compositions, fonts, _c, loadedBins, loadedImages, loadedTextures, scene, totalTime;
+                    var scene, rawImages, images_1, i, _a, i, _b, usedImages_1, jsonScene_1, pluginSystem_1, _c, bins_1, images_2, compositions_1, fonts_1, _d, loadedBins_1, loadedImages_1, loadedTextures, totalTime;
                     var _this = this;
-                    return __generator(this, function (_d) {
-                        switch (_d.label) {
+                    return __generator(this, function (_e) {
+                        switch (_e.label) {
                             case 0:
                                 if (!isObject(url)) return [3 /*break*/, 1];
                                 // TODO: 原 JSONLoader contructor 判断是否兼容
@@ -29466,42 +29473,66 @@ var AssetManager = /** @class */ (function () {
                                 this.baseUrl = url;
                                 return [4 /*yield*/, hookTimeInfo('loadJSON', function () { return _this.loadJSON(url); })];
                             case 2:
-                                rawJSON = _d.sent();
-                                _d.label = 3;
-                            case 3: return [4 /*yield*/, hookTimeInfo('processJSON', function () { return _this.processJSON(rawJSON); })];
+                                rawJSON = _e.sent();
+                                _e.label = 3;
+                            case 3:
+                                if (!isScene(rawJSON)) return [3 /*break*/, 6];
+                                // 已经加载过的 可能需要更新数据模板
+                                scene = __assign$1({}, rawJSON);
+                                if (!(this.options && this.options.variables && Object.keys(this.options.variables).length !== 0)) return [3 /*break*/, 5];
+                                rawImages = rawJSON.jsonScene.images;
+                                images_1 = scene.images;
+                                for (i = 0; i < rawImages.length; i++) {
+                                    // 仅重新加载数据模板对应的图片
+                                    if (images_1[i] instanceof HTMLCanvasElement) {
+                                        images_1[i] = rawImages[i];
+                                    }
+                                }
+                                _a = scene;
+                                return [4 /*yield*/, hookTimeInfo('processImages', function () { return _this.processImages(images_1, scene.usedImages, compressedTexture); })];
                             case 4:
-                                _a = _d.sent(), usedImages = _a.usedImages, jsonScene = _a.jsonScene;
-                                _b = jsonScene.bins, bins = _b === void 0 ? [] : _b, images = jsonScene.images, compositions = jsonScene.compositions, fonts = jsonScene.fonts;
+                                _a.images = _e.sent();
+                                // 更新 TextureOptions 中的 image 指向
+                                for (i = 0; i < scene.images.length; i++) {
+                                    scene.textureOptions[i].image = scene.images[i];
+                                }
+                                _e.label = 5;
+                            case 5: return [3 /*break*/, 12];
+                            case 6: return [4 /*yield*/, hookTimeInfo('processJSON', function () { return _this.processJSON(rawJSON); })];
+                            case 7:
+                                _b = _e.sent(), usedImages_1 = _b.usedImages, jsonScene_1 = _b.jsonScene, pluginSystem_1 = _b.pluginSystem;
+                                _c = jsonScene_1.bins, bins_1 = _c === void 0 ? [] : _c, images_2 = jsonScene_1.images, compositions_1 = jsonScene_1.compositions, fonts_1 = jsonScene_1.fonts;
                                 return [4 /*yield*/, Promise.all([
-                                        hookTimeInfo('processBins', function () { return _this.processBins(bins); }),
-                                        hookTimeInfo('processImages', function () { var _a; return _this.processImages(images, usedImages, (_a = gpuInstance === null || gpuInstance === void 0 ? void 0 : gpuInstance.detail.compressedTexture) !== null && _a !== void 0 ? _a : 0); }),
-                                        hookTimeInfo("".concat(asyncShaderCompile ? 'async' : 'sync', " compile"), function () { return _this.precompile(compositions, renderer, options); }),
+                                        hookTimeInfo('processBins', function () { return _this.processBins(bins_1); }),
+                                        hookTimeInfo('processImages', function () { return _this.processImages(images_2, usedImages_1, compressedTexture); }),
+                                        hookTimeInfo("".concat(asyncShaderCompile ? 'async' : 'sync', " compile"), function () { return _this.precompile(compositions_1, pluginSystem_1, renderer, options); }),
                                     ])];
-                            case 5:
-                                _c = __read$3.apply(void 0, [_d.sent(), 2]), loadedBins = _c[0], loadedImages = _c[1];
-                                return [4 /*yield*/, hookTimeInfo('processFontURL', function () { return _this.processFontURL(fonts); })];
-                            case 6:
-                                _d.sent();
-                                return [4 /*yield*/, hookTimeInfo('processTextures', function () { return _this.processTextures(loadedImages, loadedBins, jsonScene); })];
-                            case 7:
-                                loadedTextures = _d.sent();
+                            case 8:
+                                _d = __read$3.apply(void 0, [_e.sent(), 2]), loadedBins_1 = _d[0], loadedImages_1 = _d[1];
+                                return [4 /*yield*/, hookTimeInfo('processFontURL', function () { return _this.processFontURL(fonts_1); })];
+                            case 9:
+                                _e.sent();
+                                return [4 /*yield*/, hookTimeInfo('processTextures', function () { return _this.processTextures(loadedImages_1, loadedBins_1, jsonScene_1); })];
+                            case 10:
+                                loadedTextures = _e.sent();
                                 scene = {
-                                    jsonScene: jsonScene,
-                                    images: loadedImages,
-                                    textureOptions: loadedTextures,
-                                    bins: loadedBins,
-                                    storage: {},
-                                    pluginSystem: this.pluginSystem,
-                                    renderLevel: this.options.renderLevel,
-                                    totalTime: 0,
-                                    startTime: 0,
                                     url: url,
+                                    renderLevel: this.options.renderLevel,
+                                    storage: {},
+                                    pluginSystem: pluginSystem_1,
+                                    jsonScene: jsonScene_1,
+                                    usedImages: usedImages_1,
+                                    images: loadedImages_1,
+                                    textureOptions: loadedTextures,
+                                    bins: loadedBins_1,
                                 };
                                 // 触发插件系统 pluginSystem 的回调 prepareResource
-                                return [4 /*yield*/, hookTimeInfo('processPlugins', function () { return _this.pluginSystem.loadResources(scene, _this.options); })];
-                            case 8:
+                                return [4 /*yield*/, hookTimeInfo('processPlugins', function () { return pluginSystem_1.loadResources(scene, _this.options); })];
+                            case 11:
                                 // 触发插件系统 pluginSystem 的回调 prepareResource
-                                _d.sent();
+                                _e.sent();
+                                _e.label = 12;
+                            case 12:
                                 totalTime = performance.now() - startTime;
                                 console.info({
                                     content: "".concat(timeLabel, ": ").concat(totalTime.toFixed(4), "ms, ").concat(timeInfos.join(' ')),
@@ -29518,7 +29549,7 @@ var AssetManager = /** @class */ (function () {
             });
         });
     };
-    AssetManager.prototype.precompile = function (compositions, renderer, options) {
+    AssetManager.prototype.precompile = function (compositions, pluginSystem, renderer, options) {
         return __awaiter(this, void 0, void 0, function () {
             var shaderLibrary;
             return __generator(this, function (_a) {
@@ -29528,7 +29559,7 @@ var AssetManager = /** @class */ (function () {
                             return [2 /*return*/];
                         }
                         shaderLibrary = renderer === null || renderer === void 0 ? void 0 : renderer.getShaderLibrary();
-                        return [4 /*yield*/, this.pluginSystem.precompile(compositions, renderer, options)];
+                        return [4 /*yield*/, (pluginSystem === null || pluginSystem === void 0 ? void 0 : pluginSystem.precompile(compositions, renderer, options))];
                     case 1:
                         _a.sent();
                         return [4 /*yield*/, new Promise(function (resolve) {
@@ -29545,7 +29576,7 @@ var AssetManager = /** @class */ (function () {
     };
     AssetManager.prototype.processJSON = function (json) {
         return __awaiter(this, void 0, void 0, function () {
-            var jsonScene, _a, plugins, sceneCompositions, imgUsage, images, renderLevel, usedImages;
+            var jsonScene, _a, plugins, sceneCompositions, imgUsage, images, pluginSystem, renderLevel, usedImages;
             return __generator(this, function (_b) {
                 switch (_b.label) {
                     case 0:
@@ -29559,8 +29590,8 @@ var AssetManager = /** @class */ (function () {
                             }
                         });
                         _a = jsonScene.plugins, plugins = _a === void 0 ? [] : _a, sceneCompositions = jsonScene.compositions, imgUsage = jsonScene.imgUsage, images = jsonScene.images;
-                        this.pluginSystem = new PluginSystem(plugins);
-                        return [4 /*yield*/, this.pluginSystem.processRawJSON(jsonScene, this.options)];
+                        pluginSystem = new PluginSystem(plugins);
+                        return [4 /*yield*/, pluginSystem.processRawJSON(jsonScene, this.options)];
                     case 1:
                         _b.sent();
                         renderLevel = this.options.renderLevel;
@@ -29577,6 +29608,7 @@ var AssetManager = /** @class */ (function () {
                         return [2 /*return*/, {
                                 usedImages: usedImages,
                                 jsonScene: jsonScene,
+                                pluginSystem: pluginSystem,
                             }];
                 }
             });
@@ -29960,7 +29992,8 @@ var CompVFXItem = /** @class */ (function (_super) {
                 }
                 else {
                     item = createVFXItem(this.itemProps[i], this.composition);
-                    item.transform.parentTransform = this.transform;
+                    // 相机不跟随合成移动
+                    item.transform.parentTransform = VFXItem.isCamera(item) ? new Transform() : this.transform;
                 }
                 if (VFXItem.isExtraCamera(item)) {
                     this.extraCamera = item;
@@ -30146,7 +30179,7 @@ var CompVFXItem = /** @class */ (function (_super) {
             if (!parentItem) {
                 itemNode.parentId = undefined;
                 item.parent = undefined;
-                item.transform.parentTransform = this.transform;
+                item.transform.parentTransform = VFXItem.isExtraCamera(item) ? new Transform() : this.transform;
             }
             else {
                 var parentNode = this.itemCacheMap.get(parentItem.id);
@@ -30443,7 +30476,7 @@ var Composition = /** @class */ (function () {
     });
     Object.defineProperty(Composition.prototype, "startTime", {
         /**
-         * 获取合成开始时间
+         * 获取合成开始渲染的时间
          */
         get: function () {
             var _a;
@@ -30523,7 +30556,12 @@ var Composition = /** @class */ (function () {
         if (this.content.ended && this.reusable) {
             this.restart();
         }
-        this.gotoAndPlay(this.time);
+        if (this.content.started) {
+            this.gotoAndPlay(this.time - this.startTime);
+        }
+        else {
+            this.gotoAndPlay(0);
+        }
     };
     /**
      * 暂停合成的播放
@@ -30537,14 +30575,21 @@ var Composition = /** @class */ (function () {
     Composition.prototype.resume = function () {
         this.paused = false;
     };
+    /**
+     * 跳转合成到指定时间播放
+     * @param time - 相对 startTime 的时间
+     */
     Composition.prototype.gotoAndPlay = function (time) {
         this.resume();
         if (!this.content.started) {
             this.content.start();
-            this.forwardTime(this.startTime);
         }
-        this.forwardTime(time);
+        this.forwardTime(time + this.startTime);
     };
+    /**
+     * 跳转合成到指定时间并暂停
+     * @param time - 相对 startTime 的时间
+     */
     Composition.prototype.gotoAndStop = function (time) {
         this.gotoAndPlay(time);
         this.pause();
@@ -30564,21 +30609,29 @@ var Composition = /** @class */ (function () {
     };
     /**
      * 跳到指定时间点（不做任何播放行为）
-     * @param time - 指定的时间
+     * @param time - 相对 startTime 的时间
      */
     Composition.prototype.setTime = function (time) {
         var pause = this.paused;
         if (pause) {
             this.resume();
         }
-        this.forwardTime(time, true);
+        if (!this.content.started) {
+            this.content.start();
+        }
+        this.forwardTime(time + this.startTime, true);
         if (pause) {
             this.pause();
         }
     };
+    /**
+     * 前进合成到指定时间
+     * @param time - 相对0时刻的时间
+     * @param skipRender - 是否跳过渲染
+     */
     Composition.prototype.forwardTime = function (time, skipRender) {
         if (skipRender === void 0) { skipRender = false; }
-        var deltaTime = (this.startTime + Math.max(0, time)) * 1000 - this.content.timeInms;
+        var deltaTime = time * 1000 - this.content.timeInms;
         var reverse = deltaTime < 0;
         var step = 15;
         var t = Math.abs(deltaTime);
@@ -32761,9 +32814,9 @@ Geometry.create = function (engine, options) {
 Mesh.create = function (engine, props) {
     return new ThreeMesh(engine, props);
 };
-var version = "1.1.3";
+var version = "1.1.5";
 console.info({
-    content: '[Galacean Effects THREEJS] version: ' + "1.1.3",
+    content: '[Galacean Effects THREEJS] version: ' + "1.1.5",
     type: LOG_TYPE,
 });