@visactor/vstory 0.0.1-alpha.0 → 0.0.2

package/cjs/dsl/story-processor/vchart/marks/area/transformAreaAppear.d.ts

@@ -9,6 +9,6 @@ export declare const transformAreaAppear: (instance: VChart, animation: IChartAp
     duration: number;
     loop: number | boolean;
     oneByOne: boolean;
-    easing: import("@visactor/vrender").EasingType;
+    easing: import("@visactor/vrender-core").EasingType;
 };
 export {};

package/cjs/dsl/story-processor/vchart/marks/line/transformLineAppear.d.ts

@@ -8,5 +8,5 @@ export declare const transformLineAppear: (instance: VChart, animation: IChartAp
     duration: number;
     loop: number | boolean;
     oneByOne: boolean;
-    easing: import("@visactor/vrender").EasingType;
+    easing: import("@visactor/vrender-core").EasingType;
 };

package/cjs/dsl/story-processor/vchart/marks/rect/transformRectAppear.d.ts

@@ -8,5 +8,5 @@ export declare const transformRectAppear: (instance: VChart, animation: IChartAp
     duration: number;
     loop: number | boolean;
     oneByOne: boolean;
-    easing: import("@visactor/vrender").EasingType;
+    easing: import("@visactor/vrender-core").EasingType;
 };

package/cjs/dsl/story-processor/vchart/marks/symbol/transformSymbolAppear.d.ts

@@ -8,5 +8,5 @@ export declare const transformSymbolAppear: (instance: VChart, animation: IChart
     duration: number;
     loop: number | boolean;
     oneByOne: boolean;
-    easing: import("@visactor/vrender").EasingType;
+    easing: import("@visactor/vrender-core").EasingType;
 };

package/cjs/dsl/story-processor/vchart/marks/text/transformTextAppear.d.ts

@@ -9,6 +9,6 @@ export declare const transformTextAppear: (instance: VChart, animation: IChartAp
     duration: number;
     loop: number | boolean;
     oneByOne: boolean;
-    easing: import("@visactor/vrender").EasingType;
+    easing: import("@visactor/vrender-core").EasingType;
 };
 export {};

package/cjs/dsl/types/chart/appear.d.ts

@@ -4,6 +4,9 @@ export interface IChartAppearPayLoad extends IActionPayload {
         oneByOne: boolean;
         effect: string;
     };
+    fade?: {
+        isBaseOpacity?: boolean;
+    };
 }
 export interface IChartAppearAction extends IAction {
     action: 'appear';

package/cjs/dsl/types/chart/appear.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/dsl/types/chart/appear.ts"],"names":[],"mappings":"","file":"appear.js","sourcesContent":["import type { IAction, IAnimationParams, IActionPayload } from '../index';\n\nexport interface IChartAppearPayLoad extends IActionPayload {\n  animation: IAnimationParams & {\n    oneByOne: boolean;\n    /**\n     * 柱状图支持: 'grow' | 'fade' | 'bounce'\n     * 折线图支持: 'grow' | 'fade'\n     * 饼图支持: 'grow' | 'fade' | 'growAngle' | 'growRadius'\n     */\n    effect: string;\n  };\n}\n\nexport interface IChartAppearAction extends IAction {\n  action: 'appear';\n  payload: IChartAppearPayLoad;\n}\n\nexport type AppearOption = Omit<IChartAppearAction, 'action' | 'data'>;\n"]}
+{"version":3,"sources":["../src/dsl/types/chart/appear.ts"],"names":[],"mappings":"","file":"appear.js","sourcesContent":["import type { IAction, IAnimationParams, IActionPayload } from '../index';\n\nexport interface IChartAppearPayLoad extends IActionPayload {\n  animation: IAnimationParams & {\n    oneByOne: boolean;\n    /**\n     * 柱状图支持: 'grow' | 'fade' | 'bounce'\n     * 折线图支持: 'grow' | 'fade'\n     * 饼图支持: 'grow' | 'fade' | 'growAngle' | 'growRadius'\n     */\n    effect: string;\n  };\n  fade?: { isBaseOpacity?: boolean };\n}\n\nexport interface IChartAppearAction extends IAction {\n  action: 'appear';\n  payload: IChartAppearPayLoad;\n}\n\nexport type AppearOption = Omit<IChartAppearAction, 'action' | 'data'>;\n"]}

package/cjs/scene/index.js

@@ -17,4 +17,5 @@ var __createBinding = this && this.__createBinding || (Object.create ? function(
 
 Object.defineProperty(exports, "__esModule", {
     value: !0
-}), __exportStar(require("./scene"), exports);
+}), __exportStar(require("./scene"), exports);
+//# sourceMappingURL=index.js.map

package/cjs/scene/scene.js

@@ -68,5 +68,4 @@ class Scene {
     release() {}
 }
 
-exports.Scene = Scene;
-//# sourceMappingURL=scene.js.map
+exports.Scene = Scene;

package/cjs/story/interface/runtime-interface.d.ts

@@ -1,6 +1,10 @@
 import type { IGraphic } from '@visactor/vrender';
 export interface IStoryInitOption {
     dom: string | HTMLDivElement;
+    playerOption?: {
+        scaleX?: number;
+        scaleY?: number;
+    };
 }
 export interface IStory {
     readonly id: string;

package/cjs/story/interface/runtime-interface.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/story/interface/runtime-interface.ts"],"names":[],"mappings":"","file":"runtime-interface.js","sourcesContent":["import type { IGraphic } from '@visactor/vrender';\n\nexport interface IStoryInitOption {\n  dom: string | HTMLDivElement; // dom id\n}\n\nexport interface IStory {\n  readonly id: string;\n}\n\nexport type StoryEvent = Event & {\n  detailPath: IGraphic[];\n  path: IGraphic[];\n};\n"]}
+{"version":3,"sources":["../src/story/interface/runtime-interface.ts"],"names":[],"mappings":"","file":"runtime-interface.js","sourcesContent":["import type { IGraphic } from '@visactor/vrender';\n\nexport interface IStoryInitOption {\n  dom: string | HTMLDivElement; // dom id\n  playerOption?: {\n    scaleX?: number;\n    scaleY?: number;\n  };\n}\n\nexport interface IStory {\n  readonly id: string;\n}\n\nexport type StoryEvent = Event & {\n  detailPath: IGraphic[];\n  path: IGraphic[];\n};\n"]}

package/cjs/story/player/index.d.ts

@@ -28,7 +28,10 @@ export declare class Player implements IPlayer {
     protected _ticker: Ticker;
     protected _currTime: number;
     protected _actionProcessor: ActionProcessor;
-    constructor(c: StoryCanvas);
+    constructor(c: StoryCanvas, options?: {
+        scaleX?: number;
+        scaleY?: number;
+    });
     addAct(c: IActSpec, characters: {
         [key: string]: ICharacter;
     }): void;

package/cjs/story/player/index.js

@@ -50,9 +50,13 @@ class Ticker {
 exports.Ticker = Ticker;
 
 class Player {
-    constructor(c) {
+    constructor(c, options) {
+        var _a, _b;
         this._canvas = c, this._acts = [], this._ticker = new Ticker, this._currTime = 0, 
-        this._actionProcessor = new story_processor_1.ActionProcessor(story_processor_1.processorMap);
+        c.getStage().defaultLayer.setAttributes({
+            scaleX: null !== (_a = null == options ? void 0 : options.scaleX) && void 0 !== _a ? _a : 1,
+            scaleY: null !== (_b = null == options ? void 0 : options.scaleY) && void 0 !== _b ? _b : 1
+        }), this._actionProcessor = new story_processor_1.ActionProcessor(story_processor_1.processorMap);
     }
     addAct(c, characters) {
         const scenes = [], characterSet = new Set;

package/cjs/story/player/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/story/player/index.ts"],"names":[],"mappings":"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","file":"index.js","sourcesContent":["import { isNumber } from '@visactor/vutils';\nimport type { StoryCanvas } from '../canvas/canvas';\nimport type { IActSpec, IAction } from '../interface';\nimport type { IPlayer } from '../interface/player';\nimport { processorMap, ActionProcessor } from '../../dsl/story-processor';\n// import { Encoder } from './encode';\nimport type { ICharacter } from '../character';\n\nexport class Ticker {\n  cb?: (delta: number) => void;\n  rafIdx = 0;\n  start(cb: (t: number) => void) {\n    this.stop();\n    this.cb = cb;\n    this._tick(0);\n  }\n\n  _tick = (lt: number) => {\n    const ct = Date.now();\n    this.cb && this.cb(lt === 0 ? 0 : ct - lt);\n    this.rafIdx = requestAnimationFrame(() => this._tick(ct));\n  };\n\n  stop() {\n    this.rafIdx && cancelAnimationFrame(this.rafIdx);\n    this.rafIdx = 0;\n  }\n}\n\ntype IChapterInstanceItem = {\n  id: string;\n  scenes: Array<{\n    scene: {\n      character: ICharacter;\n      action: IAction;\n    }[];\n    delay: number;\n  }>;\n  characters: ICharacter[];\n};\n\nexport class Player implements IPlayer {\n  protected _canvas: StoryCanvas;\n  protected _acts: IChapterInstanceItem[];\n  protected _currAct: IChapterInstanceItem;\n  protected _ticker: Ticker;\n  protected _currTime: number;\n  // protected _encoder: Encoder;\n  protected _actionProcessor: ActionProcessor;\n\n  constructor(c: StoryCanvas) {\n    this._canvas = c;\n    this._acts = [];\n    this._ticker = new Ticker();\n    this._currTime = 0;\n    // this._encoder = new Encoder();\n    this._actionProcessor = new ActionProcessor(processorMap);\n  }\n\n  addAct(\n    c: IActSpec,\n    characters: {\n      [key: string]: ICharacter;\n    }\n  ): void {\n    const scenes: IChapterInstanceItem['scenes'] = [];\n    const characterSet: Set<ICharacter> = new Set();\n    c.scenes.forEach(item => {\n      const scene: IChapterInstanceItem['scenes'][0] = { scene: [], delay: item.delay ?? 0 };\n      item.actions.forEach(({ characterActions, characterId }) => {\n        const _actions = characterActions.slice();\n        _actions.sort((a, b) => a.startTime - b.startTime);\n        _actions.forEach(action => {\n          const character = characters[characterId];\n          scene.scene.push({\n            character,\n            action: action\n          });\n          characterSet.add(character);\n        });\n      });\n      scenes.push(scene);\n    });\n    this._acts.push({\n      id: c.id,\n      scenes: scenes,\n      characters: Array.from(characterSet.values())\n    });\n  }\n\n  setCurrentAct(id: number | string) {\n    if (isNumber(id)) {\n      this._currAct = this._acts[id];\n    } else {\n      this._currAct = this._acts.filter(item => item.id === id)[0];\n    }\n  }\n\n  getCurrentAct() {\n    return this._currAct?.id;\n  }\n\n  // 清除当前状态，一般用于回放操作\n  reset() {\n    this._currAct.characters.forEach(item => {\n      item.reset();\n    });\n  }\n\n  tickTo(t: number) {\n    const lastTime = this._currTime;\n    if (lastTime > t) {\n      // 如果时间回退，那就重新走一遍\n      this.reset();\n      this._currTime = 0;\n      this.tickTo(0);\n    }\n    const characterSet = new Set<ICharacter>();\n\n    let baseStartTime = 0;\n    for (let i = 0; i < this._currAct.scenes.length; i++) {\n      const scene = this._currAct.scenes[i];\n      baseStartTime += scene.delay;\n      if (baseStartTime <= t) {\n        scene.scene.forEach(({ character, action }) => {\n          const { startTime: st } = action;\n          const startTime = st + baseStartTime;\n          if (startTime > t) {\n            return;\n          }\n          characterSet.add(character);\n          // 之前没走过，现在走\n          if (startTime > lastTime && startTime <= t) {\n            const { type } = character.spec;\n            this._actionProcessor.doAction(type, action.action, [character, {}, action]);\n          }\n          character.show();\n        });\n      }\n      let sceneTime = 0;\n      scene.scene.forEach(({ action }) => {\n        const { startTime, duration } = action;\n        sceneTime = Math.max(startTime + duration, startTime);\n      });\n      baseStartTime += sceneTime;\n      // if (baseStartTime > t) {\n      //   break;\n      // }\n    }\n\n    // roleSet.forEach(r => {\n    //   r.tickTo && r.tickTo(t);\n    // });\n\n    this._currTime = t;\n    this._canvas.getStage().ticker.tickAt(t);\n    this._canvas.getStage().render();\n  }\n\n  play(): void {\n    if (!this._currAct) {\n      return;\n    }\n    this._ticker.stop();\n    this._currTime = 0;\n    this.reset();\n    this._ticker.start(t => {\n      this.tickTo(this._currTime + t);\n    });\n  }\n\n  async encodeToVideo(millsecond: number, fps: number): Promise<any> {\n    // // if (!this._currChapter) {\n    // //   return;\n    // // }\n    // const frameNum = (millsecond / 1000) * fps;\n    // const deltaT = 1000 / fps;\n    // this.tickTo(0);\n    // const objUrl = await this._encoder.exportVideo(frameNum, fps, async i => {\n    //   const t = deltaT * i;\n    //   this.tickTo(t);\n    //   return new Promise((resolve, reject) => {\n    //     this._canvas\n    //       .getStage()\n    //       .window.getContext()\n    //       .canvas.nativeCanvas.toBlob((blob: any) => {\n    //         if (blob) {\n    //           resolve(blob);\n    //         } else {\n    //           // console.log('no blob');\n    //           reject('no blob');\n    //         }\n    //       }, `image/png`);\n    //   });\n    // });\n\n    // return objUrl;\n    return null;\n  }\n\n  pause(): void {\n    this._ticker.stop();\n  }\n\n  resume(): void {\n    this._ticker._tick(this._currTime);\n  }\n\n  release(): void {\n    return;\n  }\n}\n"]}
+{"version":3,"sources":["../src/story/player/index.ts"],"names":[],"mappings":";;;;;;;;;;;;AAAA,6CAA4C;AAI5C,+DAA0E;AAI1E,MAAa,MAAM;IAAnB;QAEE,WAAM,GAAG,CAAC,CAAC;QAOX,UAAK,GAAG,CAAC,EAAU,EAAE,EAAE;YACrB,MAAM,EAAE,GAAG,IAAI,CAAC,GAAG,EAAE,CAAC;YACtB,IAAI,CAAC,EAAE,IAAI,IAAI,CAAC,EAAE,CAAC,EAAE,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,EAAE,GAAG,EAAE,CAAC,CAAC;YAC3C,IAAI,CAAC,MAAM,GAAG,qBAAqB,CAAC,GAAG,EAAE,CAAC,IAAI,CAAC,KAAK,CAAC,EAAE,CAAC,CAAC,CAAC;QAC5D,CAAC,CAAC;IAMJ,CAAC;IAhBC,KAAK,CAAC,EAAuB;QAC3B,IAAI,CAAC,IAAI,EAAE,CAAC;QACZ,IAAI,CAAC,EAAE,GAAG,EAAE,CAAC;QACb,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC;IAChB,CAAC;IAQD,IAAI;QACF,IAAI,CAAC,MAAM,IAAI,oBAAoB,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;QACjD,IAAI,CAAC,MAAM,GAAG,CAAC,CAAC;IAClB,CAAC;CACF;AAnBD,wBAmBC;AAcD,MAAa,MAAM;IASjB,YAAY,CAAc,EAAE,OAA8C;;QACxE,IAAI,CAAC,OAAO,GAAG,CAAC,CAAC;QACjB,IAAI,CAAC,KAAK,GAAG,EAAE,CAAC;QAChB,IAAI,CAAC,OAAO,GAAG,IAAI,MAAM,EAAE,CAAC;QAC5B,IAAI,CAAC,SAAS,GAAG,CAAC,CAAC;QACnB,CAAC,CAAC,QAAQ,EAAE,CAAC,YAAY,CAAC,aAAa,CAAC;YACtC,MAAM,EAAE,MAAA,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,MAAM,mCAAI,CAAC;YAC5B,MAAM,EAAE,MAAA,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,MAAM,mCAAI,CAAC;SAC7B,CAAC,CAAC;QAEH,IAAI,CAAC,gBAAgB,GAAG,IAAI,iCAAe,CAAC,8BAAY,CAAC,CAAC;IAC5D,CAAC;IAED,MAAM,CACJ,CAAW,EACX,UAEC;QAED,MAAM,MAAM,GAAmC,EAAE,CAAC;QAClD,MAAM,YAAY,GAAoB,IAAI,GAAG,EAAE,CAAC;QAChD,CAAC,CAAC,MAAM,CAAC,OAAO,CAAC,IAAI,CAAC,EAAE;;YACtB,MAAM,KAAK,GAAsC,EAAE,KAAK,EAAE,EAAE,EAAE,KAAK,EAAE,MAAA,IAAI,CAAC,KAAK,mCAAI,CAAC,EAAE,CAAC;YACvF,IAAI,CAAC,OAAO,CAAC,OAAO,CAAC,CAAC,EAAE,gBAAgB,EAAE,WAAW,EAAE,EAAE,EAAE;gBACzD,MAAM,QAAQ,GAAG,gBAAgB,CAAC,KAAK,EAAE,CAAC;gBAC1C,QAAQ,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,SAAS,GAAG,CAAC,CAAC,SAAS,CAAC,CAAC;gBACnD,QAAQ,CAAC,OAAO,CAAC,MAAM,CAAC,EAAE;oBACxB,MAAM,SAAS,GAAG,UAAU,CAAC,WAAW,CAAC,CAAC;oBAC1C,KAAK,CAAC,KAAK,CAAC,IAAI,CAAC;wBACf,SAAS;wBACT,MAAM,EAAE,MAAM;qBACf,CAAC,CAAC;oBACH,YAAY,CAAC,GAAG,CAAC,SAAS,CAAC,CAAC;gBAC9B,CAAC,CAAC,CAAC;YACL,CAAC,CAAC,CAAC;YACH,MAAM,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;QACrB,CAAC,CAAC,CAAC;QACH,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC;YACd,EAAE,EAAE,CAAC,CAAC,EAAE;YACR,MAAM,EAAE,MAAM;YACd,UAAU,EAAE,KAAK,CAAC,IAAI,CAAC,YAAY,CAAC,MAAM,EAAE,CAAC;SAC9C,CAAC,CAAC;IACL,CAAC;IAED,aAAa,CAAC,EAAmB;QAC/B,IAAI,IAAA,iBAAQ,EAAC,EAAE,CAAC,EAAE;YAChB,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC,KAAK,CAAC,EAAE,CAAC,CAAC;SAChC;aAAM;YACL,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,EAAE,KAAK,EAAE,CAAC,CAAC,CAAC,CAAC,CAAC;SAC9D;IACH,CAAC;IAED,aAAa;;QACX,OAAO,MAAA,IAAI,CAAC,QAAQ,0CAAE,EAAE,CAAC;IAC3B,CAAC;IAGD,KAAK;QACH,IAAI,CAAC,QAAQ,CAAC,UAAU,CAAC,OAAO,CAAC,IAAI,CAAC,EAAE;YACtC,IAAI,CAAC,KAAK,EAAE,CAAC;QACf,CAAC,CAAC,CAAC;IACL,CAAC;IAED,MAAM,CAAC,CAAS;QACd,MAAM,QAAQ,GAAG,IAAI,CAAC,SAAS,CAAC;QAChC,IAAI,QAAQ,GAAG,CAAC,EAAE;YAEhB,IAAI,CAAC,KAAK,EAAE,CAAC;YACb,IAAI,CAAC,SAAS,GAAG,CAAC,CAAC;YACnB,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC;SAChB;QACD,MAAM,YAAY,GAAG,IAAI,GAAG,EAAc,CAAC;QAE3C,IAAI,aAAa,GAAG,CAAC,CAAC;QACtB,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,IAAI,CAAC,QAAQ,CAAC,MAAM,CAAC,MAAM,EAAE,CAAC,EAAE,EAAE;YACpD,MAAM,KAAK,GAAG,IAAI,CAAC,QAAQ,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC;YACtC,aAAa,IAAI,KAAK,CAAC,KAAK,CAAC;YAC7B,IAAI,aAAa,IAAI,CAAC,EAAE;gBACtB,KAAK,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC,EAAE,SAAS,EAAE,MAAM,EAAE,EAAE,EAAE;oBAC5C,MAAM,EAAE,SAAS,EAAE,EAAE,EAAE,GAAG,MAAM,CAAC;oBACjC,MAAM,SAAS,GAAG,EAAE,GAAG,aAAa,CAAC;oBACrC,IAAI,SAAS,GAAG,CAAC,EAAE;wBACjB,OAAO;qBACR;oBACD,YAAY,CAAC,GAAG,CAAC,SAAS,CAAC,CAAC;oBAE5B,IAAI,SAAS,GAAG,QAAQ,IAAI,SAAS,IAAI,CAAC,EAAE;wBAC1C,MAAM,EAAE,IAAI,EAAE,GAAG,SAAS,CAAC,IAAI,CAAC;wBAChC,IAAI,CAAC,gBAAgB,CAAC,QAAQ,CAAC,IAAI,EAAE,MAAM,CAAC,MAAM,EAAE,CAAC,SAAS,EAAE,EAAE,EAAE,MAAM,CAAC,CAAC,CAAC;qBAC9E;oBACD,SAAS,CAAC,IAAI,EAAE,CAAC;gBACnB,CAAC,CAAC,CAAC;aACJ;YACD,IAAI,SAAS,GAAG,CAAC,CAAC;YAClB,KAAK,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC,EAAE,MAAM,EAAE,EAAE,EAAE;gBACjC,MAAM,EAAE,SAAS,EAAE,QAAQ,EAAE,GAAG,MAAM,CAAC;gBACvC,SAAS,GAAG,IAAI,CAAC,GAAG,CAAC,SAAS,GAAG,QAAQ,EAAE,SAAS,CAAC,CAAC;YACxD,CAAC,CAAC,CAAC;YACH,aAAa,IAAI,SAAS,CAAC;SAI5B;QAMD,IAAI,CAAC,SAAS,GAAG,CAAC,CAAC;QACnB,IAAI,CAAC,OAAO,CAAC,QAAQ,EAAE,CAAC,MAAM,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC;QACzC,IAAI,CAAC,OAAO,CAAC,QAAQ,EAAE,CAAC,MAAM,EAAE,CAAC;IACnC,CAAC;IAED,IAAI;QACF,IAAI,CAAC,IAAI,CAAC,QAAQ,EAAE;YAClB,OAAO;SACR;QACD,IAAI,CAAC,OAAO,CAAC,IAAI,EAAE,CAAC;QACpB,IAAI,CAAC,SAAS,GAAG,CAAC,CAAC;QACnB,IAAI,CAAC,KAAK,EAAE,CAAC;QACb,IAAI,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC,CAAC,EAAE;YACrB,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,SAAS,GAAG,CAAC,CAAC,CAAC;QAClC,CAAC,CAAC,CAAC;IACL,CAAC;IAEK,aAAa,CAAC,UAAkB,EAAE,GAAW;;YA0BjD,OAAO,IAAI,CAAC;QACd,CAAC;KAAA;IAED,KAAK;QACH,IAAI,CAAC,OAAO,CAAC,IAAI,EAAE,CAAC;IACtB,CAAC;IAED,MAAM;QACJ,IAAI,CAAC,OAAO,CAAC,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC;IACrC,CAAC;IAED,OAAO;QACL,OAAO;IACT,CAAC;CACF;AA9KD,wBA8KC","file":"index.js","sourcesContent":["import { isNumber } from '@visactor/vutils';\nimport type { StoryCanvas } from '../canvas/canvas';\nimport type { IActSpec, IAction } from '../interface';\nimport type { IPlayer } from '../interface/player';\nimport { processorMap, ActionProcessor } from '../../dsl/story-processor';\n// import { Encoder } from './encode';\nimport type { ICharacter } from '../character';\n\nexport class Ticker {\n  cb?: (delta: number) => void;\n  rafIdx = 0;\n  start(cb: (t: number) => void) {\n    this.stop();\n    this.cb = cb;\n    this._tick(0);\n  }\n\n  _tick = (lt: number) => {\n    const ct = Date.now();\n    this.cb && this.cb(lt === 0 ? 0 : ct - lt);\n    this.rafIdx = requestAnimationFrame(() => this._tick(ct));\n  };\n\n  stop() {\n    this.rafIdx && cancelAnimationFrame(this.rafIdx);\n    this.rafIdx = 0;\n  }\n}\n\ntype IChapterInstanceItem = {\n  id: string;\n  scenes: Array<{\n    scene: {\n      character: ICharacter;\n      action: IAction;\n    }[];\n    delay: number;\n  }>;\n  characters: ICharacter[];\n};\n\nexport class Player implements IPlayer {\n  protected _canvas: StoryCanvas;\n  protected _acts: IChapterInstanceItem[];\n  protected _currAct: IChapterInstanceItem;\n  protected _ticker: Ticker;\n  protected _currTime: number;\n  // protected _encoder: Encoder;\n  protected _actionProcessor: ActionProcessor;\n\n  constructor(c: StoryCanvas, options?: { scaleX?: number; scaleY?: number }) {\n    this._canvas = c;\n    this._acts = [];\n    this._ticker = new Ticker();\n    this._currTime = 0;\n    c.getStage().defaultLayer.setAttributes({\n      scaleX: options?.scaleX ?? 1,\n      scaleY: options?.scaleY ?? 1\n    });\n    // this._encoder = new Encoder();\n    this._actionProcessor = new ActionProcessor(processorMap);\n  }\n\n  addAct(\n    c: IActSpec,\n    characters: {\n      [key: string]: ICharacter;\n    }\n  ): void {\n    const scenes: IChapterInstanceItem['scenes'] = [];\n    const characterSet: Set<ICharacter> = new Set();\n    c.scenes.forEach(item => {\n      const scene: IChapterInstanceItem['scenes'][0] = { scene: [], delay: item.delay ?? 0 };\n      item.actions.forEach(({ characterActions, characterId }) => {\n        const _actions = characterActions.slice();\n        _actions.sort((a, b) => a.startTime - b.startTime);\n        _actions.forEach(action => {\n          const character = characters[characterId];\n          scene.scene.push({\n            character,\n            action: action\n          });\n          characterSet.add(character);\n        });\n      });\n      scenes.push(scene);\n    });\n    this._acts.push({\n      id: c.id,\n      scenes: scenes,\n      characters: Array.from(characterSet.values())\n    });\n  }\n\n  setCurrentAct(id: number | string) {\n    if (isNumber(id)) {\n      this._currAct = this._acts[id];\n    } else {\n      this._currAct = this._acts.filter(item => item.id === id)[0];\n    }\n  }\n\n  getCurrentAct() {\n    return this._currAct?.id;\n  }\n\n  // 清除当前状态，一般用于回放操作\n  reset() {\n    this._currAct.characters.forEach(item => {\n      item.reset();\n    });\n  }\n\n  tickTo(t: number) {\n    const lastTime = this._currTime;\n    if (lastTime > t) {\n      // 如果时间回退，那就重新走一遍\n      this.reset();\n      this._currTime = 0;\n      this.tickTo(0);\n    }\n    const characterSet = new Set<ICharacter>();\n\n    let baseStartTime = 0;\n    for (let i = 0; i < this._currAct.scenes.length; i++) {\n      const scene = this._currAct.scenes[i];\n      baseStartTime += scene.delay;\n      if (baseStartTime <= t) {\n        scene.scene.forEach(({ character, action }) => {\n          const { startTime: st } = action;\n          const startTime = st + baseStartTime;\n          if (startTime > t) {\n            return;\n          }\n          characterSet.add(character);\n          // 之前没走过，现在走\n          if (startTime > lastTime && startTime <= t) {\n            const { type } = character.spec;\n            this._actionProcessor.doAction(type, action.action, [character, {}, action]);\n          }\n          character.show();\n        });\n      }\n      let sceneTime = 0;\n      scene.scene.forEach(({ action }) => {\n        const { startTime, duration } = action;\n        sceneTime = Math.max(startTime + duration, startTime);\n      });\n      baseStartTime += sceneTime;\n      // if (baseStartTime > t) {\n      //   break;\n      // }\n    }\n\n    // roleSet.forEach(r => {\n    //   r.tickTo && r.tickTo(t);\n    // });\n\n    this._currTime = t;\n    this._canvas.getStage().ticker.tickAt(t);\n    this._canvas.getStage().render();\n  }\n\n  play(): void {\n    if (!this._currAct) {\n      return;\n    }\n    this._ticker.stop();\n    this._currTime = 0;\n    this.reset();\n    this._ticker.start(t => {\n      this.tickTo(this._currTime + t);\n    });\n  }\n\n  async encodeToVideo(millsecond: number, fps: number): Promise<any> {\n    // // if (!this._currChapter) {\n    // //   return;\n    // // }\n    // const frameNum = (millsecond / 1000) * fps;\n    // const deltaT = 1000 / fps;\n    // this.tickTo(0);\n    // const objUrl = await this._encoder.exportVideo(frameNum, fps, async i => {\n    //   const t = deltaT * i;\n    //   this.tickTo(t);\n    //   return new Promise((resolve, reject) => {\n    //     this._canvas\n    //       .getStage()\n    //       .window.getContext()\n    //       .canvas.nativeCanvas.toBlob((blob: any) => {\n    //         if (blob) {\n    //           resolve(blob);\n    //         } else {\n    //           // console.log('no blob');\n    //           reject('no blob');\n    //         }\n    //       }, `image/png`);\n    //   });\n    // });\n\n    // return objUrl;\n    return null;\n  }\n\n  pause(): void {\n    this._ticker.stop();\n  }\n\n  resume(): void {\n    this._ticker._tick(this._currTime);\n  }\n\n  release(): void {\n    return;\n  }\n}\n"]}

package/cjs/story/story.js

@@ -41,7 +41,7 @@ class Story {
     constructor(spec, option) {
         this._characters = {}, this.id = "test-mvp_" + Story._id_++, this._canvas = new canvas_1.StoryCanvas(this, (0, 
         vutils_1.isString)(option.dom) ? document.getElementById(option.dom) : option.dom), 
-        this._player = new player_1.Player(this._canvas), spec && this.load(spec);
+        this._player = new player_1.Player(this._canvas, option.playerOption), spec && this.load(spec);
     }
     load(spec) {
         spec.characters.forEach((e => {

package/cjs/story/story.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/story/story.ts"],"names":[],"mappings":"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","file":"story.js","sourcesContent":["import type { ICharacterSpec } from './character/dsl-interface';\nimport { isString } from '@visactor/vutils';\nimport type { IStory, IStoryInitOption } from './interface/runtime-interface';\nimport type { ICharacter } from './character/runtime-interface';\nimport { StoryCanvas } from './canvas/canvas';\nimport type { IStorySpec, IActSpec } from './interface';\nimport { StoryFactory } from './factory/factory';\nimport { defaultTicker, defaultTimeline } from '@visactor/vrender';\nimport type { IPlayer } from './interface/player';\nimport { Player } from './player';\n\ndefaultTicker.remTimeline(defaultTimeline);\n\nexport class Story implements IStory {\n  static _id_ = 0;\n\n  protected _player: IPlayer;\n\n  readonly id: string;\n\n  protected _canvas: StoryCanvas;\n  get canvas() {\n    return this._canvas;\n  }\n\n  protected _characters: { [key: string]: ICharacter } = {};\n\n  constructor(spec: IStorySpec, option: IStoryInitOption) {\n    this.id = 'test-mvp_' + Story._id_++;\n    this._canvas = new StoryCanvas(\n      this,\n      isString(option.dom) ? (document.getElementById(option.dom) as HTMLDivElement) : option.dom\n    );\n    this._player = new Player(this._canvas);\n\n    if (spec) {\n      this.load(spec);\n    }\n  }\n\n  load(spec: IStorySpec) {\n    spec.characters.forEach(e => {\n      this._createCharacter(e);\n    });\n    // @ts-ignore\n    spec.acts.forEach(e => {\n      this._createAct(e);\n    });\n  }\n\n  getCharacters(): { [key: string]: ICharacter } {\n    return this._characters;\n  }\n\n  private _createCharacter(spec: ICharacterSpec) {\n    const option = { story: this, canvas: this._canvas, graphicParent: this._canvas.getStage().defaultLayer };\n    if ((<ICharacterSpec>spec).id) {\n      if (!this._characters[(<ICharacterSpec>spec).id]) {\n        this._characters[(<ICharacterSpec>spec).id] = StoryFactory.createCharacter(<ICharacterSpec>spec, option);\n      }\n      return this._characters[(<ICharacterSpec>spec).id];\n    }\n    //  else if ((<ICharacterLink>spec).characterId) {\n    //   return this._characters[(<ICharacterLink>spec).characterId];\n    // }\n    return null;\n  }\n\n  private _createAct(spec: IActSpec) {\n    this._player.addAct(spec, this._characters);\n  }\n\n  play(actIndex: string | number = 0) {\n    // player 开始播放\n    this._player.setCurrentAct(actIndex);\n    this._player.play();\n  }\n\n  pause() {\n    this._player.pause();\n    return this._player.getCurrentAct();\n  }\n\n  async encodeToVideo(actIndex: number, millsecond: number, fps: number) {\n    this._player.setCurrentAct(actIndex);\n    return this._player.encodeToVideo(millsecond, fps);\n  }\n\n  getPlayer() {\n    return this._player;\n  }\n\n  release() {\n    this._player.release();\n    this._canvas.release();\n  }\n}\n"]}
+{"version":3,"sources":["../src/story/story.ts"],"names":[],"mappings":"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","file":"story.js","sourcesContent":["import type { ICharacterSpec } from './character/dsl-interface';\nimport { isString } from '@visactor/vutils';\nimport type { IStory, IStoryInitOption } from './interface/runtime-interface';\nimport type { ICharacter } from './character/runtime-interface';\nimport { StoryCanvas } from './canvas/canvas';\nimport type { IStorySpec, IActSpec } from './interface';\nimport { StoryFactory } from './factory/factory';\nimport { defaultTicker, defaultTimeline } from '@visactor/vrender';\nimport type { IPlayer } from './interface/player';\nimport { Player } from './player';\n\ndefaultTicker.remTimeline(defaultTimeline);\n\nexport class Story implements IStory {\n  static _id_ = 0;\n\n  protected _player: IPlayer;\n\n  readonly id: string;\n\n  protected _canvas: StoryCanvas;\n  get canvas() {\n    return this._canvas;\n  }\n\n  protected _characters: { [key: string]: ICharacter } = {};\n\n  constructor(spec: IStorySpec, option: IStoryInitOption) {\n    this.id = 'test-mvp_' + Story._id_++;\n    this._canvas = new StoryCanvas(\n      this,\n      isString(option.dom) ? (document.getElementById(option.dom) as HTMLDivElement) : option.dom\n    );\n    this._player = new Player(this._canvas, option.playerOption);\n\n    if (spec) {\n      this.load(spec);\n    }\n  }\n\n  load(spec: IStorySpec) {\n    spec.characters.forEach(e => {\n      this._createCharacter(e);\n    });\n    // @ts-ignore\n    spec.acts.forEach(e => {\n      this._createAct(e);\n    });\n  }\n\n  getCharacters(): { [key: string]: ICharacter } {\n    return this._characters;\n  }\n\n  private _createCharacter(spec: ICharacterSpec) {\n    const option = { story: this, canvas: this._canvas, graphicParent: this._canvas.getStage().defaultLayer };\n    if ((<ICharacterSpec>spec).id) {\n      if (!this._characters[(<ICharacterSpec>spec).id]) {\n        this._characters[(<ICharacterSpec>spec).id] = StoryFactory.createCharacter(<ICharacterSpec>spec, option);\n      }\n      return this._characters[(<ICharacterSpec>spec).id];\n    }\n    //  else if ((<ICharacterLink>spec).characterId) {\n    //   return this._characters[(<ICharacterLink>spec).characterId];\n    // }\n    return null;\n  }\n\n  private _createAct(spec: IActSpec) {\n    this._player.addAct(spec, this._characters);\n  }\n\n  play(actIndex: string | number = 0) {\n    // player 开始播放\n    this._player.setCurrentAct(actIndex);\n    this._player.play();\n  }\n\n  pause() {\n    this._player.pause();\n    return this._player.getCurrentAct();\n  }\n\n  async encodeToVideo(actIndex: number, millsecond: number, fps: number) {\n    this._player.setCurrentAct(actIndex);\n    return this._player.encodeToVideo(millsecond, fps);\n  }\n\n  getPlayer() {\n    return this._player;\n  }\n\n  release() {\n    this._player.release();\n    this._canvas.release();\n  }\n}\n"]}

package/dist/index.js

@@ -51350,7 +51350,12 @@
                   break;
           }
       }
-      graphic.animate().to({ x: toX, y: toY }, duration, easing);
+      graphic
+          .animate()
+          .to({ x: toX, y: toY }, duration, easing)
+          .onEnd(() => {
+          graphic.setAttributes({ visible: false, visibleAll: false });
+      });
       return true;
   }
   const disappearEffectMap = {
@@ -51454,7 +51459,45 @@
       });
   });
 
+  const commonDisappearProcessor = (chartInstance, spec, action) => __awaiter(void 0, void 0, void 0, function* () {
+      const chart = chartInstance.getGraphicParent();
+      const vchart = chart === null || chart === void 0 ? void 0 : chart._vchart;
+      const instance = vchart ? vchart : chartInstance;
+      if (!instance) {
+          return;
+      }
+      lineDisappearProcessor(chartInstance, spec, action);
+      areaDisappearProcessor$1(chartInstance, spec, action);
+      axesDisappearProcessor(chartInstance);
+      graphicDisappearProcessor(chartInstance, spec, action);
+      chart.setAttributes({
+          visible: false
+      });
+  });
+  const commonDisappearByBaseOpacity = (chartInstance, spec, action) => {
+      var _a, _b, _c;
+      const chart = chartInstance.getGraphicParent();
+      const vchart = chart === null || chart === void 0 ? void 0 : chart._vchart;
+      const instance = vchart ? vchart : chartInstance;
+      if (!instance) {
+          return;
+      }
+      const duration = (_a = action.payload.animation) === null || _a === void 0 ? void 0 : _a.duration;
+      const easing = (_b = action.payload.animation) === null || _b === void 0 ? void 0 : _b.easing;
+      if ((_c = action.payload.fade) === null || _c === void 0 ? void 0 : _c.isBaseOpacity) {
+          chart.setAttributes({
+              baseOpacity: 1
+          });
+          chart.animate().to({ baseOpacity: 0 }, duration, easing);
+          return true;
+      }
+      return false;
+  };
+
   const barDisappearProcessor = (chartInstance, spec, action) => __awaiter(void 0, void 0, void 0, function* () {
+      if (commonDisappearByBaseOpacity(chartInstance, spec, action)) {
+          return;
+      }
       const chart = chartInstance.getGraphicParent();
       const vchart = chart === null || chart === void 0 ? void 0 : chart._vchart;
       const instance = vchart ? vchart : chartInstance;
@@ -51492,6 +51535,9 @@
 
   const pieDisappearProcessor = (chartInstance, spec, action) => __awaiter(void 0, void 0, void 0, function* () {
       var _a, _b, _c, _d;
+      if (commonDisappearByBaseOpacity(chartInstance, spec, action)) {
+          return;
+      }
       const chart = chartInstance.getGraphicParent();
       const vchart = chart === null || chart === void 0 ? void 0 : chart._vchart;
       const instance = vchart ? vchart : chartInstance;
@@ -51523,6 +51569,9 @@
 
   const areaDisappearProcessor = (chartInstance, spec, action) => __awaiter(void 0, void 0, void 0, function* () {
       var _a, _b, _c, _d;
+      if (commonDisappearByBaseOpacity(chartInstance, spec, action)) {
+          return;
+      }
       const chart = chartInstance.getGraphicParent();
       const vchart = chart === null || chart === void 0 ? void 0 : chart._vchart;
       const instance = vchart ? vchart : chartInstance;
@@ -51553,6 +51602,9 @@
   });
 
   const scatterDisappearProcessor = (chartInstance, spec, action) => __awaiter(void 0, void 0, void 0, function* () {
+      if (commonDisappearByBaseOpacity(chartInstance, spec, action)) {
+          return;
+      }
       const chart = chartInstance.getGraphicParent();
       const vchart = chart === null || chart === void 0 ? void 0 : chart._vchart;
       const instance = vchart ? vchart : chartInstance;
@@ -51592,6 +51644,9 @@
 
   const radarDisappearProcessor = (chartInstance, spec, action) => __awaiter(void 0, void 0, void 0, function* () {
       var _a, _b, _c, _d;
+      if (commonDisappearByBaseOpacity(chartInstance, spec, action)) {
+          return;
+      }
       const chart = chartInstance.getGraphicParent();
       const vchart = chart === null || chart === void 0 ? void 0 : chart._vchart;
       const instance = vchart ? vchart : chartInstance;
@@ -51624,6 +51679,9 @@
   });
 
   const wordCloudDisappearProcessor = (chartInstance, spec, action) => __awaiter(void 0, void 0, void 0, function* () {
+      if (commonDisappearByBaseOpacity(chartInstance, spec, action)) {
+          return;
+      }
       const chart = chartInstance.getGraphicParent();
       const vchart = chart === null || chart === void 0 ? void 0 : chart._vchart;
       const instance = vchart ? vchart : chartInstance;
@@ -51655,6 +51713,9 @@
 
   const treeMapDisappearProcessor = (chartInstance, spec, action) => __awaiter(void 0, void 0, void 0, function* () {
       var _a, _b, _c, _d;
+      if (commonDisappearByBaseOpacity(chartInstance, spec, action)) {
+          return;
+      }
       const chart = chartInstance.getGraphicParent();
       const vchart = chart === null || chart === void 0 ? void 0 : chart._vchart;
       const instance = vchart ? vchart : chartInstance;
@@ -51686,6 +51747,9 @@
 
   const sunburstDisappearProcessor = (chartInstance, spec, action) => __awaiter(void 0, void 0, void 0, function* () {
       var _a, _b, _c, _d;
+      if (commonDisappearByBaseOpacity(chartInstance, spec, action)) {
+          return;
+      }
       const chart = chartInstance.getGraphicParent();
       const vchart = chart === null || chart === void 0 ? void 0 : chart._vchart;
       const instance = vchart ? vchart : chartInstance;
@@ -51715,22 +51779,6 @@
       graphicAppearProcessor(chartInstance, spec, action);
   });
 
-  const commonDisappearProcessor = (chartInstance, spec, action) => __awaiter(void 0, void 0, void 0, function* () {
-      const chart = chartInstance.getGraphicParent();
-      const vchart = chart === null || chart === void 0 ? void 0 : chart._vchart;
-      const instance = vchart ? vchart : chartInstance;
-      if (!instance) {
-          return;
-      }
-      lineDisappearProcessor(chartInstance, spec, action);
-      areaDisappearProcessor$1(chartInstance, spec, action);
-      axesDisappearProcessor(chartInstance);
-      graphicDisappearProcessor(chartInstance, spec, action);
-      chart.setAttributes({
-          visible: false
-      });
-  });
-
   const flickerEffect = (group) => {
       if (!group || group.childrenCount === 0) {
           return;
@@ -52468,6 +52516,9 @@
 
   const roseDisappearProcessor = (chartInstance, spec, action) => __awaiter(void 0, void 0, void 0, function* () {
       var _a, _b, _c, _d;
+      if (commonDisappearByBaseOpacity(chartInstance, spec, action)) {
+          return;
+      }
       const chart = chartInstance.getGraphicParent();
       const vchart = chart === null || chart === void 0 ? void 0 : chart._vchart;
       const instance = vchart ? vchart : chartInstance;
@@ -52652,11 +52703,16 @@
       }
   }
   class Player {
-      constructor(c) {
+      constructor(c, options) {
+          var _a, _b;
           this._canvas = c;
           this._acts = [];
           this._ticker = new Ticker();
           this._currTime = 0;
+          c.getStage().defaultLayer.setAttributes({
+              scaleX: (_a = options === null || options === void 0 ? void 0 : options.scaleX) !== null && _a !== void 0 ? _a : 1,
+              scaleY: (_b = options === null || options === void 0 ? void 0 : options.scaleY) !== null && _b !== void 0 ? _b : 1
+          });
           this._actionProcessor = new ActionProcessor(processorMap);
       }
       addAct(c, characters) {
@@ -52776,7 +52832,7 @@
           this._characters = {};
           this.id = 'test-mvp_' + Story._id_++;
           this._canvas = new StoryCanvas(this, isString$1(option.dom) ? document.getElementById(option.dom) : option.dom);
-          this._player = new Player(this._canvas);
+          this._player = new Player(this._canvas, option.playerOption);
           if (spec) {
               this.load(spec);
           }