@galacean/effects-threejs 2.0.0-alpha.31 → 2.0.0-alpha.33

package/dist/index.js

@@ -3,7 +3,7 @@
  * Description: Galacean Effects runtime threejs plugin for the web
  * Author: Ant Group CO., Ltd.
  * Contributors: 燃然,飂兮,十弦,云垣,茂安,意绮
- * Version: v2.0.0-alpha.31
+ * Version: v2.0.0-alpha.33
  */
 
 'use strict';
@@ -4589,15 +4589,97 @@ function getDirectStore(target) {
     return decoratorInitialStore.get(classKey);
 }
 
+function _assert_this_initialized(self) {
+    if (self === void 0) throw new ReferenceError("this hasn't been initialised - super() hasn't been called");
+    return self;
+}
+
+var EventEmitter = function EventEmitter() {
+    var _this = this;
+    var _this1 = this;
+    this.listeners = {};
+    /**
+   * 移除事件监听器
+   * @param eventName - 事件名称
+   * @param listener - 事件监听器
+   * @returns
+   */ this.off = function(eventName, listener) {
+        if (!_this.listeners[eventName]) {
+            return;
+        }
+        _this.listeners[eventName] = _this.listeners[eventName].filter(function(param) {
+            var l = param.listener;
+            return l !== listener;
+        });
+    };
+    /**
+   * 监听事件
+   * @param eventName - 事件名称
+   * @param listener - 事件监听器
+   * @param options - 事件监听器选项
+   * @returns
+   */ this.on = function(eventName, listener, options) {
+        _this.listeners[eventName] = _this.listeners[eventName] || [];
+        _this.listeners[eventName].push({
+            listener: listener,
+            options: options
+        });
+        return function() {
+            return _this.off(eventName, listener);
+        };
+    };
+    /**
+   * 一次性监听事件
+   * @param eventName - 事件名称
+   * @param listener - 事件监听器
+   */ this.once = function(eventName, listener) {
+        _this.on(eventName, listener, {
+            once: true
+        });
+    };
+    /**
+   * 触发事件
+   * @param eventName - 事件名称
+   * @param args - 事件参数
+   */ this.emit = function(eventName) {
+        for(var _len = arguments.length, args = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++){
+            args[_key - 1] = arguments[_key];
+        }
+        var _this_listeners_eventName;
+        (_this_listeners_eventName = _this1.listeners[eventName]) == null ? void 0 : _this_listeners_eventName.forEach(function(param) {
+            var listener = param.listener, options = param.options;
+            listener.apply(void 0, [].concat(args));
+            if (options == null ? void 0 : options.once) {
+                _this1.off(eventName, listener);
+            }
+        });
+    };
+    /**
+   * 获取事件名称对应的所有监听器
+   * @param eventName - 事件名称
+   * @returns - 返回事件名称对应的所有监听器
+   */ this.getListeners = function(eventName) {
+        var _this_listeners_eventName;
+        return ((_this_listeners_eventName = _this.listeners[eventName]) == null ? void 0 : _this_listeners_eventName.map(function(param) {
+            var listener = param.listener;
+            return listener;
+        })) || [];
+    };
+};
+
 /**
  * @since 2.0.0
  * @internal
- */ var EffectsObject = /*#__PURE__*/ function() {
+ */ var EffectsObject = /*#__PURE__*/ function(EventEmitter) {
+    _inherits(EffectsObject, EventEmitter);
     function EffectsObject(engine) {
-        this.engine = engine;
-        this.guid = generateGUID();
-        this.taggedProperties = {};
-        this.engine.addInstance(this);
+        var _this;
+        _this = EventEmitter.call(this) || this;
+        _this.engine = engine;
+        _this.guid = generateGUID();
+        _this.taggedProperties = {};
+        _this.engine.addInstance(_assert_this_initialized(_this));
+        return _this;
     }
     var _proto = EffectsObject.prototype;
     _proto.getInstanceId = function getInstanceId() {
@@ -4623,7 +4705,7 @@ function getDirectStore(target) {
         return _instanceof1(obj, EffectsObject) && "guid" in obj;
     };
     return EffectsObject;
-}();
+}(EventEmitter);
 
 /**
  * @since 2.0.0
@@ -9013,6 +9095,9 @@ exports.MaterialRenderType = void 0;
    * 初始化 GPU 资源
    * @override
    */ _proto.initialize = function initialize() {
+    // OVERRIDE
+    };
+    _proto.createShaderVariant = function createShaderVariant() {
     // OVERRIDE
     };
     _proto.use = function use(render, globalUniforms) {
@@ -12723,6 +12808,7 @@ var GlobalUniforms = function GlobalUniforms() {
     this.floats = {};
     this.ints = {};
     // vector3s: Record<string, vec3> = {};
+    this.vector4s = {};
     this.matrices = {};
     //...
     this.samplers = [] // 存放的sampler名称。
@@ -12959,6 +13045,9 @@ var Renderer = /*#__PURE__*/ function() {
     _proto.setGlobalInt = function setGlobalInt(name, value) {
     // OVERRIDE
     };
+    _proto.setGlobalVector4 = function setGlobalVector4(name, value) {
+    // OVERRIDE
+    };
     _proto.setGlobalMatrix = function setGlobalMatrix(name, value) {
     // OVERRIDE
     };
@@ -13504,11 +13593,6 @@ var SpriteLoader = /*#__PURE__*/ function(AbstractPlugin) {
     return SpriteLoader;
 }(AbstractPlugin);
 
-function _assert_this_initialized(self) {
-    if (self === void 0) throw new ReferenceError("this hasn't been initialised - super() hasn't been called");
-    return self;
-}
-
 /**
  * 动画图，负责更新所有的动画节点
  * @since 2.0.0
@@ -15945,6 +16029,17 @@ var Link = /*#__PURE__*/ function() {
             }while (node = node.pre);
         }
     };
+    _proto.getNodeByIndex = function getNodeByIndex(index) {
+        var i = 0, res = this.first;
+        if (!res || index >= this.length || index < 0) {
+            return null;
+        }
+        while(i < index){
+            res = res.next;
+            i++;
+        }
+        return res;
+    };
     return Link;
 }();
 
@@ -16781,10 +16876,8 @@ exports.ParticleSystem = /*#__PURE__*/ function(Component) {
                         content[3].delay -= duration;
                     });
                     this.renderer.minusTimeForLoop(duration);
-                    this.onIterate(this);
                 } else {
                     this.ended = true;
-                    this.onEnd(this);
                     var endBehavior = this.item.endBehavior;
                     if (endBehavior === EndBehavior.freeze) {
                         this.frozen = true;
@@ -16932,7 +17025,21 @@ exports.ParticleSystem = /*#__PURE__*/ function(Component) {
             time: startTime
         });
     };
-    _proto.getPointPosition = function getPointPosition(point) {
+    /**
+   * 通过索引获取指定index粒子当前时刻的位置
+   * @params index - 粒子索引
+   */ _proto.getPointPositionByIndex = function getPointPositionByIndex(index) {
+        var point = this.particleLink.getNodeByIndex(index);
+        if (!point) {
+            console.error("Get point error.");
+            return null;
+        } else {
+            return this.getPointPosition(point.content[3]);
+        }
+    };
+    /**
+   * 通过粒子参数获取当前时刻粒子的位置
+   */ _proto.getPointPosition = function getPointPosition(point) {
         var transform = point.transform, vel = point.vel, lifetime = point.lifetime, delay = point.delay, _point_gravity = point.gravity, gravity = _point_gravity === void 0 ? [] : _point_gravity;
         var forceTarget = this.options.forceTarget;
         var time = this.lastUpdate - delay;
@@ -16954,8 +17061,6 @@ exports.ParticleSystem = /*#__PURE__*/ function(Component) {
         }
         return ret;
     };
-    _proto.onEnd = function onEnd(particle) {};
-    _proto.onIterate = function onIterate(particle) {};
     _proto.initPoint = function initPoint(data) {
         var options = this.options;
         var lifetime = this.lifetime;
@@ -17914,31 +18019,6 @@ var ParticleMesh = /*#__PURE__*/ function() {
             data[i + 3]
         ];
     };
-    /**
-   * 待废弃
-   * @deprecated - 使用 `particle-system.getPointPosition` 替代
-   */ _proto.getPointPosition = function getPointPosition(index) {
-        var geo = this.geometry;
-        var posIndex = index * 48;
-        var posData = geo.getAttributeData("aPos");
-        var offsetData = geo.getAttributeData("aOffset");
-        var time = this.time - offsetData[index * 16 + 2];
-        var pointDur = offsetData[index * 16 + 3];
-        var mtl = this.mesh.material;
-        var acc = mtl.getVector4("uAcceleration").toVector3();
-        var pos = Vector3.fromArray(posData, posIndex);
-        var vel = Vector3.fromArray(posData, posIndex + 3);
-        var ret = calculateTranslation(new Vector3(), this, acc, time, pointDur, pos, vel);
-        if (this.forceTarget) {
-            var target = mtl.getVector3("uFinalTarget");
-            var life = this.forceTarget.curve.getValue(time / pointDur);
-            var dl = 1 - life;
-            ret.x = ret.x * dl + target.x * life;
-            ret.y = ret.y * dl + target.y * life;
-            ret.z = ret.z * dl + target.z * life;
-        }
-        return ret;
-    };
     _proto.clearPoints = function clearPoints() {
         this.resetGeometryData(this.geometry);
         this.particleCount = 0;
@@ -19329,10 +19409,6 @@ function compareTracks(a, b) {
     };
     _proto.update = function update(dt) {
         var time = this.time;
-        // 主合成 rootItem 没有绑定轨道，增加结束行为判断。
-        if (this.item.isEnded(this.time) && !this.item.parent) {
-            this.item.ended = true;
-        }
         this.timelinePlayable.setTime(time);
         this.graph.evaluate(dt);
     };
@@ -19465,6 +19541,8 @@ function compareTracks(a, b) {
                             hitPositions: hitPositions,
                             behavior: hitParams.behavior
                         };
+                        // 触发单个元素的点击事件
+                        item.emit("click", region);
                         regions.push(region);
                         if (stop(region)) {
                             return {
@@ -20700,8 +20778,6 @@ exports.VFXItem = /*#__PURE__*/ function(EffectsObject) {
         this.parentId = parentId;
         this.duration = duration;
         this.endBehavior = endBehavior;
-        //@ts-expect-error
-        this.oldId = data.oldId;
         if (!data.content) {
             data.content = {
                 options: {}
@@ -24710,89 +24786,93 @@ var listOrder = 0;
  * 合成抽象类：核心对象，通常一个场景只包含一个合成，可能会有多个合成。
  * 合成中包含了相关的 Item 元素，支持对 Item 元素的创建、更新和销毁。
  * 也负责 Item 相关的动画播放控制，和持有渲染帧数据。
- */ var Composition = /*#__PURE__*/ function() {
+ */ var Composition = /*#__PURE__*/ function(EventEmitter) {
+    _inherits(Composition, EventEmitter);
     function Composition(props, scene) {
-        var _this = this;
+        var _this;
+        _this = EventEmitter.call(this) || this;
         /**
    * 动画播放速度
-   */ this.speed = 1;
+   */ _this.speed = 1;
         /**
    * 用于保存与当前合成相关的插件数据
-   */ this.loaderData = {};
+   */ _this.loaderData = {};
         /**
    * 预合成数组
-   */ this.refContent = [];
+   */ _this.refContent = [];
         /**
    * 预合成的合成属性，在 content 中会被其元素属性覆盖
-   */ this.refCompositionProps = new Map();
+   */ _this.refCompositionProps = new Map();
         // TODO: 待优化
-        this.assigned = false;
+        _this.assigned = false;
         /**
    * 销毁状态位
-   */ this.destroyed = false;
-        this.postLoaders = [];
+   */ _this.destroyed = false;
+        _this.postLoaders = [];
         /**
    * 合成暂停/播放 标识
-   */ this.paused = false;
-        this.lastVideoUpdateTime = 0;
-        var _props_reusable = props.reusable, reusable = _props_reusable === void 0 ? false : _props_reusable, _props_speed = props.speed, speed = _props_speed === void 0 ? 1 : _props_speed, _props_baseRenderOrder = props.baseRenderOrder, baseRenderOrder = _props_baseRenderOrder === void 0 ? 0 : _props_baseRenderOrder, renderer = props.renderer, onPlayerPause = props.onPlayerPause, onMessageItem = props.onMessageItem, onEnd = props.onEnd, event = props.event, width = props.width, height = props.height;
-        this.compositionSourceManager = new CompositionSourceManager(scene, renderer.engine);
+   */ _this.paused = false;
+        _this.lastVideoUpdateTime = 0;
+        var _props_reusable = props.reusable, reusable = _props_reusable === void 0 ? false : _props_reusable, _props_speed = props.speed, speed = _props_speed === void 0 ? 1 : _props_speed, _props_baseRenderOrder = props.baseRenderOrder, baseRenderOrder = _props_baseRenderOrder === void 0 ? 0 : _props_baseRenderOrder, renderer = props.renderer, event = props.event, width = props.width, height = props.height, handleItemMessage = props.handleItemMessage;
+        _this.compositionSourceManager = new CompositionSourceManager(scene, renderer.engine);
         scene.jsonScene.imgUsage = undefined;
         if (reusable) {
-            this.keepResource = true;
+            _this.keepResource = true;
             scene.textures = undefined;
             scene.consumed = true;
         }
-        var _this_compositionSourceManager = this.compositionSourceManager, sourceContent = _this_compositionSourceManager.sourceContent, pluginSystem = _this_compositionSourceManager.pluginSystem, imgUsage = _this_compositionSourceManager.imgUsage, totalTime = _this_compositionSourceManager.totalTime, refCompositionProps = _this_compositionSourceManager.refCompositionProps;
+        var _this_compositionSourceManager = _this.compositionSourceManager, sourceContent = _this_compositionSourceManager.sourceContent, pluginSystem = _this_compositionSourceManager.pluginSystem, imgUsage = _this_compositionSourceManager.imgUsage, totalTime = _this_compositionSourceManager.totalTime, refCompositionProps = _this_compositionSourceManager.refCompositionProps;
         assertExist(sourceContent);
-        this.renderer = renderer;
-        this.refCompositionProps = refCompositionProps;
-        this.rootItem = new exports.VFXItem(this.getEngine(), sourceContent);
-        this.rootItem.name = "rootItem";
-        this.rootItem.composition = this;
-        this.rootComposition = this.rootItem.addComponent(CompositionComponent);
-        this.rootComposition.data = sourceContent;
+        _this.renderer = renderer;
+        _this.refCompositionProps = refCompositionProps;
+        _this.rootItem = new exports.VFXItem(_this.getEngine(), sourceContent);
+        _this.rootItem.name = "rootItem";
+        _this.rootItem.composition = _assert_this_initialized(_this);
+        _this.rootComposition = _this.rootItem.addComponent(CompositionComponent);
+        _this.rootComposition.startTime = sourceContent.startTime;
+        _this.rootComposition.data = sourceContent;
         var imageUsage = !reusable && imgUsage;
-        this.width = width;
-        this.height = height;
-        this.renderOrder = baseRenderOrder;
-        this.id = sourceContent.id;
-        this.renderer = renderer;
-        this.texInfo = imageUsage != null ? imageUsage : {};
-        this.event = event;
+        _this.width = width;
+        _this.height = height;
+        _this.renderOrder = baseRenderOrder;
+        _this.id = sourceContent.id;
+        _this.renderer = renderer;
+        _this.texInfo = imageUsage != null ? imageUsage : {};
+        _this.event = event;
         var _scene_startTime, _scene_timeInfos_asyncCompile;
-        this.statistic = {
+        _this.statistic = {
             loadTime: totalTime != null ? totalTime : 0,
             loadStart: (_scene_startTime = scene.startTime) != null ? _scene_startTime : 0,
             firstFrameTime: 0,
             precompileTime: (_scene_timeInfos_asyncCompile = scene.timeInfos["asyncCompile"]) != null ? _scene_timeInfos_asyncCompile : scene.timeInfos["syncCompile"]
         };
-        this.reusable = reusable;
-        this.speed = speed;
-        this.autoRefTex = !this.keepResource && imageUsage && this.rootItem.endBehavior !== EndBehavior.restart;
-        this.name = sourceContent.name;
-        this.pluginSystem = pluginSystem;
-        this.pluginSystem.initializeComposition(this, scene);
-        this.camera = new Camera(this.name, _extends({}, sourceContent == null ? void 0 : sourceContent.camera, {
+        _this.reusable = reusable;
+        _this.speed = speed;
+        _this.autoRefTex = !_this.keepResource && imageUsage && _this.rootItem.endBehavior !== EndBehavior.restart;
+        _this.name = sourceContent.name;
+        _this.pluginSystem = pluginSystem;
+        _this.pluginSystem.initializeComposition(_assert_this_initialized(_this), scene);
+        _this.camera = new Camera(_this.name, _extends({}, sourceContent == null ? void 0 : sourceContent.camera, {
             aspect: width / height
         }));
-        this.url = scene.url;
-        this.assigned = true;
-        this.globalTime = 0;
-        this.interactive = true;
-        this.onPlayerPause = onPlayerPause;
-        this.onMessageItem = onMessageItem;
-        this.onEnd = onEnd;
-        this.createRenderFrame();
-        this.rendererOptions = null;
-        this.rootComposition.createContent();
-        this.buildItemTree(this.rootItem);
-        this.rootItem.onEnd = function() {
+        _this.url = scene.url;
+        _this.assigned = true;
+        _this.globalTime = 0;
+        _this.interactive = true;
+        _this.handleItemMessage = handleItemMessage;
+        _this.createRenderFrame();
+        _this.rendererOptions = null;
+        _this.rootComposition.createContent();
+        _this.buildItemTree(_this.rootItem);
+        _this.rootItem.onEnd = function() {
             window.setTimeout(function() {
-                _this.onEnd == null ? void 0 : _this.onEnd.call(_this, _this);
+                _this.emit("end", {
+                    composition: _assert_this_initialized(_this)
+                });
             }, 0);
         };
-        this.pluginSystem.resetComposition(this, this.renderFrame);
+        _this.pluginSystem.resetComposition(_assert_this_initialized(_this), _this.renderFrame);
+        return _this;
     }
     var _proto = Composition.prototype;
     /**
@@ -24843,7 +24923,7 @@ var listOrder = 0;
         if (this.rootItem.ended && this.reusable) {
             this.restart();
         }
-        if (!this.rootComposition.started) {
+        if (this.rootComposition.started) {
             this.gotoAndPlay(this.time - this.startTime);
         } else {
             this.gotoAndPlay(0);
@@ -24866,18 +24946,14 @@ var listOrder = 0;
    * 跳转合成到指定时间播放
    * @param time - 相对 startTime 的时间
    */ _proto.gotoAndPlay = function gotoAndPlay(time) {
+        this.setTime(time);
         this.resume();
-        if (!this.rootComposition.started) {
-            this.rootComposition.start();
-            this.rootComposition.started = true;
-        }
-        this.forwardTime(time + this.startTime);
     };
     /**
    * 跳转合成到指定时间并暂停
    * @param time - 相对 startTime 的时间
    */ _proto.gotoAndStop = function gotoAndStop(time) {
-        this.gotoAndPlay(time);
+        this.setTime(time);
         this.pause();
     };
     /**
@@ -24904,7 +24980,7 @@ var listOrder = 0;
             this.rootComposition.start();
             this.rootComposition.started = true;
         }
-        this.forwardTime(time + this.startTime, true);
+        this.forwardTime(time + this.startTime);
         if (pause) {
             this.pause();
         }
@@ -24917,17 +24993,16 @@ var listOrder = 0;
    * 前进合成到指定时间
    * @param time - 相对0时刻的时间
    * @param skipRender - 是否跳过渲染
-   */ _proto.forwardTime = function forwardTime(time, skipRender) {
-        if (skipRender === void 0) skipRender = false;
+   */ _proto.forwardTime = function forwardTime(time) {
         var deltaTime = time * 1000 - this.rootComposition.time * 1000;
         var reverse = deltaTime < 0;
         var step = 15;
         var t = Math.abs(deltaTime);
         var ss = reverse ? -step : step;
         for(t; t > step; t -= step){
-            this.update(ss, skipRender);
+            this.update(ss);
         }
-        this.update(reverse ? -t : t, skipRender);
+        this.update(reverse ? -t : t);
     };
     /**
    * 重置状态函数
@@ -24965,74 +25040,68 @@ var listOrder = 0;
         }
     };
     /**
-   * 是否合成需要重新播放
-   * @returns 重新播放合成标志位
-   */ _proto.shouldRestart = function shouldRestart() {
-        var _this_rootItem = this.rootItem, ended = _this_rootItem.ended, endBehavior = _this_rootItem.endBehavior;
-        return ended && endBehavior === EndBehavior.restart;
-    };
-    /**
-   * 是否合成需要销毁
-   * @returns 销毁合成标志位
-   */ _proto.shouldDispose = function shouldDispose() {
-        if (this.reusable) {
-            return false;
-        }
-        var _this_rootItem = this.rootItem, ended = _this_rootItem.ended, endBehavior = _this_rootItem.endBehavior;
-        // TODO: 合成结束行为
-        return ended && (!endBehavior || endBehavior === END_BEHAVIOR_PAUSE_AND_DESTROY);
-    };
-    /**
    * 合成更新，针对所有 item 的更新
    * @param deltaTime - 更新的时间步长
    * @param skipRender - 是否需要渲染
-   */ _proto.update = function update(deltaTime, skipRender) {
-        if (skipRender === void 0) skipRender = false;
+   */ _proto.update = function update(deltaTime) {
         if (!this.assigned || this.paused) {
             return;
         }
-        if (this.shouldRestart()) {
-            this.restart();
-        // restart then tick to avoid flicker
-        }
         var time = this.getUpdateTime(deltaTime * this.speed);
         this.globalTime += time;
-        if (this.rootComposition.isActiveAndEnabled) {
-            var localTime = this.toLocalTime(this.globalTime / 1000);
-            this.rootComposition.time = localTime;
-        }
+        this.updateRootComposition();
         this.updateVideo();
         // 更新 model-tree-plugin
         this.updatePluginLoaders(deltaTime);
+        // scene VFXItem components lifetime function.
         this.callStart(this.rootItem);
         this.callUpdate(this.rootItem, time);
         this.callLateUpdate(this.rootItem, time);
-        // this.extraCamera?.getComponent(TimelineComponent)?.update(deltaTime);
         this.updateCamera();
+        this.prepareRender();
         if (this.shouldDispose()) {
-            this.onEnd == null ? void 0 : this.onEnd.call(this, this);
             this.dispose();
-        } else {
-            if (!skipRender) {
-                this.prepareRender();
-            }
         }
     };
     _proto.toLocalTime = function toLocalTime(time) {
         var localTime = time - this.rootItem.start;
         var duration = this.rootItem.duration;
         if (localTime - duration > 0.001) {
-            if (this.rootItem.endBehavior === EndBehavior.restart) {
-                localTime = localTime % duration;
-            } else if (this.rootItem.endBehavior === EndBehavior.freeze) {
-                localTime = Math.min(duration, localTime);
+            if (!this.rootItem.ended) {
+                this.rootItem.ended = true;
+                this.emit("end", {
+                    composition: this
+                });
+            }
+            switch(this.rootItem.endBehavior){
+                case EndBehavior.restart:
+                    {
+                        localTime = localTime % duration;
+                        this.restart();
+                        break;
+                    }
+                case EndBehavior.freeze:
+                    {
+                        localTime = Math.min(duration, localTime);
+                        break;
+                    }
+                case EndBehavior.forward:
+                    {
+                        break;
+                    }
+                case EndBehavior.destroy:
+                    {
+                        break;
+                    }
             }
         }
         return localTime;
     };
+    _proto.shouldDispose = function shouldDispose() {
+        return this.rootItem.ended && this.rootItem.endBehavior === EndBehavior.destroy && !this.reusable;
+    };
     _proto.getUpdateTime = function getUpdateTime(t) {
         var startTimeInMs = this.startTime * 1000;
-        // const content = this.rootItem;
         var now = this.rootComposition.time * 1000;
         if (t < 0 && now + t < startTimeInMs) {
             return startTimeInMs - now;
@@ -25180,6 +25249,14 @@ var listOrder = 0;
         });
     };
     /**
+   * 更新主合成组件
+   */ _proto.updateRootComposition = function updateRootComposition() {
+        if (this.rootComposition.isActiveAndEnabled) {
+            var localTime = this.toLocalTime(this.globalTime / 1000);
+            this.rootComposition.time = localTime;
+        }
+    };
+    /**
    * 通过名称获取元素
    * @param name - 元素名称
    * @returns 元素对象
@@ -25228,12 +25305,17 @@ var listOrder = 0;
    * @param type - 交互类型
    */ _proto.addInteractiveItem = function addInteractiveItem(item, type) {
         if (type === InteractType.MESSAGE) {
-            this.onMessageItem == null ? void 0 : this.onMessageItem.call(this, {
+            this.handleItemMessage({
                 name: item.name,
                 phrase: MESSAGE_ITEM_PHRASE_BEGIN,
                 id: item.id,
                 compositionId: this.id
             });
+            item.emit("message", {
+                name: item.name,
+                phrase: MESSAGE_ITEM_PHRASE_BEGIN,
+                id: item.id
+            });
             return item.id;
         }
     };
@@ -25242,14 +25324,19 @@ var listOrder = 0;
    * @param item - 交互元素
    * @param type - 交互类型
    */ _proto.removeInteractiveItem = function removeInteractiveItem(item, type) {
-        // MESSAGE ITEM的结束行为
+        // MESSAGE ITEM 的结束行为
         if (type === InteractType.MESSAGE) {
-            this.onMessageItem == null ? void 0 : this.onMessageItem.call(this, {
+            this.handleItemMessage({
                 name: item.name,
                 phrase: MESSAGE_ITEM_PHRASE_END,
                 id: item.id,
                 compositionId: this.id
             });
+            item.emit("message", {
+                name: item.name,
+                phrase: MESSAGE_ITEM_PHRASE_END,
+                id: item.id
+            });
         }
     };
     /**
@@ -25343,9 +25430,10 @@ var listOrder = 0;
         (_this_rendererOptions = this.rendererOptions) == null ? void 0 : _this_rendererOptions.emptyTexture.dispose();
         (_this_pluginSystem = this.pluginSystem) == null ? void 0 : _this_pluginSystem.destroyComposition(this);
         this.update = function() {
-            logger.error("Update disposed composition: " + _this.name + ".");
+            {
+                logger.error("Update disposed composition: " + _this.name + ".");
+            }
         };
-        this.onPlayerPause = noop;
         this.dispose = noop;
         if (textures && this.keepResource) {
             textures.forEach(function(tex) {
@@ -25543,7 +25631,7 @@ var listOrder = 0;
         }
     ]);
     return Composition;
-}();
+}(EventEmitter);
 
 var SIZEOF_SHORT = 2;
 var SIZEOF_INT = 4;
@@ -27507,7 +27595,7 @@ registerPlugin("sprite", SpriteLoader, exports.VFXItem, true);
 registerPlugin("particle", ParticleLoader, exports.VFXItem, true);
 registerPlugin("cal", CalculateLoader, exports.VFXItem, true);
 registerPlugin("interact", InteractLoader, exports.VFXItem, true);
-var version$1 = "2.0.0-alpha.31";
+var version$1 = "2.0.0-alpha.33";
 logger.info("Core version: " + version$1 + ".");
 
 var _obj;
@@ -27581,6 +27669,13 @@ var _obj3;
    */ _this.uniforms = {};
         var shader = props == null ? void 0 : props.shader;
         var level = engine.gpuCapability.level;
+        _this.shader = new exports.Shader(engine);
+        _this.shader.shaderData = _extends({}, shader, {
+            id: generateGUID(),
+            dataType: DataType.Shader,
+            vertex: (shader == null ? void 0 : shader.vertex) || "",
+            fragment: (shader == null ? void 0 : shader.fragment) || ""
+        });
         for(var i = 0; i < exports.maxSpriteMeshItemCount; i++){
             _this.uniforms["uSampler" + i] = new THREE__namespace.Uniform(null);
         }
@@ -28761,6 +28856,8 @@ var ThreeRenderer = /*#__PURE__*/ function(Renderer) {
         var _this;
         _this = Renderer.call(this) || this;
         _this.engine = new ThreeEngine(gl);
+        _this.engine.renderer = _assert_this_initialized(_this);
+        _this.env = "";
         _this.renderingData = {
             //@ts-expect-error
             currentFrame: {}
@@ -28788,8 +28885,8 @@ var ThreeRenderer = /*#__PURE__*/ function(Renderer) {
         var _this;
         _this = _THREE_Group.call(this) || this;
         _this.compositions = [];
-        _this.baseCompositionIndex = 0;
         _this.env = "";
+        _this.baseCompositionIndex = 0;
         var width = options.width, height = options.height, camera = options.camera;
         _this.renderer = new ThreeRenderer(context);
         _this.width = width;
@@ -28858,6 +28955,19 @@ var ThreeRenderer = /*#__PURE__*/ function(Renderer) {
             });
         })();
     };
+    _proto.pause = function pause() {
+        this.dispatchEvent({
+            type: "pause"
+        });
+        this.compositions.forEach(function(composition) {
+            composition.pause();
+        });
+    };
+    _proto.resume = function resume() {
+        this.compositions.forEach(function(composition) {
+            composition.resume();
+        });
+    };
     _proto.createComposition = function createComposition(url, options) {
         if (options === void 0) options = {};
         var _this = this;
@@ -28914,8 +29024,20 @@ var ThreeRenderer = /*#__PURE__*/ function(Renderer) {
                         composition = new ThreeComposition(_extends({}, opts, {
                             width: _this.width,
                             height: _this.height,
-                            renderer: _this.renderer
+                            renderer: _this.renderer,
+                            handleItemMessage: function(message) {
+                                _this.dispatchEvent({
+                                    type: "message",
+                                    message: message
+                                });
+                            }
                         }), scene);
+                        composition.on("end", function() {
+                            _this.dispatchEvent({
+                                type: "end",
+                                composition: composition
+                            });
+                        });
                         _this.renderer.engine.setOptions({
                             threeCamera: _this.camera,
                             threeGroup: _this,
@@ -29140,7 +29262,7 @@ setMaxSpriteMeshItemCount(8);
  */ Mesh.create = function(engine, props) {
     return new ThreeMesh(engine, props);
 };
-var version = "2.0.0-alpha.31";
+var version = "2.0.0-alpha.33";
 logger.info("THREEJS plugin version: " + version + ".");
 
 exports.AbstractPlugin = AbstractPlugin;
@@ -29178,6 +29300,7 @@ exports.EVENT_TYPE_TOUCH_START = EVENT_TYPE_TOUCH_START;
 exports.EffectsObject = EffectsObject;
 exports.EffectsPackage = EffectsPackage;
 exports.Engine = Engine;
+exports.EventEmitter = EventEmitter;
 exports.EventSystem = EventSystem;
 exports.Float16ArrayWrapper = Float16ArrayWrapper;
 exports.Framebuffer = Framebuffer;