@galacean/effects-threejs 2.0.0-alpha.8 → 2.0.0-alpha.9

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.8
+ * Version: v2.0.0-alpha.9
  */
 
 'use strict';
@@ -9621,6 +9621,36 @@ var seed$9 = 1;
             type: glContext.UNSIGNED_BYTE
         }, options);
     };
+    /**
+   * 通过 URL 创建 Texture 对象。
+   * @param url - 要创建的 Texture URL
+   * @since 2.0.0
+   */ Texture.fromImage = function fromImage(url, engine) {
+        return _async_to_generator(function() {
+            var image, texture;
+            return __generator(this, function(_state) {
+                switch(_state.label){
+                    case 0:
+                        return [
+                            4,
+                            loadImage(url)
+                        ];
+                    case 1:
+                        image = _state.sent();
+                        texture = Texture.create(engine, {
+                            sourceType: exports.TextureSourceType.image,
+                            image: image,
+                            id: generateGUID$1()
+                        });
+                        texture.initialize();
+                        return [
+                            2,
+                            texture
+                        ];
+                }
+            });
+        })();
+    };
     _create_class(Texture, [
         {
             key: "isDestroyed",
@@ -10593,14 +10623,10 @@ var seed$7 = 1;
         if (!this.getVisible()) {
             return;
         }
-        var material = this.material;
-        var geo = this.geometry;
         if (renderer.renderingData.currentFrame.globalUniforms) {
             renderer.setGlobalMatrix("effects_ObjectToWorld", this.worldMatrix);
         }
-        // 执行 Geometry 的数据刷新
-        geo.flush();
-        renderer.drawGeometry(geo, material);
+        renderer.drawGeometry(this.geometry, this.material);
     };
     /**
    * 获取当前 Mesh 的第一个 geometry。
@@ -13719,6 +13745,23 @@ exports.SpriteComponent = /*#__PURE__*/ function(RendererComponent) {
    */ _proto.getVisible = function getVisible() {
         return this.visible;
     };
+    /**
+   * 设置当前图层的颜色
+   * > Tips: 透明度也属于颜色的一部分，当有透明度/颜色 K 帧变化时，该 API 会失效
+   * @since 2.0.0
+   * @param color - 颜色值
+   */ _proto.setColor = function setColor(color) {
+        this.color = color;
+        this.material.setVector4("_Color", new Vector4().setFromArray(color));
+    };
+    /**
+   * 设置当前 Mesh 的纹理
+   * @since 2.0.0
+   * @param texture - 纹理对象
+   */ _proto.setTexture = function setTexture(texture) {
+        this.renderer.texture = texture;
+        this.material.setTexture("uSampler0", texture);
+    };
     _proto.render = function render(renderer) {
         if (!this.getVisible()) {
             return;
@@ -13729,8 +13772,6 @@ exports.SpriteComponent = /*#__PURE__*/ function(RendererComponent) {
             renderer.setGlobalMatrix("effects_ObjectToWorld", this.transform.getWorldMatrix());
         }
         this.material.setVector2("_Size", this.transform.size);
-        // 执行 Geometry 的数据刷新
-        geo.flush();
         renderer.drawGeometry(geo, material);
     };
     _proto.start = function start() {
@@ -14123,7 +14164,7 @@ exports.SpriteComponent = __decorate([
 
 var RUNTIME_ENV = "runtime_env";
 var RENDER_PREFER_LOOKUP_TEXTURE = "lookup_texture";
-// 数据模板使用 offscreen canvas 绘制
+// 文本元素使用 offscreen canvas 绘制
 var TEMPLATE_USE_OFFSCREEN_CANVAS = "offscreen_canvas";
 // 后处理配置相关
 var POST_PROCESS_SETTINGS = "post_process_settings";
@@ -17996,12 +18037,6 @@ var TextStyle = function TextStyle(options) {
     }
 };
 
-var DEFAULT_FONTS = [
-    "serif",
-    "sans-serif",
-    "monospace",
-    "courier"
-];
 var CanvasPool = /*#__PURE__*/ function() {
     function CanvasPool() {
         this.elements = [];
@@ -18011,12 +18046,11 @@ var CanvasPool = /*#__PURE__*/ function() {
         this.elements.forEach(function(e) {
             return e.remove();
         });
-        // @ts-expect-error
-        this.elements = [];
+        // clearing the array
+        this.elements.length = 0;
     };
     _proto.getCanvas = function getCanvas() {
-        if (this.elements.length) {
-            // @ts-expect-error
+        if (this.elements.length !== 0) {
             return this.elements.shift();
         }
         if (getConfig(TEMPLATE_USE_OFFSCREEN_CANVAS)) {
@@ -18031,12 +18065,13 @@ var CanvasPool = /*#__PURE__*/ function() {
             return defCanvas;
         }
     };
-    _proto.saveCanvas = function saveCanvas(cvs) {
-        cvs.width = cvs.height = 1;
+    _proto.saveCanvas = function saveCanvas(canvas) {
+        canvas.width = 1;
+        canvas.height = 1;
         if (this.elements.length < 3) {
-            addItem(this.elements, cvs);
+            addItem(this.elements, canvas);
         } else {
-            cvs.remove();
+            canvas.remove();
         }
     };
     return CanvasPool;
@@ -18045,117 +18080,13 @@ var canvasPool = new CanvasPool();
 function getDefaultTemplateCanvasPool() {
     return canvasPool;
 }
-function getBackgroundImage(template, variables) {
-    var templateBackground;
-    var _template_background;
-    var _ref = (_template_background = template == null ? void 0 : template.background) != null ? _template_background : {}, name = _ref.name, url = _ref.url;
-    if (name) {
-        if (variables && variables[name]) {
-            templateBackground = variables[name];
-        } else if (url) {
-            templateBackground = url;
-        }
-    }
-    return templateBackground;
-}
-function drawImageByTemplate(image, template, variables) {
-    return _drawImageByTemplate.apply(this, arguments);
-}
-function _drawImageByTemplate() {
-    _drawImageByTemplate = _async_to_generator(function(image, template, variables) {
-        var drawImage, templateBackground, _tmp;
-        return __generator(this, function(_state) {
-            switch(_state.label){
-                case 0:
-                    if (!image) {
-                        throw Error("image not provided");
-                    }
-                    if (!template) {
-                        return [
-                            2,
-                            image
-                        ];
-                    }
-                    drawImage = image;
-                    // 获取动态换图的图片对象或 url 地址
-                    templateBackground = getBackgroundImage(template, variables);
-                    if (!(templateBackground && templateBackground !== image.src)) return [
-                        3,
-                        4
-                    ];
-                    if (!isString(templateBackground)) return [
-                        3,
-                        2
-                    ];
-                    return [
-                        4,
-                        loadImage(templateBackground)
-                    ];
-                case 1:
-                    _tmp = _state.sent();
-                    return [
-                        3,
-                        3
-                    ];
-                case 2:
-                    _tmp = templateBackground;
-                    _state.label = 3;
-                case 3:
-                    drawImage = _tmp;
-                    _state.label = 4;
-                case 4:
-                    return [
-                        2,
-                        drawImage
-                    ];
-            }
-        });
-    });
-    return _drawImageByTemplate.apply(this, arguments);
-}
-/**
- * @param url
- * @param template
- * @param variables
- * @param options
- * @returns
- */ function combineImageTemplate(url, template, variables) {
-    return _combineImageTemplate.apply(this, arguments);
-}
-function _combineImageTemplate() {
-    _combineImageTemplate = _async_to_generator(function(url, template, variables) {
-        var image;
-        return __generator(this, function(_state) {
-            switch(_state.label){
-                case 0:
-                    if (!(typeof url === "string")) return [
-                        3,
-                        2
-                    ];
-                    return [
-                        4,
-                        loadImage(url)
-                    ];
-                case 1:
-                    image = _state.sent();
-                    return [
-                        3,
-                        3
-                    ];
-                case 2:
-                    image = url;
-                    _state.label = 3;
-                case 3:
-                    return [
-                        2,
-                        drawImageByTemplate(image, template, variables)
-                    ];
-            }
-        });
-    });
-    return _combineImageTemplate.apply(this, arguments);
-}
 
+var DEFAULT_FONTS = [
+    "serif",
+    "sans-serif",
+    "monospace",
+    "courier"
+];
 exports.TextComponent = /*#__PURE__*/ function(SpriteComponent) {
     _inherits(TextComponent, SpriteComponent);
     function TextComponent(engine, props) {
@@ -18538,14 +18469,10 @@ exports.EffectComponent = /*#__PURE__*/ function(RendererComponent) {
         this.item.getHitTestParams = this.getHitTestParams;
     };
     _proto.render = function render(renderer) {
-        var material = this.material;
-        var geo = this.geometry;
         if (renderer.renderingData.currentFrame.globalUniforms) {
             renderer.setGlobalMatrix("effects_ObjectToWorld", this.transform.getWorldMatrix());
         }
-        // 执行 Geometry 的数据刷新
-        geo.flush();
-        renderer.drawGeometry(geo, material);
+        renderer.drawGeometry(this.geometry, this.material);
     };
     /**
    * 获取当前 Mesh 的可见性。
@@ -21370,10 +21297,110 @@ function passRenderLevel(l, renderLevel) {
     return false;
 }
 
-function isScene(scene) {
+function isSceneJSON(scene) {
     // TODO: 判断不太优雅，后期试情况优化
     return isObject(scene) && "jsonScene" in scene;
 }
+function isSceneURL(scene) {
+    return isObject(scene) && "url" in scene;
+}
+function isSceneWithOptions(scene) {
+    // TODO: 判断不太优雅，后期试情况优化
+    return isObject(scene) && "options" in scene;
+}
+
+function getBackgroundImage(template, variables) {
+    var templateBackground;
+    var _template_background;
+    var _ref = (_template_background = template == null ? void 0 : template.background) != null ? _template_background : {}, name = _ref.name, url = _ref.url;
+    if (name) {
+        if (variables && variables[name]) {
+            templateBackground = variables[name];
+        } else if (url) {
+            templateBackground = url;
+        }
+    }
+    return templateBackground;
+}
+/**
+ * @param url
+ * @param template
+ * @param variables
+ * @param options
+ * @returns
+ */ function combineImageTemplate(url, template, variables) {
+    return _combineImageTemplate.apply(this, arguments);
+}
+function _combineImageTemplate() {
+    _combineImageTemplate = _async_to_generator(function(url, template, variables) {
+        var image, drawImage, templateBackground, _tmp;
+        return __generator(this, function(_state) {
+            switch(_state.label){
+                case 0:
+                    if (!(typeof url === "string")) return [
+                        3,
+                        2
+                    ];
+                    return [
+                        4,
+                        loadImage(url)
+                    ];
+                case 1:
+                    image = _state.sent();
+                    return [
+                        3,
+                        3
+                    ];
+                case 2:
+                    image = url;
+                    _state.label = 3;
+                case 3:
+                    if (!image) {
+                        throw new Error("image not provided.");
+                    }
+                    if (!template) {
+                        return [
+                            2,
+                            image
+                        ];
+                    }
+                    drawImage = image;
+                    // 获取动态换图的图片对象或 url 地址
+                    templateBackground = getBackgroundImage(template, variables);
+                    if (!(templateBackground && isString(templateBackground) && templateBackground !== image.src)) return [
+                        3,
+                        7
+                    ];
+                    if (!isString(templateBackground)) return [
+                        3,
+                        5
+                    ];
+                    return [
+                        4,
+                        loadImage(templateBackground)
+                    ];
+                case 4:
+                    _tmp = _state.sent();
+                    return [
+                        3,
+                        6
+                    ];
+                case 5:
+                    _tmp = templateBackground;
+                    _state.label = 6;
+                case 6:
+                    drawImage = _tmp;
+                    _state.label = 7;
+                case 7:
+                    return [
+                        2,
+                        drawImage
+                    ];
+            }
+        });
+    });
+    return _combineImageTemplate.apply(this, arguments);
+}
 
 var seed$1 = 1;
 /**
@@ -21402,22 +21429,19 @@ var seed$1 = 1;
     };
     /**
    * 根据用户传入的参数修改场景数据
-   */ _proto.updateSceneData = function updateSceneData(compositions) {
+   */ _proto.updateSceneData = function updateSceneData(items) {
         var variables = this.options.variables;
-        if (!variables || Object.keys(variables).length <= 0) {
-            return compositions;
-        }
-        compositions.forEach(function(composition) {
-            composition.items.forEach(function(item) {
-                if (item.type === ItemType$1.text) {
-                    var textVariable = variables[item.name];
-                    if (textVariable) {
-                        item.content.options.text = textVariable;
-                    }
+        if (!variables || Object.keys(variables).length === 0) {
+            return;
+        }
+        items.forEach(function(item) {
+            if (item.type === ItemType$1.text) {
+                var textVariable = variables[item.name];
+                if (textVariable) {
+                    item.content.options.text = textVariable;
                 }
-            });
+            }
         });
-        return compositions;
     };
     /**
    * 场景创建，通过 json 创建出场景对象，并进行提前编译等工作
@@ -21442,7 +21466,7 @@ var seed$1 = 1;
                         cancelLoading = true;
                         _this.removeTimer(loadTimer);
                         var totalTime = performance.now() - startTime;
-                        reject("Load time out: totalTime: " + totalTime.toFixed(4) + "ms " + timeInfos.join(" ") + ", url: " + assetUrl);
+                        reject(new Error("Load time out: totalTime: " + totalTime.toFixed(4) + "ms " + timeInfos.join(" ") + ", url: " + assetUrl));
                     }, _this.timeout * 1000);
                     _this.timers.push(loadTimer);
                 });
@@ -21477,9 +21501,9 @@ var seed$1 = 1;
                                 ];
                             case 3:
                                 e = _state.sent();
-                                throw new Error("load error in " + label + ", " + e);
+                                throw new Error("Load error in " + label + ", " + e);
                             case 4:
-                                throw new Error("load canceled.");
+                                throw new Error("Load canceled.");
                         }
                     });
                 });
@@ -21513,7 +21537,7 @@ var seed$1 = 1;
                                 rawJSON = _state.sent();
                                 _state.label = 3;
                             case 3:
-                                if (!isScene(rawJSON)) return [
+                                if (!isSceneJSON(rawJSON)) return [
                                     3,
                                     6
                                 ];
@@ -21543,7 +21567,7 @@ var seed$1 = 1;
                                 for(i1 = 0; i1 < scene.images.length; i1++){
                                     scene.textureOptions[i1].image = scene.images[i1];
                                 }
-                                scene.jsonScene.compositions = _this.updateSceneData(scene.jsonScene.compositions);
+                                _this.updateSceneData(scene.jsonScene.items);
                                 _state.label = 5;
                             case 5:
                                 return [
@@ -21592,7 +21616,7 @@ var seed$1 = 1;
                                 ];
                             case 10:
                                 loadedTextures = _state.sent();
-                                jsonScene.compositions = _this.updateSceneData(jsonScene.compositions);
+                                _this.updateSceneData(jsonScene.items);
                                 scene = {
                                     url: url,
                                     renderLevel: _this.options.renderLevel,
@@ -21815,7 +21839,7 @@ var seed$1 = 1;
                 _this_options = _this.options, useCompressedTexture = _this_options.useCompressedTexture, variables = _this_options.variables;
                 baseUrl = _this.baseUrl;
                 jobs = images.map(/*#__PURE__*/ _async_to_generator(function(img, idx) {
-                    var png, webp, imageURL, webpURL, template, isTemplateV2, background, url, isVideo, loadFn, resultImage, resultImage1, compressed, src, bufferURL, _ref, url1, image;
+                    var png, webp, imageURL, webpURL, template, background, url, isVideo, loadFn, resultImage, compressed, src, bufferURL, _ref, url1, image;
                     return __generator(this, function(_state) {
                         switch(_state.label){
                             case 0:
@@ -21832,17 +21856,15 @@ var seed$1 = 1;
                                 webpURL = webp && new URL(webp, baseUrl).href;
                                 if (!("template" in img)) return [
                                     3,
-                                    13
+                                    8
                                 ];
                                 // 1. 数据模板
                                 template = img.template;
-                                // 判断是否为新版数据模板
-                                isTemplateV2 = "v" in template && template.v === 2 && template.background;
-                                // 获取新版数据模板 background 参数
-                                background = isTemplateV2 ? template.background : undefined;
-                                if (!(isTemplateV2 && background)) return [
+                                // 获取数据模板 background 参数
+                                background = template.background;
+                                if (!background) return [
                                     3,
-                                    8
+                                    7
                                 ];
                                 url = getBackgroundImage(template, variables);
                                 isVideo = background.type === BackgroundType$1.video;
@@ -21895,48 +21917,10 @@ var seed$1 = 1;
                             case 7:
                                 return [
                                     3,
-                                    12
+                                    9
                                 ];
                             case 8:
-                                _state.trys.push([
-                                    8,
-                                    11,
-                                    ,
-                                    12
-                                ]);
-                                return [
-                                    4,
-                                    loadWebPOptional(imageURL, webpURL)
-                                ];
-                            case 9:
-                                resultImage1 = _state.sent();
-                                return [
-                                    4,
-                                    combineImageTemplate(resultImage1.image, template, variables)
-                                ];
-                            case 10:
-                                return [
-                                    2,
-                                    _state.sent()
-                                ];
-                            case 11:
-                                _state.sent();
-                                throw new Error("Failed to load. Check the template, URL: " + imageURL + ".");
-                            case 12:
-                                return [
-                                    3,
-                                    14
-                                ];
-                            case 13:
-                                if ("type" in img && img.type === "video") {
-                                    // 视频
-                                    // TODO: 2024.03.28 后面考虑下掉非推荐的视频元素使用方式
-                                    console.warn("The video element is deprecated. Use template BackgroundType.video instead.");
-                                    return [
-                                        2,
-                                        loadVideo(img.url)
-                                    ];
-                                } else if ("compressed" in img && useCompressedTexture && compressedTexture) {
+                                if ("compressed" in img && useCompressedTexture && compressedTexture) {
                                     // 2. 压缩纹理
                                     compressed = img.compressed;
                                     if (compressedTexture === COMPRESSED_TEXTURE.ASTC) {
@@ -21956,6 +21940,7 @@ var seed$1 = 1;
                                         ];
                                     }
                                 } else if ("sourceType" in img) {
+                                    // TODO: 确定是否有用
                                     return [
                                         2,
                                         img
@@ -21966,13 +21951,13 @@ var seed$1 = 1;
                                         img
                                     ];
                                 }
-                                _state.label = 14;
-                            case 14:
+                                _state.label = 9;
+                            case 9:
                                 return [
                                     4,
                                     loadWebPOptional(imageURL, webpURL)
                                 ];
-                            case 15:
+                            case 10:
                                 _ref = _state.sent(), url1 = _ref.url, image = _ref.image;
                                 _this.assets[idx] = {
                                     url: url1,
@@ -22826,6 +22811,15 @@ var tmpScale = new Vector3(1, 1, 1);
         this.speed = speed;
     };
     /**
+   * 设置合成的可见性
+   * @since 2.0.0
+   * @param visible - 是否可见
+   */ _proto.setVisible = function setVisible(visible) {
+        this.items.forEach(function(item) {
+            item.setVisible(visible);
+        });
+    };
+    /**
    * 获取合成的动画速度
    * @returns
    */ _proto.getSpeed = function getSpeed() {
@@ -24962,6 +24956,12 @@ var _obj3;
     _proto.setVector4 = function setVector4(name, value) {
         this.setUniform(name, value);
     };
+    _proto.getColor = function getColor(name) {
+        return this.uniforms[name].value;
+    };
+    _proto.setColor = function setColor(name, value) {
+        this.setUniform(name, value);
+    };
     _proto.getQuaternion = function getQuaternion(name) {
         return this.uniforms[name].value;
     };
@@ -26053,9 +26053,11 @@ var ThreeRenderer = /*#__PURE__*/ function(Renderer) {
                         opts = _extends({
                             autoplay: true
                         }, options);
-                        if (isSceneWithOptions(url)) {
-                            source = url.scene;
-                            opts = _extends({}, opts, url.options || {});
+                        if (isSceneURL(url)) {
+                            source = url.url;
+                            if (isSceneWithOptions(url)) {
+                                opts = _extends({}, opts, url.options || {});
+                            }
                         } else {
                             source = url;
                         }
@@ -26140,10 +26142,6 @@ var ThreeRenderer = /*#__PURE__*/ function(Renderer) {
     ]);
     return ThreeDisplayObject;
 }(THREE__namespace.Group);
-function isSceneWithOptions(scene) {
-    // TODO: 判断不太优雅，后期试情况优化
-    return isObject(scene) && "scene" in scene;
-}
 
 exports.ThreeSpriteComponent = /*#__PURE__*/ function(SpriteComponent) {
     _inherits(ThreeSpriteComponent, SpriteComponent);
@@ -26280,7 +26278,7 @@ setMaxSpriteMeshItemCount(8);
  */ Mesh.create = function(engine, props) {
     return new ThreeMesh(engine, props);
 };
-var version = "2.0.0-alpha.8";
+var version = "2.0.0-alpha.9";
 logger.info("THREEJS plugin version: " + version);
 
 exports.AbstractPlugin = AbstractPlugin;
@@ -26457,7 +26455,8 @@ exports.isArray = isArray;
 exports.isFunction = isFunction;
 exports.isIOS = isIOS;
 exports.isObject = isObject;
-exports.isScene = isScene;
+exports.isSceneJSON = isSceneJSON;
+exports.isSceneURL = isSceneURL;
 exports.isSceneWithOptions = isSceneWithOptions;
 exports.isSimulatorCellPhone = isSimulatorCellPhone;
 exports.isString = isString;