@galacean/effects-threejs 0.0.1-alpha.0 → 0.0.1-alpha.1

package/dist/index.mjs

@@ -3,7 +3,7 @@
  * Description: Galacean Effects runtime threejs plugin for the web
  * Author: Ant Group CO., Ltd.
  * Contributors: 燃然,飂兮,十弦,云垣,茂安,意绮
- * Version: v0.0.1-alpha.0
+ * Version: v0.0.1-alpha.1
  */
 
 import * as THREE from 'three';
@@ -6665,7 +6665,7 @@ function asserts(condition, msg) {
  * Name: @galacean/effects-specification
  * Description: Galacean Effects JSON Specification
  * Author: Ant Group CO., Ltd.
- * Version: v0.0.1
+ * Version: v0.0.2
  */
 
 /*********************************************/
@@ -7138,7 +7138,7 @@ var ItemEndBehavior$1;
 (function (ItemEndBehavior) {
     ItemEndBehavior[ItemEndBehavior["destroy"] = END_BEHAVIOR_DESTROY$1] = "destroy";
     ItemEndBehavior[ItemEndBehavior["loop"] = END_BEHAVIOR_RESTART$1] = "loop";
-    ItemEndBehavior[ItemEndBehavior["forward"] = END_BEHAVIOR_FREEZE$1] = "forward";
+    ItemEndBehavior[ItemEndBehavior["freeze"] = END_BEHAVIOR_FREEZE$1] = "freeze";
 })(ItemEndBehavior$1 || (ItemEndBehavior$1 = {}));
 var ParentItemEndBehavior$1;
 (function (ParentItemEndBehavior) {
@@ -9738,12 +9738,11 @@ var VFXItem = /** @class */ (function () {
          */
         this._frozen = false;
         var id = props.id, name = props.name, delay = props.delay, parentId = props.parentId, endBehavior = props.endBehavior, transform = props.transform, _a = props.listIndex, listIndex = _a === void 0 ? 0 : _a, _b = props.duration, duration = _b === void 0 ? 0 : _b;
-        var rootTransform = composition.rootTransform;
         this.composition = composition;
         this.id = id;
         this.name = name;
         this.delay = delay;
-        this.transform = new Transform(__assign$1({ name: this.name }, transform), rootTransform);
+        this.transform = new Transform(__assign$1({ name: this.name }, transform), composition.transform);
         this.parentId = parentId;
         this.duration = duration;
         this.delayInms = (delay || 0) * 1000;
@@ -9990,6 +9989,10 @@ var VFXItem = /** @class */ (function () {
     VFXItem.prototype.onEnd = function () {
         // OVERRIDE
     };
+    VFXItem.prototype.setColor = function (r, g, b, a) {
+    };
+    VFXItem.prototype.setOpacity = function (opacity) {
+    };
     /**
      * 获取元素显隐属性
      */
@@ -10041,6 +10044,50 @@ var VFXItem = /** @class */ (function () {
     VFXItem.prototype.getNodeTransform = function (itemId) {
         return this.transform;
     };
+    /**
+     * 设置元素在 3D 坐标轴上相对移动
+     */
+    VFXItem.prototype.translate = function (x, y, z) {
+        this.transform.translate(x, y, z);
+    };
+    /**
+     * 设置元素在 3D 坐标轴上相对旋转（角度）
+     */
+    VFXItem.prototype.rotate = function (x, y, z) {
+        var q = [0, 0, 0, 1];
+        quatFromRotation(q, x, y, z);
+        quatStar(q, q);
+        this.transform.rotateByQuat(q);
+    };
+    /**
+     * 设置元素在 3D 坐标轴上相对缩放
+     */
+    VFXItem.prototype.scale = function (x, y, z) {
+        this.transform.scaleBy(x, y, z);
+    };
+    /**
+     * 元素的在画布上的像素位置
+     */
+    VFXItem.prototype.setPositionByPixel = function (x, y) {
+    };
+    /**
+     * 设置元素在 3D 坐标轴的位置
+     */
+    VFXItem.prototype.setPosition = function (x, y, z) {
+        this.transform.setPosition(x, y, z);
+    };
+    /**
+     * 设置元素在 3D 坐标轴的角度
+     */
+    VFXItem.prototype.setRotation = function (x, y, z) {
+        this.transform.setRotation(x, y, z);
+    };
+    /**
+     * 设置元素在 3D 坐标轴的缩放
+     */
+    VFXItem.prototype.setScale = function (x, y, z) {
+        this.transform.setScale(x, y, z);
+    };
     /**
      * 获取元素包围盒
      * @override
@@ -10095,6 +10142,13 @@ var VFXItem = /** @class */ (function () {
         }
         this.started = false;
     };
+    VFXItem.prototype.translateByPixel = function (x, y) {
+        if (this.composition) {
+            var camera = this.composition.camera;
+            camera.getViewProjectionMatrix();
+            camera.getInverseViewProjectionMatrix();
+        }
+    };
     /**
      * 销毁元素
      */
@@ -11154,6 +11208,21 @@ function generateHalfFloatTexture(engine, data, width, height) {
     });
 }
 
+var RUNTIME_ENV = 'runtime_env';
+var LOG_TYPE = 'mars';
+var RENDER_PREFER_LOOKUP_TEXTURE = 'lookup_texture';
+// 数据模板使用 offscreen canvas 绘制
+var TEMPLATE_USE_OFFSCREEN_CANVAS = 'offscreen_canvas';
+// 后处理配置相关
+var POST_PROCESS_SETTINGS = 'post_process_settings';
+var config = {};
+function getConfig(name) {
+    return config[name];
+}
+function setConfig(name, value) {
+    return config[name] = value;
+}
+
 var HEADER_LEN = 12 + 13 * 4; // identifier + header elements (not including key value meta-data pairs)
 var COMPRESSED_2D = 0; // uses a gl.compressedTexImage2D()
 //const COMPRESSED_3D = 1; // uses a gl.compressedTexImage3D()
@@ -11202,15 +11271,24 @@ var KTXTexture = /** @class */ (function () {
         // value of zero is an indication to generate mipmaps @ runtime.  Not usually allowed for compressed, so disregard.
         this.numberOfMipmapLevels = Math.max(1, this.numberOfMipmapLevels);
         if (this.pixelHeight === 0 || this.pixelDepth !== 0) {
-            console.warn('only 2D textures currently supported');
+            console.warn({
+                content: 'only 2D textures currently supported',
+                type: LOG_TYPE,
+            });
             return;
         }
         if (this.numberOfArrayElements !== 0) {
-            console.warn('texture arrays not currently supported');
+            console.warn({
+                content: 'texture arrays not currently supported',
+                type: LOG_TYPE,
+            });
             return;
         }
         if (this.numberOfFaces !== facesExpected) {
-            console.warn('number of faces expected' + facesExpected + ', but found ' + this.numberOfFaces);
+            console.warn({
+                content: 'number of faces expected' + facesExpected + ', but found ' + this.numberOfFaces,
+                type: LOG_TYPE,
+            });
             return;
         }
         // we now have a completely validated file, so could use existence of loadType as success
@@ -11897,20 +11975,6 @@ function generateEmptyTypedArray(type) {
     return new Float32Array(0);
 }
 
-var RUNTIME_ENV = 'runtime_env';
-var RENDER_PREFER_LOOKUP_TEXTURE = 'lookup_texture';
-// 数据模板使用 offscreen canvas 绘制
-var TEMPLATE_USE_OFFSCREEN_CANVAS = 'offscreen_canvas';
-// 后处理配置相关
-var POST_PROCESS_SETTINGS = 'post_process_settings';
-var config = {};
-function getConfig(name) {
-    return config[name];
-}
-function setConfig(name, value) {
-    return config[name] = value;
-}
-
 var seed$8 = 1;
 /**
  * Mesh 抽象类
@@ -15633,6 +15697,12 @@ var SpriteItem = /** @class */ (function (_super) {
         }
         return ret;
     };
+    SpriteItem.prototype.setColor = function (r, g, b, a) {
+        this.options.startColor = [r, g, b, a];
+    };
+    SpriteItem.prototype.setOpacity = function (opacity) {
+        this.options.startColor[3] = opacity;
+    };
     SpriteItem.prototype.getRenderData = function (_time, init) {
         var ret = _super.prototype.getRenderData.call(this, _time, init);
         var colorInc = vecFill(tempColor, 1);
@@ -15756,6 +15826,12 @@ var SpriteVFXItem = /** @class */ (function (_super) {
         this.transform.assignWorldTRS(pos);
         return pos;
     };
+    SpriteVFXItem.prototype.setColor = function (r, g, b, a) {
+        this.content.setColor(r, g, b, a);
+    };
+    SpriteVFXItem.prototype.setOpacity = function (opacity) {
+        this.content.setOpacity(opacity);
+    };
     /**
      * 获取图层包围盒的类型和世界坐标
      * @returns
@@ -18438,6 +18514,22 @@ var ParticleSystem = /** @class */ (function () {
             this.trailMesh.mesh.setVisible(visible);
         }
     };
+    ParticleSystem.prototype.setOpacity = function (opacity) {
+        var material = this.particleMesh.mesh.material;
+        material.setVector4('uOpacityOverLifetimeValue', [1, 1, 1, opacity]);
+    };
+    ParticleSystem.prototype.setColor = function (r, g, b, a) {
+        var material = this.particleMesh.mesh.material;
+        var geometry = this.particleMesh.mesh.geometry;
+        var data = geometry.getAttributeData('aRot') || [];
+        for (var i = 0; i < data.length; i += 4) {
+            data[0] = r;
+            data[1] = g;
+            data[2] = b;
+            data[3] = a;
+        }
+        material.setVector4('uOpacityOverLifetimeValue', [r, g, b, a]);
+    };
     ParticleSystem.prototype.setParentTransform = function (transform) {
         this.parentTransform = transform;
     };
@@ -18988,6 +19080,12 @@ var ParticleVFXItem = /** @class */ (function (_super) {
             content.meshes.forEach(function (mesh) { return mesh.dispose({ material: { textures: DestroyOptions.keep } }); });
         }
     };
+    ParticleVFXItem.prototype.setColor = function (r, g, b, a) {
+        this.content.setColor(r, g, b, a);
+    };
+    ParticleVFXItem.prototype.setOpacity = function (opacity) {
+        this.content.setOpacity(opacity);
+    };
     ParticleVFXItem.prototype.stopParticleEmission = function () {
         if (this.content) {
             this.content.emissionStopped = true;
@@ -20879,11 +20977,12 @@ var TextItem = /** @class */ (function (_super) {
         var layout = this.textLayout;
         var fontScale = style.fontScale;
         var width = (layout.width + style.fontOffset) * fontScale;
+        var height = layout.height * fontScale;
         var fontSize = style.fontSize * fontScale;
         var lineHeight = layout.lineHeight * fontScale;
         this.char = this.text.split('');
         this.canvas.width = width;
-        this.canvas.height = layout.height * fontScale;
+        this.canvas.height = height;
         context.clearRect(0, 0, width, this.canvas.height);
         // fix bug 1/255
         context.fillStyle = 'rgba(255, 255, 255, 0.0039)';
@@ -20948,12 +21047,16 @@ var TextItem = /** @class */ (function (_super) {
         }
         //与 toDataURL() 两种方式都需要像素读取操作
         var imageData = context.getImageData(0, 0, this.canvas.width, this.canvas.height);
-        (_a = this.mesh) === null || _a === void 0 ? void 0 : _a.mesh.material.setTexture('uSampler0', Texture.createWithData(this.engine, imageData, {
+        (_a = this.mesh) === null || _a === void 0 ? void 0 : _a.mesh.material.setTexture('uSampler0', Texture.createWithData(this.engine, {
+            data: new Uint8Array(imageData.data),
+            width: imageData.width,
+            height: imageData.height,
+        }, {
             flipY: true,
             magFilter: glContext.LINEAR,
             minFilter: glContext.LINEAR,
-            wrapS: glContext.REPEAT,
-            wrapT: glContext.REPEAT,
+            wrapS: glContext.CLAMP_TO_EDGE,
+            wrapT: glContext.CLAMP_TO_EDGE,
         }));
         this.isDirty = false;
     };
@@ -21097,7 +21200,7 @@ var TextLoader = /** @class */ (function (_super) {
         return _this;
     }
     TextLoader.prototype.onCompositionDestroyed = function (composition) {
-        if (composition.reusable || composition.keepResource) {
+        if (composition.reusable) {
             this.addItems.forEach(function (vfxitem) {
                 var _a;
                 (_a = vfxitem.content.mesh) === null || _a === void 0 ? void 0 : _a.mesh.dispose({ material: { textures: DestroyOptions.keep } });
@@ -22051,6 +22154,15 @@ var Camera = /** @class */ (function () {
     Camera.prototype.getModelViewProjection = function (out, model) {
         return mat4multiply(out, this.viewProjectionMatrix, model);
     };
+    /**
+     * 获取归一化坐标和 3D 世界坐标的换算比例
+     */
+    Camera.prototype.getInverseVPRatio = function () {
+        var pos = [0, 0, 0];
+        var nz = vec3MulMat4(pos, [0, 0, 0], this.getViewProjectionMatrix())[2];
+        vec3MulMat4(pos, [1, 1, nz], this.getInverseViewProjectionMatrix());
+        return [pos[0], pos[1]];
+    };
     /**
      * 设置相机的旋转四元数
      * @param value - 旋转四元数
@@ -22241,7 +22353,7 @@ var filters = {
  * Name: @galacean/effects-specification
  * Description: Galacean Effects JSON Specification
  * Author: Ant Group CO., Ltd.
- * Version: v0.0.1
+ * Version: v0.0.2
  */
 
 /*********************************************/
@@ -22712,7 +22824,7 @@ var ItemEndBehavior;
 (function (ItemEndBehavior) {
     ItemEndBehavior[ItemEndBehavior["destroy"] = END_BEHAVIOR_DESTROY] = "destroy";
     ItemEndBehavior[ItemEndBehavior["loop"] = END_BEHAVIOR_RESTART] = "loop";
-    ItemEndBehavior[ItemEndBehavior["forward"] = END_BEHAVIOR_FREEZE] = "forward";
+    ItemEndBehavior[ItemEndBehavior["freeze"] = END_BEHAVIOR_FREEZE] = "freeze";
 })(ItemEndBehavior || (ItemEndBehavior = {}));
 var ParentItemEndBehavior;
 (function (ParentItemEndBehavior) {
@@ -23580,7 +23692,7 @@ function version21Migration(json) {
         composition.items.forEach(function (item) {
             if (item.type === ItemType.null) {
                 if (item.endBehavior === ItemEndBehavior.destroy) {
-                    item.endBehavior = ItemEndBehavior.forward;
+                    item.endBehavior = ItemEndBehavior.freeze;
                 }
             }
         });
@@ -23588,6 +23700,24 @@ function version21Migration(json) {
     json.version = '2.1';
     return json;
 }
+/**
+ * 2.2 以下版本数据适配（mars-player@2.5.0 及以上版本支持 2.2 以下数据的适配）
+ */
+function version22Migration(json) {
+    var _a;
+    var singleVersion = (_a = json.version) === null || _a === void 0 ? void 0 : _a.split('.');
+    if (!singleVersion || Number(singleVersion[0]) > 2 || (Number(singleVersion[0]) === 2 && Number(singleVersion[1]) >= 2)) {
+        return json;
+    }
+    json.compositions.forEach(function (composition) {
+        composition.items.forEach(function (item) {
+            if (item.type === ItemType.mesh || item.type === ItemType.light) {
+                item.endBehavior = item.endBehavior === 1 ? ItemEndBehavior.destroy : item.endBehavior;
+            }
+        });
+    });
+    return json;
+}
 
 var v0 = /^(\d+)\.(\d+)\.(\d+)(-(\w+)\.\d+)?$/;
 var standardVersion = /^(\d+)\.(\d+)$/;
@@ -23597,6 +23727,8 @@ function getStandardJSON(json) {
     if (!json || typeof json !== 'object') {
         throw Error('expect a json object');
     }
+    // 修正老版本数据中，meshItem以及lightItem结束行为错误问题
+    version22Migration(json);
     if (v0.test(json.version)) {
         reverseParticle = ((_a = (/^(\d+)/).exec(json.version)) === null || _a === void 0 ? void 0 : _a[0]) === '0';
         return version21Migration(getStandardJSONFromV0(json));
@@ -24195,7 +24327,10 @@ var AssetManager = /** @class */ (function () {
                                 // 触发插件系统 pluginSystem 的回调 prepareResource
                                 _d.sent();
                                 totalTime = performance.now() - startTime;
-                                console.debug("".concat(timeLabel, ": ").concat(totalTime.toFixed(4), "ms, ").concat(timeInfos.join(' ')));
+                                console.info({
+                                    content: "".concat(timeLabel, ": ").concat(totalTime.toFixed(4), "ms, ").concat(timeInfos.join(' ')),
+                                    type: LOG_TYPE,
+                                });
                                 window.clearTimeout(loadTimer);
                                 scene.totalTime = totalTime;
                                 scene.startTime = startTime;
@@ -24319,7 +24454,10 @@ var AssetManager = /** @class */ (function () {
                                 return [3 /*break*/, 4];
                             case 3:
                                 _b.sent();
-                                console.warn("Invalid fonts source: ".concat(font.fontURL));
+                                console.warn({
+                                    content: "Invalid fonts source: ".concat(font.fontURL),
+                                    type: LOG_TYPE,
+                                });
                                 return [3 /*break*/, 4];
                             case 4: return [2 /*return*/];
                         }
@@ -24726,6 +24864,9 @@ var CompVFXItem = /** @class */ (function (_super) {
         this.tempQueue.length = 0;
         this.itemsToRemove.length = 0;
     };
+    CompVFXItem.prototype.handleVisibleChanged = function (visible) {
+        this.items.forEach(function (item) { return item.setVisible(visible); });
+    };
     CompVFXItem.prototype.getUpdateTime = function (t) {
         var startTime = this.startTimeInms;
         var now = this.timeInms;
@@ -24793,6 +24934,7 @@ var CompVFXItem = /** @class */ (function (_super) {
     };
     /**
      * 获取指定元素当前时刻真正起作用的父元素, 需要在元素生命周期内获取
+     * @internal
      * @param item - 指定元素
      * @return 当父元素生命周期结束时，返回空
      */
@@ -24903,17 +25045,22 @@ var Composition = /** @class */ (function () {
         this.paused = false;
         this.lastVideoUpdateTime = 0;
         this.postLoaders = [];
-        var keepResource = props.keepResource, _b = props.reusable, reusable = _b === void 0 ? false : _b, _c = props.baseRenderOrder, baseRenderOrder = _c === void 0 ? 0 : _c, renderer = props.renderer, handlePlayerPause = props.handlePlayerPause, handleMessageItem = props.handleMessageItem, handleEnd = props.handleEnd, event = props.event, width = props.width, height = props.height;
+        var _b = props.reusable, reusable = _b === void 0 ? false : _b, _c = props.speed, speed = _c === void 0 ? 1 : _c, _d = props.baseRenderOrder, baseRenderOrder = _d === void 0 ? 0 : _d, renderer = props.renderer, handlePlayerPause = props.handlePlayerPause, handleMessageItem = props.handleMessageItem, handleEnd = props.handleEnd, event = props.event, width = props.width, height = props.height;
         this.compositionSourceManager = new CompositionSourceManager(scene, renderer.engine);
         scene.jsonScene.imgUsage = undefined;
-        if (!keepResource) {
+        if (reusable) {
+            this.keepResource = true;
             scene.textures = undefined;
             scene.consumed = true;
         }
-        var _d = this.compositionSourceManager, sourceContent = _d.sourceContent, pluginSystem = _d.pluginSystem, imgUsage = _d.imgUsage, totalTime = _d.totalTime, renderLevel = _d.renderLevel;
+        var _e = this.compositionSourceManager, sourceContent = _e.sourceContent, pluginSystem = _e.pluginSystem, imgUsage = _e.imgUsage, totalTime = _e.totalTime, renderLevel = _e.renderLevel;
         assertExist(sourceContent);
         var vfxItem = new CompVFXItem(sourceContent, this);
         var imageUsage = (!reusable && imgUsage);
+        this.transform = new Transform({
+            name: this.name,
+        });
+        vfxItem.transform = this.transform;
         this.globalVolume = sourceContent.globalVolume;
         this.width = width;
         this.height = height;
@@ -24924,21 +25071,19 @@ var Composition = /** @class */ (function () {
         this.event = event;
         this.statistic = { loadTime: totalTime !== null && totalTime !== void 0 ? totalTime : 0, loadStart: (_a = scene.startTime) !== null && _a !== void 0 ? _a : 0, firstFrameTime: 0 };
         this.reusable = reusable;
+        this.speed = speed;
         this.renderLevel = renderLevel;
-        this.handlePlayerPause = handlePlayerPause;
-        this.handleMessageItem = handleMessageItem;
-        this.handleEnd = handleEnd;
-        this.rootTransform = new Transform();
-        vfxItem.transform = this.rootTransform;
-        this.autoRefTex = !keepResource && imageUsage && vfxItem.endBehavior !== END_BEHAVIOR_RESTART$1;
+        this.autoRefTex = !this.keepResource && imageUsage && vfxItem.endBehavior !== END_BEHAVIOR_RESTART$1;
         this.content = vfxItem;
         this.name = vfxItem.name;
-        this.rootTransform.name = this.name;
         this.pluginSystem = pluginSystem;
         this.pluginSystem.initializeComposition(this, scene);
         this.camera = new Camera(this.name, __assign$1(__assign$1({}, sourceContent === null || sourceContent === void 0 ? void 0 : sourceContent.camera), { aspect: width / height }));
         this.url = scene.url;
         this.assigned = true;
+        this.handlePlayerPause = handlePlayerPause;
+        this.handleMessageItem = handleMessageItem;
+        this.handleEnd = handleEnd;
         this.createRenderFrame();
         this.reset();
     }
@@ -25000,7 +25145,7 @@ var Composition = /** @class */ (function () {
         this.content.reset();
         this.prepareRender();
         this.reset();
-        this.rootTransform.setValid(true);
+        this.transform.setValid(true);
         this.content.start();
         this.forwardTime(this.startTime);
         this.content.onUpdate(0);
@@ -25021,10 +25166,10 @@ var Composition = /** @class */ (function () {
         return this.renderOrder;
     };
     Composition.prototype.play = function () {
-        if (this.paused) {
-            this.resume();
+        if (this.content.ended && this.reusable) {
+            this.restart();
         }
-        this.content.start();
+        this.gotoAndPlay(this.time);
     };
     /**
      * 暂停合成的播放
@@ -25039,12 +25184,16 @@ var Composition = /** @class */ (function () {
         this.paused = false;
     };
     Composition.prototype.gotoAndPlay = function (time) {
+        this.resume();
+        if (!this.content.started) {
+            this.content.start();
+            this.forwardTime(this.startTime);
+        }
+        this.forwardTime(time);
     };
-    Composition.prototype.gotoAndPause = function (time) {
-    };
-    // TODO: 待废弃
-    Composition.prototype.start = function () {
-        this.content.start();
+    Composition.prototype.gotoAndStop = function (time) {
+        this.gotoAndPlay(time);
+        this.pause();
     };
     /**
      *
@@ -25061,29 +25210,29 @@ var Composition = /** @class */ (function () {
     };
     /**
      * 跳到指定时间点（不做任何播放行为）
-     *
-     * @param time - 时间点（秒），可正可负
+     * @param time - 指定的时间
      */
     Composition.prototype.setTime = function (time) {
+        var pause = this.paused;
+        if (pause) {
+            this.resume();
+        }
+        this.forwardTime(time, true);
+        if (pause) {
+            this.pause();
+        }
     };
-    /**
-     * 快进/快退指定时间间隔
-     * @param timeInSeconds - 需要快进/快退的时间长度（秒），可正可负
-     */
-    Composition.prototype.forwardTime = function (timeInSeconds) {
-        var time = Math.round(timeInSeconds * 1000);
-        if (time) {
-            var reverse = time < 0;
-            var step = 15;
-            var t = Math.abs(time);
-            for (var ss = reverse ? -step : step; t > step; t -= step) {
-                this.update(ss);
-            }
-            if (t > 0) {
-                var ss = reverse ? -t : t;
-                this.update(ss);
-            }
+    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 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(reverse ? -t : t, skipRender);
     };
     /**
      * 重置状态函数
@@ -25125,14 +25274,19 @@ var Composition = /** @class */ (function () {
      * @returns 销毁合成标志位
      */
     Composition.prototype.shouldDispose = function () {
+        if (this.reusable) {
+            return false;
+        }
         var _a = this.content, ended = _a.ended, endBehavior = _a.endBehavior;
         return ended && (!endBehavior || endBehavior === END_BEHAVIOR_PAUSE_AND_DESTROY$1);
     };
     /**
      * 合成更新，针对所有 item 的更新
      * @param deltaTime - 更新的时间步长
+     * @param skipRender - 是否需要渲染
      */
-    Composition.prototype.update = function (deltaTime) {
+    Composition.prototype.update = function (deltaTime, skipRender) {
+        if (skipRender === void 0) { skipRender = false; }
         if (!this.assigned || this.paused) {
             return;
         }
@@ -25149,7 +25303,9 @@ var Composition = /** @class */ (function () {
             this.dispose();
         }
         else {
-            this.prepareRender();
+            if (!skipRender) {
+                this.prepareRender();
+            }
         }
     };
     /**
@@ -25437,7 +25593,10 @@ var Composition = /** @class */ (function () {
         (_a = this.rendererOptions) === null || _a === void 0 ? void 0 : _a.emptyTexture.dispose();
         (_b = this.pluginSystem) === null || _b === void 0 ? void 0 : _b.destroyComposition(this);
         this.update = function () {
-            console.error("Update disposed composition: ".concat(_this.name, "."));
+            console.error({
+                content: "Update disposed composition: ".concat(_this.name, "."),
+                type: LOG_TYPE,
+            });
         };
         this.handlePlayerPause = noop;
         this.dispose = noop;
@@ -25456,6 +25615,37 @@ var Composition = /** @class */ (function () {
     Composition.prototype.setEditorTransform = function (scale, dx, dy) {
         this.renderFrame.editorTransform = [scale, scale, dx, dy];
     };
+    /**
+     * 合成整体在水平方向移动 x 像素，垂直方向移动 y 像素
+     */
+    Composition.prototype.translateByPixel = function (x, y) {
+        if (!this.renderer) {
+            console.warn('Can not translate position when container not assigned');
+            return;
+        }
+        var _a = __read$1(this.camera.getInverseVPRatio(), 2), rx = _a[0], ry = _a[1];
+        var width = this.renderer.getWidth();
+        var height = this.renderer.getHeight();
+        this.content.translate(2 * x * rx / width, -2 * y * ry / height, 0);
+    };
+    /**
+     * 设置合成在 3D 坐标轴上相对移动
+     */
+    Composition.prototype.translate = function (x, y, z) {
+        this.content.translate(x, y, z);
+    };
+    /**
+     * 设置合成在 3D 坐标轴上相对旋转（角度）
+     */
+    Composition.prototype.rotate = function (x, y, z) {
+        this.content.rotate(x, y, z);
+    };
+    /**
+     * 设置合成在 3D 坐标轴上相对缩放
+     */
+    Composition.prototype.scale = function (x, y, z) {
+        this.content.scale(x, y, z);
+    };
     /**
      * 卸载贴图纹理方法，减少内存
      */
@@ -25495,14 +25685,6 @@ var Composition = /** @class */ (function () {
     };
     return Composition;
 }());
-/**
- * 根据 id 查找对应的合成，可能找不到
- * @param compositions - 合成列表
- * @param id - 目标合成 id
- */
-function getComposition(compositions, id) {
-    return compositions.find(function (f) { return f.id === id; });
-}
 
 /**
  * Engine 基类，负责维护所有 GPU 资源的销毁
@@ -25608,7 +25790,10 @@ var Engine = /** @class */ (function () {
             info.push("Tex ".concat(this.textures.length));
         }
         if (info.length > 0) {
-            console.warn("Release GPU memory: ".concat(info.join(', ')));
+            console.warn({
+                content: "Release GPU memory: ".concat(info.join(', ')),
+                type: LOG_TYPE,
+            });
         }
         this.renderPasses.forEach(function (pass) {
             pass.dispose();
@@ -27249,8 +27434,11 @@ Geometry.create = function (engine, options) {
 Mesh.create = function (engine, props) {
     return new ThreeMesh(engine, props);
 };
-var version = "0.0.1-alpha.0";
-console.info('[Galacean Effects THREEJS] version: ' + "0.0.1-alpha.0");
+var version = "0.0.1-alpha.1";
+console.info({
+    content: '[Galacean Effects THREEJS] version: ' + "0.0.1-alpha.1",
+    type: LOG_TYPE,
+});
 
-export { AbstractPlugin, AssetManager, BYTES_TYPE_MAP, BezierSegments, COMPRESSED_TEXTURE, CONSTANT_MAP_BLEND, CONSTANT_MAP_DEPTH, CONSTANT_MAP_STENCIL_FUNC, CONSTANT_MAP_STENCIL_OP, COPY_FRAGMENT_SHADER, COPY_MESH_SHADER_ID, COPY_VERTEX_SHADER, CalculateItem, CalculateLoader, CalculateVFXItem, Camera, CameraController, CameraVFXItem, CameraVFXItemLoader, Composition, CompositionSourceManager, CurveValue, DEFAULT_FONTS, DEG2RAD, DestroyOptions, Downloader, EFFECTS_COPY_MESH_NAME, EVENT_TYPE_CLICK, EVENT_TYPE_TOUCH_END, EVENT_TYPE_TOUCH_MOVE, EVENT_TYPE_TOUCH_START, Engine, EventSystem, FILTER_NAME_NONE, FilterMode, FilterSpriteVFXItem, Float16ArrayWrapper, FrameBuffer, GLSLVersion, GPUCapability, Geometry, GlobalUniforms, GradientValue, HELP_LINK, HitTestType, InteractBehavior$1 as InteractBehavior, InteractItem, InteractLoader, InteractMesh, InteractVFXItem, KTXTexture, LineSegments, LinearValue, Material, MaterialDataBlock, MaterialRenderType, Mesh, NumberEpsilon, OrderType, PLAYER_OPTIONS_ENV_EDITOR, POST_PROCESS_SETTINGS, ParticleLoader, ParticleMesh, ParticleSystem, ParticleVFXItem, PassTextureCache, PathSegments, PluginSystem, QCanvasViewer, QText, QTextWrapMode, RENDER_PASS_NAME_PREFIX, RENDER_PREFER_LOOKUP_TEXTURE, RUNTIME_ENV, RandomSetValue, RandomValue, RandomVectorValue, RenderBuffer, RenderFrame, RenderPass, RenderPassAttachmentStorageType, RenderPassDestroyAttachmentType, RenderPassPriorityNormal, RenderPassPriorityPostprocess, RenderPassPriorityPrepare, RenderTargetHandle, RenderTextureFormat, Renderer, SEMANTIC_MAIN_PRE_COLOR_ATTACHMENT_0, SEMANTIC_MAIN_PRE_COLOR_ATTACHMENT_SIZE_0, SEMANTIC_PRE_COLOR_ATTACHMENT_0, SEMANTIC_PRE_COLOR_ATTACHMENT_SIZE_0, SPRITE_VERTEX_STRIDE, SemanticMap, Shader, ShaderCompileResultStatus, ShaderType, SpriteItem, SpriteLoader, SpriteMesh, SpriteVFXItem, StaticValue, TEMPLATE_USE_OFFSCREEN_CANVAS, TEXTURE_UNIFORM_MAP, TextItem, TextLoader, TextMesh, TextVFXItem, Texture, TextureFactory, TextureLoadAction, TextureSourceType, TextureStoreAction, ThreeComposition, ThreeDisplayObject, ThreeMaterial, ThreeTexture, Ticker, TimelineComponent, Transform, VFXItem, VFX_ITEM_TYPE_TREE, ValueGetter, addByOrder, addItem, addItemWithOrder, alphaFrameFrag, alphaMaskFrag, assertExist, asserts, blend, bloomMixVert, bloomThresholdVert, calculateTranslation, cameraMove_frag as cameraMoveFrag, cameraMoveVert, canvasPool, clamp$1 as clamp, colorGradingFrag, colorStopsFromGradient, colorToArr$1 as colorToArr, combineImageTemplate, combineImageTemplate1, combineImageTemplate1Async, combineImageTemplate2, combineImageTemplate2Async, combineImageTemplateAsync, compatible_frag as compatibleFrag, compatible_vert as compatibleVert, convertAnchor, copyFrag, createCopyShader, createFilter, createFilterShaders, createGLContext, createKeyFrameMeta, createShaderWithMarcos, createShape, createVFXItem, createValueGetter, deepClone, defaultGlobalVolume, defaultPlugins, delayFrag, deserializeMipmapTexture, distortionFrag, distortionVert, dotInTriangle, earcut, enlargeBuffer, ensureVec3, filters, findPreviousRenderPass, gaussianDown_frag as gaussianDownFrag, gaussianDownHFrag, gaussianDownVFrag, gaussianUpFrag, generateEmptyTypedArray, generateHalfFloatTexture, getBackgroundImage, getColorFromGradientStops, getComposition, getConfig, getDefaultTemplateCanvasPool, getDefaultTextureFactory, getGeometryByShape, getGeometryTriangles, getImageItemRenderInfo, getKTXTextureOptions, getKeyFrameMetaByRawValue, getMat4TR, getMat4TRS, getParticleMeshShader, getPixelRatio, getPreMultiAlpha, getStandardComposition, getStandardImage, getStandardItem, getStandardJSON, getTextureSize, glContext, gpuTimer, imageDataFromColor, imageDataFromGradient, initErrors, initGLContext, integrate, interpolateColor, intersectRayBox, intersectRaySphere, intersectRayTriangle, isAndroid, isArray, isFunction, isIOS, isIdentityMatrix, isObject, isScene, isSimulatorCellPhone, isString, isUniformStruct, isUniformStructArray, isWebGL2, isZeroVec, item_define as itemDefine, itemFrag, itemFrameFrag, itemVert, loadBinary, loadBlob, loadImage, loadVideo, loadWebPOptional, mat3FromQuat, mat3FromRotation, mat3FromRotationZ, mat4Clone, mat4Determinate, mat4ToIdentityMatrix, mat4create, mat4fromRotationTranslationScale, mat4invert, mat4multiply, mat4perspective, maxSpriteMeshItemCount, maxSpriteTextureCount, modifyMaxKeyframeShader, nearestPowerOfTwo, noop, parsePercent$1 as parsePercent, particleFrag, particleOriginTranslateMap, particleVert, pluginLoaderMap, quatFromRotation, quatMultiply, quatStar, random, registerFilter, registerFilters, registerPlugin, removeItem, requestAsync, rotateByQuat, rotateVec2, rotationFromMat3, screenMeshVert, setBlendMode, setConfig, setDefaultTextureFactory, setMaskMode, setMaxSpriteMeshItemCount, setRayFromCamera, setSideMode, setSpriteMeshMaxFragmentTextures, setSpriteMeshMaxItemCountByGPU, setUniformValue, sortByOrder, index as spec, spriteMeshShaderFromFilter, spriteMeshShaderFromRenderInfo, spriteMeshShaderIdFromRenderInfo, thresholdFrag, throwDestroyedError, trailVert, translatePoint, trianglesFromRect, unregisterPlugin, valIfUndefined, value, valueDefine, vec3Cross, vec3MulMat3, vec3MulMat4, vec3RotateByMat4, vecAdd, vecAssign, vecDot, vecFill, vecMinus, vecMulCombine, vecMulScalar, vecNormalize, vecSquareDistance, version };
+export { AbstractPlugin, AssetManager, BYTES_TYPE_MAP, BezierSegments, COMPRESSED_TEXTURE, CONSTANT_MAP_BLEND, CONSTANT_MAP_DEPTH, CONSTANT_MAP_STENCIL_FUNC, CONSTANT_MAP_STENCIL_OP, COPY_FRAGMENT_SHADER, COPY_MESH_SHADER_ID, COPY_VERTEX_SHADER, CalculateItem, CalculateLoader, CalculateVFXItem, Camera, CameraController, CameraVFXItem, CameraVFXItemLoader, Composition, CompositionSourceManager, CurveValue, DEFAULT_FONTS, DEG2RAD, DestroyOptions, Downloader, EFFECTS_COPY_MESH_NAME, EVENT_TYPE_CLICK, EVENT_TYPE_TOUCH_END, EVENT_TYPE_TOUCH_MOVE, EVENT_TYPE_TOUCH_START, Engine, EventSystem, FILTER_NAME_NONE, FilterMode, FilterSpriteVFXItem, Float16ArrayWrapper, FrameBuffer, GLSLVersion, GPUCapability, Geometry, GlobalUniforms, GradientValue, HELP_LINK, HitTestType, InteractBehavior$1 as InteractBehavior, InteractItem, InteractLoader, InteractMesh, InteractVFXItem, KTXTexture, LOG_TYPE, LineSegments, LinearValue, Material, MaterialDataBlock, MaterialRenderType, Mesh, NumberEpsilon, OrderType, PLAYER_OPTIONS_ENV_EDITOR, POST_PROCESS_SETTINGS, ParticleLoader, ParticleMesh, ParticleSystem, ParticleVFXItem, PassTextureCache, PathSegments, PluginSystem, QCanvasViewer, QText, QTextWrapMode, RENDER_PASS_NAME_PREFIX, RENDER_PREFER_LOOKUP_TEXTURE, RUNTIME_ENV, RandomSetValue, RandomValue, RandomVectorValue, RenderBuffer, RenderFrame, RenderPass, RenderPassAttachmentStorageType, RenderPassDestroyAttachmentType, RenderPassPriorityNormal, RenderPassPriorityPostprocess, RenderPassPriorityPrepare, RenderTargetHandle, RenderTextureFormat, Renderer, SEMANTIC_MAIN_PRE_COLOR_ATTACHMENT_0, SEMANTIC_MAIN_PRE_COLOR_ATTACHMENT_SIZE_0, SEMANTIC_PRE_COLOR_ATTACHMENT_0, SEMANTIC_PRE_COLOR_ATTACHMENT_SIZE_0, SPRITE_VERTEX_STRIDE, SemanticMap, Shader, ShaderCompileResultStatus, ShaderType, SpriteItem, SpriteLoader, SpriteMesh, SpriteVFXItem, StaticValue, TEMPLATE_USE_OFFSCREEN_CANVAS, TEXTURE_UNIFORM_MAP, TextItem, TextLoader, TextMesh, TextVFXItem, Texture, TextureFactory, TextureLoadAction, TextureSourceType, TextureStoreAction, ThreeComposition, ThreeDisplayObject, ThreeMaterial, ThreeTexture, Ticker, TimelineComponent, Transform, VFXItem, VFX_ITEM_TYPE_TREE, ValueGetter, addByOrder, addItem, addItemWithOrder, alphaFrameFrag, alphaMaskFrag, assertExist, asserts, blend, bloomMixVert, bloomThresholdVert, calculateTranslation, cameraMove_frag as cameraMoveFrag, cameraMoveVert, canvasPool, clamp$1 as clamp, colorGradingFrag, colorStopsFromGradient, colorToArr$1 as colorToArr, combineImageTemplate, combineImageTemplate1, combineImageTemplate1Async, combineImageTemplate2, combineImageTemplate2Async, combineImageTemplateAsync, compatible_frag as compatibleFrag, compatible_vert as compatibleVert, convertAnchor, copyFrag, createCopyShader, createFilter, createFilterShaders, createGLContext, createKeyFrameMeta, createShaderWithMarcos, createShape, createVFXItem, createValueGetter, deepClone, defaultGlobalVolume, defaultPlugins, delayFrag, deserializeMipmapTexture, distortionFrag, distortionVert, dotInTriangle, earcut, enlargeBuffer, ensureVec3, filters, findPreviousRenderPass, gaussianDown_frag as gaussianDownFrag, gaussianDownHFrag, gaussianDownVFrag, gaussianUpFrag, generateEmptyTypedArray, generateHalfFloatTexture, getBackgroundImage, getColorFromGradientStops, getConfig, getDefaultTemplateCanvasPool, getDefaultTextureFactory, getGeometryByShape, getGeometryTriangles, getImageItemRenderInfo, getKTXTextureOptions, getKeyFrameMetaByRawValue, getMat4TR, getMat4TRS, getParticleMeshShader, getPixelRatio, getPreMultiAlpha, getStandardComposition, getStandardImage, getStandardItem, getStandardJSON, getTextureSize, glContext, gpuTimer, imageDataFromColor, imageDataFromGradient, initErrors, initGLContext, integrate, interpolateColor, intersectRayBox, intersectRaySphere, intersectRayTriangle, isAndroid, isArray, isFunction, isIOS, isIdentityMatrix, isObject, isScene, isSimulatorCellPhone, isString, isUniformStruct, isUniformStructArray, isWebGL2, isZeroVec, item_define as itemDefine, itemFrag, itemFrameFrag, itemVert, loadBinary, loadBlob, loadImage, loadVideo, loadWebPOptional, mat3FromQuat, mat3FromRotation, mat3FromRotationZ, mat4Clone, mat4Determinate, mat4ToIdentityMatrix, mat4create, mat4fromRotationTranslationScale, mat4invert, mat4multiply, mat4perspective, maxSpriteMeshItemCount, maxSpriteTextureCount, modifyMaxKeyframeShader, nearestPowerOfTwo, noop, parsePercent$1 as parsePercent, particleFrag, particleOriginTranslateMap, particleVert, pluginLoaderMap, quatFromRotation, quatMultiply, quatStar, random, registerFilter, registerFilters, registerPlugin, removeItem, requestAsync, rotateByQuat, rotateVec2, rotationFromMat3, screenMeshVert, setBlendMode, setConfig, setDefaultTextureFactory, setMaskMode, setMaxSpriteMeshItemCount, setRayFromCamera, setSideMode, setSpriteMeshMaxFragmentTextures, setSpriteMeshMaxItemCountByGPU, setUniformValue, sortByOrder, index as spec, spriteMeshShaderFromFilter, spriteMeshShaderFromRenderInfo, spriteMeshShaderIdFromRenderInfo, thresholdFrag, throwDestroyedError, trailVert, translatePoint, trianglesFromRect, unregisterPlugin, valIfUndefined, value, valueDefine, vec3Cross, vec3MulMat3, vec3MulMat4, vec3RotateByMat4, vecAdd, vecAssign, vecDot, vecFill, vecMinus, vecMulCombine, vecMulScalar, vecNormalize, vecSquareDistance, version };
 //# sourceMappingURL=index.mjs.map