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

package/dist/asset-manager.d.ts

@@ -1,81 +1,7 @@
-import * as spec from '@galacean/effects-specification';
 import { Downloader } from './downloader';
-import type { Scene } from './scene';
+import type { Scene, SceneLoadOptions, SceneType } from './scene';
 import type { Disposable } from './utils';
 import type { Renderer } from './render';
-/**
- * 场景加载参数
- */
-export interface SceneLoadOptions {
-    /**
-     * 动态数据的参数
-     * key 是 JSON 中配置的字段名
-     * value 是要使用的值，图片使用 url 链接
-     * 图片链接可以使用数组传递，如果第一个加载失败，将尝试使用第二个地址
-     *
-     * @example
-     * ``` ts
-     * {
-     *   variables: {
-     *     bg: ['url','fallback_url'], // 如果两个图片都失败，将会触发加载失败
-     *     fg: 'url' // 如果图片加载失败，将会触发加载失败,
-     *     amount: 88.8,
-     *     name: 'abc'
-     *   }
-     * }
-     * ```
-     */
-    variables?: Record<string, number | string | string[]>;
-    /**
-     * 是否使用压缩纹理
-     */
-    useCompressedTexture?: boolean;
-    /**
-     * 渲染分级。
-     * 分级之后，只会加载当前渲染等级的资源。
-     * 当渲染等级被设置为 B 后，player 的 fps 会降到 30 帧
-     * @default 's'
-     */
-    renderLevel?: spec.RenderLevel;
-    /**
-     * 资源加载超时，时间单位秒
-     * @default 10s
-     */
-    timeout?: number;
-    /***
-     * 用于给 plugin 的加载数据
-     * key/value 的内容由 plugin 自己实现
-     */
-    pluginData?: Record<string, any>;
-    /**
-     * 场景加载时的环境（加载后把 env 结果写入 scene）
-     * @default '' - 编辑器中为 'editor'
-     */
-    env?: string;
-    /**
-     * 加载后是否自动播放
-     * @default true
-     */
-    autoplay?: boolean;
-    /**
-     * 合成播放完成后是否需要再使用，是的话生命周期结束后不会 `dispose`
-     * @default false
-     */
-    reusable?: boolean;
-    /**
-     * 播放速度，当速度为负数时，合成倒播
-     */
-    speed?: number;
-}
-/**
- * 接受用于加载的数据类型
- */
-export type SceneType = string | Scene | Record<string, unknown>;
-export type SceneWithOptionsType = {
-    scene: SceneType;
-    options: SceneLoadOptions;
-};
-export type SceneLoadType = SceneType | SceneWithOptionsType;
 /**
  * 资源管理器
  * 用于加载和动效中所有的资源文件，包括图片、插件、图层粒子数据等

package/dist/canvas-pool.d.ts

@@ -0,0 +1,10 @@
+declare class CanvasPool {
+    readonly elements: HTMLCanvasElement[];
+    constructor();
+    dispose(): void;
+    getCanvas(): HTMLCanvasElement;
+    saveCanvas(canvas: HTMLCanvasElement): void;
+}
+export declare const canvasPool: CanvasPool;
+export declare function getDefaultTemplateCanvasPool(): CanvasPool;
+export {};

package/dist/composition.d.ts

@@ -7,13 +7,12 @@ import type { PluginSystem } from './plugin-system';
 import type { EventSystem, Region } from './plugins';
 import type { MeshRendererOptions, Renderer } from './render';
 import { RenderFrame } from './render';
-import type { Scene } from './scene';
+import type { Scene, SceneType } from './scene';
 import type { Texture } from './texture';
 import { Transform } from './transform';
 import type { Disposable, LostHandler } from './utils';
 import type { VFXItemContent, VFXItemProps } from './vfx-item';
 import { VFXItem } from './vfx-item';
-import type { SceneType } from './asset-manager';
 export interface CompositionStatistic {
     loadTime: number;
     loadStart: number;
@@ -239,6 +238,12 @@ export declare class Composition implements Disposable, LostHandler {
      * @param speed - 速度
      */
     setSpeed(speed: number): void;
+    /**
+     * 设置合成的可见性
+     * @since 2.0.0
+     * @param visible - 是否可见
+     */
+    setVisible(visible: boolean): void;
     /**
      * 获取合成的动画速度
      * @returns

package/dist/index.d.ts

@@ -22,7 +22,6 @@ export * from './plugin-system';
 export * from './plugins';
 export * from './render';
 export * from './scene';
-export * from './semantic-map';
 export * from './shader';
 export * from './shape';
 export * from './template-image';
@@ -32,3 +31,4 @@ export * from './ticker';
 export * from './transform';
 export * from './utils';
 export * from './vfx-item';
+export * from './canvas-pool';

package/dist/index.js

@@ -3,7 +3,7 @@
  * Description: Galacean Effects runtime core for the web
  * Author: Ant Group CO., Ltd.
  * Contributors: 燃然,飂兮,十弦,云垣,茂安,意绮
- * Version: v2.0.0-alpha.8
+ * Version: v2.0.0-alpha.9
  */
 
 'use strict';
@@ -8991,6 +8991,22 @@ let seed$8 = 1;
 /**
  * Texture 抽象类
  */ class Texture extends EffectsObject {
+    /**
+   * 通过 URL 创建 Texture 对象。
+   * @param url - 要创建的 Texture URL
+   * @since 2.0.0
+   */ static fromImage(url, engine) {
+        return _async_to_generator(function*() {
+            const image = yield loadImage(url);
+            const texture = Texture.create(engine, {
+                sourceType: exports.TextureSourceType.image,
+                image,
+                id: generateGUID$1()
+            });
+            texture.initialize();
+            return texture;
+        })();
+    }
     get isDestroyed() {
         return this.destroyed;
     }
@@ -9789,14 +9805,10 @@ let seed$6 = 1;
         if (!this.getVisible()) {
             return;
         }
-        const material = this.material;
-        const 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。
@@ -12739,6 +12751,23 @@ class SpriteComponent extends RendererComponent {
    */ getVisible() {
         return this.visible;
     }
+    /**
+   * 设置当前图层的颜色
+   * > Tips: 透明度也属于颜色的一部分，当有透明度/颜色 K 帧变化时，该 API 会失效
+   * @since 2.0.0
+   * @param color - 颜色值
+   */ setColor(color) {
+        this.color = color;
+        this.material.setVector4('_Color', new Vector4().setFromArray(color));
+    }
+    /**
+   * 设置当前 Mesh 的纹理
+   * @since 2.0.0
+   * @param texture - 纹理对象
+   */ setTexture(texture) {
+        this.renderer.texture = texture;
+        this.material.setTexture('uSampler0', texture);
+    }
     render(renderer) {
         if (!this.getVisible()) {
             return;
@@ -12749,8 +12778,6 @@ class SpriteComponent extends RendererComponent {
             renderer.setGlobalMatrix('effects_ObjectToWorld', this.transform.getWorldMatrix());
         }
         this.material.setVector2('_Size', this.transform.size);
-        // 执行 Geometry 的数据刷新
-        geo.flush();
         renderer.drawGeometry(geo, material);
     }
     start() {
@@ -13170,7 +13197,7 @@ SpriteComponent = __decorate([
 
 const RUNTIME_ENV = 'runtime_env';
 const RENDER_PREFER_LOOKUP_TEXTURE = 'lookup_texture';
-// 数据模板使用 offscreen canvas 绘制
+// 文本元素使用 offscreen canvas 绘制
 const TEMPLATE_USE_OFFSCREEN_CANVAS = 'offscreen_canvas';
 // 后处理配置相关
 const POST_PROCESS_SETTINGS = 'post_process_settings';
@@ -16950,21 +16977,14 @@ class TextStyle {
     }
 }
 
-const DEFAULT_FONTS = [
-    'serif',
-    'sans-serif',
-    'monospace',
-    'courier'
-];
 class CanvasPool {
     dispose() {
         this.elements.forEach((e)=>e.remove());
-        // @ts-expect-error
-        this.elements = [];
+        // clearing the array
+        this.elements.length = 0;
     }
     getCanvas() {
-        if (this.elements.length) {
-            // @ts-expect-error
+        if (this.elements.length !== 0) {
             return this.elements.shift();
         }
         if (getConfig(TEMPLATE_USE_OFFSCREEN_CANVAS)) {
@@ -16979,12 +16999,13 @@ class CanvasPool {
             return defCanvas;
         }
     }
-    saveCanvas(cvs) {
-        cvs.width = cvs.height = 1;
+    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();
         }
     }
     constructor(){
@@ -16995,62 +17016,13 @@ const canvasPool = new CanvasPool();
 function getDefaultTemplateCanvasPool() {
     return canvasPool;
 }
-function getBackgroundImage(template, variables) {
-    let templateBackground;
-    var _template_background;
-    const { name, url } = (_template_background = template == null ? void 0 : template.background) != null ? _template_background : {};
-    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) {
-        if (!image) {
-            throw Error('image not provided');
-        }
-        if (!template) {
-            return image;
-        }
-        let drawImage = image;
-        // 获取动态换图的图片对象或 url 地址
-        const templateBackground = getBackgroundImage(template, variables);
-        if (templateBackground && templateBackground !== image.src) {
-            drawImage = isString(templateBackground) ? yield loadImage(templateBackground) : templateBackground;
-        }
-        return 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) {
-        let image;
-        if (typeof url === 'string') {
-            image = yield loadImage(url);
-        } else {
-            image = url;
-        }
-        return drawImageByTemplate(image, template, variables);
-    });
-    return _combineImageTemplate.apply(this, arguments);
-}
 
+const DEFAULT_FONTS = [
+    'serif',
+    'sans-serif',
+    'monospace',
+    'courier'
+];
 class TextComponent extends SpriteComponent {
     /**
    * 设置字号大小
@@ -17400,14 +17372,10 @@ class EffectComponent extends RendererComponent {
         this.item.getHitTestParams = this.getHitTestParams;
     }
     render(renderer) {
-        const material = this.material;
-        const 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 的可见性。
@@ -20205,10 +20173,64 @@ 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) {
+    let templateBackground;
+    var _template_background;
+    const { name, url } = (_template_background = template == null ? void 0 : template.background) != null ? _template_background : {};
+    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) {
+        let image;
+        if (typeof url === 'string') {
+            image = yield loadImage(url);
+        } else {
+            image = url;
+        }
+        if (!image) {
+            throw new Error('image not provided.');
+        }
+        if (!template) {
+            return image;
+        }
+        let drawImage = image;
+        // 获取动态换图的图片对象或 url 地址
+        const templateBackground = getBackgroundImage(template, variables);
+        if (templateBackground && isString(templateBackground) && templateBackground !== image.src) {
+            drawImage = isString(templateBackground) ? yield loadImage(templateBackground) : templateBackground;
+        }
+        return drawImage;
+    });
+    return _combineImageTemplate.apply(this, arguments);
+}
 
 let seed = 1;
 /**
@@ -20225,22 +20247,19 @@ let seed = 1;
     }
     /**
    * 根据用户传入的参数修改场景数据
-   */ updateSceneData(compositions) {
+   */ updateSceneData(items) {
         const variables = this.options.variables;
-        if (!variables || Object.keys(variables).length <= 0) {
-            return compositions;
-        }
-        compositions.forEach((composition)=>{
-            composition.items.forEach((item)=>{
-                if (item.type === ItemType$1.text) {
-                    const textVariable = variables[item.name];
-                    if (textVariable) {
-                        item.content.options.text = textVariable;
-                    }
+        if (!variables || Object.keys(variables).length === 0) {
+            return;
+        }
+        items.forEach((item)=>{
+            if (item.type === ItemType$1.text) {
+                const textVariable = variables[item.name];
+                if (textVariable) {
+                    item.content.options.text = textVariable;
                 }
-            });
+            }
         });
-        return compositions;
     }
     /**
    * 场景创建，通过 json 创建出场景对象，并进行提前编译等工作
@@ -20268,7 +20287,7 @@ let seed = 1;
                     cancelLoading = true;
                     _this.removeTimer(loadTimer);
                     const 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);
             });
@@ -20280,10 +20299,10 @@ let seed = 1;
                         timeInfos.push(`[${label}: ${(performance.now() - st).toFixed(2)}]`);
                         return result;
                     } catch (e) {
-                        throw new Error(`load error in ${label}, ${e}`);
+                        throw new Error(`Load error in ${label}, ${e}`);
                     }
                 }
-                throw new Error('load canceled.');
+                throw new Error('Load canceled.');
             });
             const loadResourcePromise = /*#__PURE__*/ _async_to_generator(function*() {
                 let scene;
@@ -20298,7 +20317,7 @@ let seed = 1;
                     _this.baseUrl = url;
                     rawJSON = yield hookTimeInfo('loadJSON', ()=>_this.loadJSON(url));
                 }
-                if (isScene(rawJSON)) {
+                if (isSceneJSON(rawJSON)) {
                     // 已经加载过的 可能需要更新数据模板
                     scene = _extends({}, rawJSON);
                     if (_this.options && _this.options.variables && Object.keys(_this.options.variables).length !== 0) {
@@ -20315,7 +20334,7 @@ let seed = 1;
                         for(let i = 0; i < scene.images.length; i++){
                             scene.textureOptions[i].image = scene.images[i];
                         }
-                        scene.jsonScene.compositions = _this.updateSceneData(scene.jsonScene.compositions);
+                        _this.updateSceneData(scene.jsonScene.items);
                     }
                 } else {
                     // TODO: JSONScene 中 bins 的类型可能为 ArrayBuffer[]
@@ -20328,7 +20347,7 @@ let seed = 1;
                     ]);
                     yield hookTimeInfo('processFontURL', ()=>_this.processFontURL(fonts));
                     const loadedTextures = yield hookTimeInfo('processTextures', ()=>_this.processTextures(loadedImages, loadedBins, jsonScene));
-                    jsonScene.compositions = _this.updateSceneData(jsonScene.compositions);
+                    _this.updateSceneData(jsonScene.items);
                     scene = {
                         url: url,
                         renderLevel: _this.options.renderLevel,
@@ -20465,11 +20484,9 @@ let seed = 1;
                 if ('template' in img) {
                     // 1. 数据模板
                     const template = img.template;
-                    // 判断是否为新版数据模板
-                    const isTemplateV2 = 'v' in template && template.v === 2 && template.background;
-                    // 获取新版数据模板 background 参数
-                    const background = isTemplateV2 ? template.background : undefined;
-                    if (isTemplateV2 && background) {
+                    // 获取数据模板 background 参数
+                    const background = template.background;
+                    if (background) {
                         const url = getBackgroundImage(template, variables);
                         const isVideo = background.type === BackgroundType$1.video;
                         // 根据背景类型确定加载函数
@@ -20490,21 +20507,7 @@ let seed = 1;
                         } catch (e) {
                             throw new Error(`Failed to load. Check the template or if the URL is ${isVideo ? 'video' : 'image'} type, URL: ${url}.`);
                         }
-                    } else {
-                        // 旧版模板或没有背景的处理
-                        try {
-                            const resultImage = yield loadWebPOptional(imageURL, webpURL);
-                            return yield combineImageTemplate(resultImage.image, template, variables);
-                        // eslint-disable-next-line @typescript-eslint/no-unused-vars
-                        } catch (e) {
-                            throw new Error(`Failed to load. Check the template, URL: ${imageURL}.`);
-                        }
                     }
-                } else if ('type' in img && img.type === 'video') {
-                    // 视频
-                    // TODO: 2024.03.28 后面考虑下掉非推荐的视频元素使用方式
-                    console.warn('The video element is deprecated. Use template BackgroundType.video instead.');
-                    return loadVideo(img.url);
                 } else if ('compressed' in img && useCompressedTexture && compressedTexture) {
                     // 2. 压缩纹理
                     const { compressed } = img;
@@ -20523,6 +20526,7 @@ let seed = 1;
                         return _this.loadBins(bufferURL);
                     }
                 } else if ('sourceType' in img) {
+                    // TODO: 确定是否有用
                     return img;
                 } else if (img instanceof HTMLImageElement || img instanceof HTMLCanvasElement || img instanceof HTMLVideoElement || img instanceof Texture) {
                     return img;
@@ -21230,6 +21234,15 @@ const tmpScale = new Vector3(1, 1, 1);
         this.speed = speed;
     }
     /**
+   * 设置合成的可见性
+   * @since 2.0.0
+   * @param visible - 是否可见
+   */ setVisible(visible) {
+        this.items.forEach((item)=>{
+            item.setVisible(visible);
+        });
+    }
+    /**
    * 获取合成的动画速度
    * @returns
    */ getSpeed() {
@@ -22992,7 +23005,9 @@ 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;
 exports.isUniformStruct = isUniformStruct;