@visactor/vstory 0.0.4-alpha.2 → 0.0.5-alpha.0

package/cjs/player/processor/processorMap.js

@@ -4,31 +4,71 @@ Object.defineProperty(exports, "__esModule", {
     value: !0
 }), exports.processorMap = exports.processorComponentMap = exports.processorChartMap = void 0;
 
-const action_1 = require("../../constants/action"), character_1 = require("../../constants/character"), image_appear_1 = require("./component/image/image-appear"), vchart_1 = require("./chart/vchart"), line_appear_1 = require("./component/line/line-appear"), rect_appear_1 = require("./component/rect/rect-appear"), shape_appear_1 = require("./component/shape/shape-appear"), text_appear_1 = require("./component/text/text-appear"), timeline_appear_1 = require("./component/timeline/timeline-appear");
+const action_1 = require("../../constants/action"), character_1 = require("../../constants/character"), image_visibility_1 = require("./component/image/image-visibility"), vchart_1 = require("./chart/vchart"), line_visibility_1 = require("./component/line/line-visibility"), rect_visibility_1 = require("./component/rect/rect-visibility"), shape_visibility_1 = require("./component/shape/shape-visibility"), text_visibility_1 = require("./component/text/text-visibility"), timeline_visibility_1 = require("./component/timeline/timeline-visibility"), common_component_1 = require("./component/common-component"), rankingBar_1 = require("./chart/rankingBar/rankingBar");
 
 exports.processorChartMap = {
     VChart: {
         [action_1.ACTION_TYPE.APPEAR]: new vchart_1.VChartVisibilityActionProcessor,
-        [action_1.ACTION_TYPE.DISAPPEAR]: new vchart_1.VChartVisibilityActionProcessor
+        [action_1.ACTION_TYPE.DISAPPEAR]: new vchart_1.VChartVisibilityActionProcessor,
+        [action_1.ACTION_TYPE.BOUNCE]: new common_component_1.CommonBounceActionProcessor,
+        [action_1.VCHART_ACTION_TYPE.UPDATE]: new vchart_1.VChartUpdateActionProcessor,
+        [action_1.VCHART_ACTION_TYPE.ADD]: new vchart_1.VChartAddActionProcessor
+    },
+    RankingBar: {
+        [action_1.ACTION_TYPE.APPEAR]: new vchart_1.VChartVisibilityActionProcessor,
+        [action_1.ACTION_TYPE.DISAPPEAR]: new vchart_1.VChartVisibilityActionProcessor,
+        [action_1.ACTION_TYPE.BOUNCE]: new common_component_1.CommonBounceActionProcessor,
+        play: new rankingBar_1.RankingBarPlayActionProcessor
     }
 }, exports.processorComponentMap = {
     [character_1.StoryComponentType.RECT]: {
-        [action_1.ACTION_TYPE.APPEAR]: new rect_appear_1.RectAppearActionProcessor
+        [action_1.ACTION_TYPE.APPEAR]: new rect_visibility_1.RectVisibilityActionProcessor,
+        [action_1.ACTION_TYPE.DISAPPEAR]: new rect_visibility_1.RectVisibilityActionProcessor,
+        [action_1.ACTION_TYPE.STYLE]: new common_component_1.CommonStyleActionProcessor,
+        [action_1.ACTION_TYPE.MOVETO]: new common_component_1.CommonMoveToActionProcessor,
+        [action_1.ACTION_TYPE.SCALETO]: new common_component_1.CommonScaleToActionProcessor,
+        [action_1.ACTION_TYPE.BOUNCE]: new common_component_1.CommonBounceActionProcessor
     },
     [character_1.StoryComponentType.LINE]: {
-        [action_1.ACTION_TYPE.APPEAR]: new line_appear_1.LineAppearActionProcessor
+        [action_1.ACTION_TYPE.APPEAR]: new line_visibility_1.LineVisibilityActionProcessor,
+        [action_1.ACTION_TYPE.DISAPPEAR]: new line_visibility_1.LineVisibilityActionProcessor,
+        [action_1.ACTION_TYPE.STYLE]: new common_component_1.CommonStyleActionProcessor,
+        [action_1.ACTION_TYPE.MOVETO]: new common_component_1.CommonMoveToActionProcessor,
+        [action_1.ACTION_TYPE.SCALETO]: new common_component_1.CommonScaleToActionProcessor,
+        [action_1.ACTION_TYPE.BOUNCE]: new common_component_1.CommonBounceActionProcessor
     },
     [character_1.StoryComponentType.SHAPE]: {
-        [action_1.ACTION_TYPE.APPEAR]: new shape_appear_1.ShapeAppearActionProcessor
+        [action_1.ACTION_TYPE.APPEAR]: new shape_visibility_1.ShapeVisibilityActionProcessor,
+        [action_1.ACTION_TYPE.DISAPPEAR]: new shape_visibility_1.ShapeVisibilityActionProcessor,
+        [action_1.ACTION_TYPE.STYLE]: new common_component_1.CommonStyleActionProcessor,
+        [action_1.ACTION_TYPE.MOVETO]: new common_component_1.CommonMoveToActionProcessor,
+        [action_1.ACTION_TYPE.SCALETO]: new common_component_1.CommonScaleToActionProcessor,
+        [action_1.ACTION_TYPE.BOUNCE]: new common_component_1.CommonBounceActionProcessor
     },
     [character_1.StoryComponentType.IMAGE]: {
-        [action_1.ACTION_TYPE.APPEAR]: new image_appear_1.ImageAppearActionProcessor
+        [action_1.ACTION_TYPE.APPEAR]: new image_visibility_1.ImageVisibilityActionProcessor,
+        [action_1.ACTION_TYPE.DISAPPEAR]: new image_visibility_1.ImageVisibilityActionProcessor,
+        [action_1.ACTION_TYPE.STYLE]: new common_component_1.CommonStyleActionProcessor,
+        [action_1.ACTION_TYPE.MOVETO]: new common_component_1.CommonMoveToActionProcessor,
+        [action_1.ACTION_TYPE.SCALETO]: new common_component_1.CommonScaleToActionProcessor,
+        [action_1.ACTION_TYPE.BOUNCE]: new common_component_1.CommonBounceActionProcessor
     },
     [character_1.StoryComponentType.TEXT]: {
-        [action_1.ACTION_TYPE.APPEAR]: new text_appear_1.TextAppearActionProcessor
+        [action_1.ACTION_TYPE.APPEAR]: new text_visibility_1.TextVisibilityActionProcessor,
+        [action_1.ACTION_TYPE.DISAPPEAR]: new text_visibility_1.TextVisibilityActionProcessor,
+        [action_1.ACTION_TYPE.STYLE]: new common_component_1.CommonStyleActionProcessor,
+        [action_1.ACTION_TYPE.MOVETO]: new common_component_1.CommonMoveToActionProcessor,
+        [action_1.ACTION_TYPE.SCALETO]: new common_component_1.CommonScaleToActionProcessor,
+        [action_1.ACTION_TYPE.BOUNCE]: new common_component_1.CommonBounceActionProcessor
     },
     [character_1.StoryComponentType.TIMELINE]: {
-        [action_1.ACTION_TYPE.APPEAR]: new timeline_appear_1.TimelineAppearActionProcessor
+        [action_1.ACTION_TYPE.APPEAR]: new timeline_visibility_1.TimelineVisibilityActionProcessor,
+        [action_1.ACTION_TYPE.DISAPPEAR]: new timeline_visibility_1.TimelineVisibilityActionProcessor,
+        [action_1.ACTION_TYPE.STYLE]: new common_component_1.CommonStyleActionProcessor,
+        [action_1.ACTION_TYPE.MOVETO]: new common_component_1.CommonMoveToActionProcessor,
+        [action_1.ACTION_TYPE.SCALETO]: new common_component_1.CommonScaleToActionProcessor,
+        [action_1.ACTION_TYPE.STATE]: new timeline_visibility_1.TimelineStateActionProcessor,
+        [action_1.ACTION_TYPE.BOUNCE]: new common_component_1.CommonBounceActionProcessor
     }
 }, exports.processorMap = Object.assign(Object.assign({}, exports.processorChartMap), exports.processorComponentMap);
 //# sourceMappingURL=processorMap.js.map

package/cjs/player/processor/processorMap.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/player/processor/processorMap.ts"],"names":[],"mappings":";;;AAAA,mDAAqD;AACrD,yDAA+E;AAC/E,iEAA4E;AAC5E,2CAAiE;AACjE,8DAAyE;AACzE,8DAAyE;AACzE,iEAA4E;AAC5E,8DAAyE;AACzE,0EAAqF;AAExE,QAAA,iBAAiB,GAAG;IAC/B,UAAuB,EAAE;QACvB,CAAC,oBAAW,CAAC,MAAM,CAAC,EAAE,IAAI,wCAA+B,EAAE;QAC3D,CAAC,oBAAW,CAAC,SAAS,CAAC,EAAE,IAAI,wCAA+B,EAAE;KAC/D;CACF,CAAC;AAEW,QAAA,qBAAqB,GAAG;IACnC,CAAC,8BAAkB,CAAC,IAAI,CAAC,EAAE;QACzB,CAAC,oBAAW,CAAC,MAAM,CAAC,EAAE,IAAI,uCAAyB,EAAE;KACtD;IACD,CAAC,8BAAkB,CAAC,IAAI,CAAC,EAAE;QACzB,CAAC,oBAAW,CAAC,MAAM,CAAC,EAAE,IAAI,uCAAyB,EAAE;KACtD;IACD,CAAC,8BAAkB,CAAC,KAAK,CAAC,EAAE;QAC1B,CAAC,oBAAW,CAAC,MAAM,CAAC,EAAE,IAAI,yCAA0B,EAAE;KACvD;IACD,CAAC,8BAAkB,CAAC,KAAK,CAAC,EAAE;QAC1B,CAAC,oBAAW,CAAC,MAAM,CAAC,EAAE,IAAI,yCAA0B,EAAE;KACvD;IACD,CAAC,8BAAkB,CAAC,IAAI,CAAC,EAAE;QACzB,CAAC,oBAAW,CAAC,MAAM,CAAC,EAAE,IAAI,uCAAyB,EAAE;KACtD;IACD,CAAC,8BAAkB,CAAC,QAAQ,CAAC,EAAE;QAC7B,CAAC,oBAAW,CAAC,MAAM,CAAC,EAAE,IAAI,+CAA6B,EAAE;KAC1D;CACF,CAAC;AAEW,QAAA,YAAY,mCACpB,yBAAiB,GACjB,6BAAqB,EACxB","file":"processorMap.js","sourcesContent":["import { ACTION_TYPE } from '../../constants/action';\nimport { StoryChartType, StoryComponentType } from '../../constants/character';\nimport { ImageAppearActionProcessor } from './component/image/image-appear';\nimport { VChartVisibilityActionProcessor } from './chart/vchart';\nimport { LineAppearActionProcessor } from './component/line/line-appear';\nimport { RectAppearActionProcessor } from './component/rect/rect-appear';\nimport { ShapeAppearActionProcessor } from './component/shape/shape-appear';\nimport { TextAppearActionProcessor } from './component/text/text-appear';\nimport { TimelineAppearActionProcessor } from './component/timeline/timeline-appear';\n\nexport const processorChartMap = {\n  [StoryChartType.VCHART]: {\n    [ACTION_TYPE.APPEAR]: new VChartVisibilityActionProcessor(),\n    [ACTION_TYPE.DISAPPEAR]: new VChartVisibilityActionProcessor()\n  }\n};\n\nexport const processorComponentMap = {\n  [StoryComponentType.RECT]: {\n    [ACTION_TYPE.APPEAR]: new RectAppearActionProcessor()\n  },\n  [StoryComponentType.LINE]: {\n    [ACTION_TYPE.APPEAR]: new LineAppearActionProcessor()\n  },\n  [StoryComponentType.SHAPE]: {\n    [ACTION_TYPE.APPEAR]: new ShapeAppearActionProcessor()\n  },\n  [StoryComponentType.IMAGE]: {\n    [ACTION_TYPE.APPEAR]: new ImageAppearActionProcessor()\n  },\n  [StoryComponentType.TEXT]: {\n    [ACTION_TYPE.APPEAR]: new TextAppearActionProcessor()\n  },\n  [StoryComponentType.TIMELINE]: {\n    [ACTION_TYPE.APPEAR]: new TimelineAppearActionProcessor()\n  }\n};\n\nexport const processorMap = {\n  ...processorChartMap,\n  ...processorComponentMap\n};\n"]}
+{"version":3,"sources":["../src/player/processor/processorMap.ts"],"names":[],"mappings":"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","file":"processorMap.js","sourcesContent":["import { ACTION_TYPE, VCHART_ACTION_TYPE } from '../../constants/action';\nimport { StoryChartType, StoryComponentType } from '../../constants/character';\nimport { ImageVisibilityActionProcessor } from './component/image/image-visibility';\nimport { VChartAddActionProcessor, VChartUpdateActionProcessor, VChartVisibilityActionProcessor } from './chart/vchart';\nimport { LineVisibilityActionProcessor } from './component/line/line-visibility';\nimport { RectVisibilityActionProcessor } from './component/rect/rect-visibility';\nimport { ShapeVisibilityActionProcessor } from './component/shape/shape-visibility';\nimport { TextVisibilityActionProcessor } from './component/text/text-visibility';\nimport {\n  TimelineStateActionProcessor,\n  TimelineVisibilityActionProcessor\n} from './component/timeline/timeline-visibility';\nimport {\n  CommonBounceActionProcessor,\n  CommonMoveToActionProcessor,\n  CommonScaleToActionProcessor,\n  CommonStyleActionProcessor\n} from './component/common-component';\nimport { RankingBarPlayActionProcessor } from './chart/rankingBar/rankingBar';\n\nexport const processorChartMap = {\n  [StoryChartType.VCHART]: {\n    [ACTION_TYPE.APPEAR]: new VChartVisibilityActionProcessor(),\n    [ACTION_TYPE.DISAPPEAR]: new VChartVisibilityActionProcessor(),\n    [ACTION_TYPE.BOUNCE]: new CommonBounceActionProcessor(),\n    [VCHART_ACTION_TYPE.UPDATE]: new VChartUpdateActionProcessor(),\n    [VCHART_ACTION_TYPE.ADD]: new VChartAddActionProcessor()\n  },\n  [StoryChartType.RANKINGBAR]: {\n    [ACTION_TYPE.APPEAR]: new VChartVisibilityActionProcessor(),\n    [ACTION_TYPE.DISAPPEAR]: new VChartVisibilityActionProcessor(),\n    [ACTION_TYPE.BOUNCE]: new CommonBounceActionProcessor(),\n    play: new RankingBarPlayActionProcessor()\n  }\n};\n\nexport const processorComponentMap = {\n  [StoryComponentType.RECT]: {\n    [ACTION_TYPE.APPEAR]: new RectVisibilityActionProcessor(),\n    [ACTION_TYPE.DISAPPEAR]: new RectVisibilityActionProcessor(),\n    [ACTION_TYPE.STYLE]: new CommonStyleActionProcessor(),\n    [ACTION_TYPE.MOVETO]: new CommonMoveToActionProcessor(),\n    [ACTION_TYPE.SCALETO]: new CommonScaleToActionProcessor(),\n    [ACTION_TYPE.BOUNCE]: new CommonBounceActionProcessor()\n  },\n  [StoryComponentType.LINE]: {\n    [ACTION_TYPE.APPEAR]: new LineVisibilityActionProcessor(),\n    [ACTION_TYPE.DISAPPEAR]: new LineVisibilityActionProcessor(),\n    [ACTION_TYPE.STYLE]: new CommonStyleActionProcessor(),\n    [ACTION_TYPE.MOVETO]: new CommonMoveToActionProcessor(),\n    [ACTION_TYPE.SCALETO]: new CommonScaleToActionProcessor(),\n    [ACTION_TYPE.BOUNCE]: new CommonBounceActionProcessor()\n  },\n  [StoryComponentType.SHAPE]: {\n    [ACTION_TYPE.APPEAR]: new ShapeVisibilityActionProcessor(),\n    [ACTION_TYPE.DISAPPEAR]: new ShapeVisibilityActionProcessor(),\n    [ACTION_TYPE.STYLE]: new CommonStyleActionProcessor(),\n    [ACTION_TYPE.MOVETO]: new CommonMoveToActionProcessor(),\n    [ACTION_TYPE.SCALETO]: new CommonScaleToActionProcessor(),\n    [ACTION_TYPE.BOUNCE]: new CommonBounceActionProcessor()\n  },\n  [StoryComponentType.IMAGE]: {\n    [ACTION_TYPE.APPEAR]: new ImageVisibilityActionProcessor(),\n    [ACTION_TYPE.DISAPPEAR]: new ImageVisibilityActionProcessor(),\n    [ACTION_TYPE.STYLE]: new CommonStyleActionProcessor(),\n    [ACTION_TYPE.MOVETO]: new CommonMoveToActionProcessor(),\n    [ACTION_TYPE.SCALETO]: new CommonScaleToActionProcessor(),\n    [ACTION_TYPE.BOUNCE]: new CommonBounceActionProcessor()\n  },\n  [StoryComponentType.TEXT]: {\n    [ACTION_TYPE.APPEAR]: new TextVisibilityActionProcessor(),\n    [ACTION_TYPE.DISAPPEAR]: new TextVisibilityActionProcessor(),\n    [ACTION_TYPE.STYLE]: new CommonStyleActionProcessor(),\n    [ACTION_TYPE.MOVETO]: new CommonMoveToActionProcessor(),\n    [ACTION_TYPE.SCALETO]: new CommonScaleToActionProcessor(),\n    [ACTION_TYPE.BOUNCE]: new CommonBounceActionProcessor()\n  },\n  [StoryComponentType.TIMELINE]: {\n    [ACTION_TYPE.APPEAR]: new TimelineVisibilityActionProcessor(),\n    [ACTION_TYPE.DISAPPEAR]: new TimelineVisibilityActionProcessor(),\n    [ACTION_TYPE.STYLE]: new CommonStyleActionProcessor(),\n    [ACTION_TYPE.MOVETO]: new CommonMoveToActionProcessor(),\n    [ACTION_TYPE.SCALETO]: new CommonScaleToActionProcessor(),\n    [ACTION_TYPE.STATE]: new TimelineStateActionProcessor(),\n    [ACTION_TYPE.BOUNCE]: new CommonBounceActionProcessor()\n  }\n};\n\nexport const processorMap = {\n  ...processorChartMap,\n  ...processorComponentMap\n};\n"]}

package/cjs/player/scheduler.d.ts

@@ -1,4 +1,4 @@
-import type { IAction, IActSpec, ISceneSpec } from '../story/interface';
+import type { IActionSpec, IActSpec, ISceneSpec } from '../story/interface';
 import type { IActionProcessor } from './processor/interface/action-processor';
 import type { IScheduler } from './interface/scheduler';
 interface IActInfo {
@@ -16,7 +16,7 @@ interface ISceneInfo {
 export interface IActionItem {
     startTime: number;
     duration: number;
-    actionSpec: IAction;
+    actionSpec: IActionSpec;
     characterId: string;
 }
 export declare class Scheduler implements IScheduler {
@@ -24,6 +24,7 @@ export declare class Scheduler implements IScheduler {
     protected _actsInfo: IActInfo[];
     protected _runnedAct: Set<IActionItem>;
     constructor(actionProcessor: IActionProcessor);
+    init(acts: IActSpec[]): void;
     clearState(): void;
     getTotalTime(): number;
     findActByTime(t: number): {
@@ -31,7 +32,7 @@ export declare class Scheduler implements IScheduler {
         t: number;
     };
     getActionsInRange(fromTime: number, toTime: number): IActionItem[];
-    initActs(acts: IActSpec[]): void;
+    protected initActs(acts: IActSpec[]): void;
     protected _getActInfo(act: IActSpec, actStartTime: number): IActInfo;
     protected _getSceneInfo(scene: ISceneSpec, sceneStartTime: number): ISceneInfo;
 }

package/cjs/player/scheduler.js

@@ -4,6 +4,8 @@ Object.defineProperty(exports, "__esModule", {
     value: !0
 }), exports.Scheduler = void 0;
 
+const vutils_1 = require("@visactor/vutils");
+
 class ActionItem {
     constructor(st, d, as, ci) {
         this.startTime = st, this.duration = d, this.actionSpec = as, this.characterId = ci;
@@ -14,6 +16,9 @@ class Scheduler {
     constructor(actionProcessor) {
         this._actionProcessor = actionProcessor, this._runnedAct = new Set;
     }
+    init(acts) {
+        this.clearState(), this.initActs(acts);
+    }
     clearState() {
         this._runnedAct.clear();
     }
@@ -58,9 +63,8 @@ class Scheduler {
         let sceneStartTime = 0;
         const sceneInfoList = act.scenes.map((scene => {
             var _a;
-            const sceneInfo = this._getSceneInfo(scene, sceneStartTime);
-            return sceneStartTime = sceneInfo.startTime + (null !== (_a = scene.delay) && void 0 !== _a ? _a : 0) + sceneInfo.duration, 
-            sceneInfo;
+            const sceneInfo = this._getSceneInfo(scene, sceneStartTime + (null !== (_a = scene.delay) && void 0 !== _a ? _a : 0));
+            return sceneStartTime = sceneInfo.startTime + sceneInfo.duration, sceneInfo;
         })), startTime = sceneInfoList.reduce(((st, info) => Math.min(info.startTime, st)), 0);
         return {
             startTime: actStartTime,
@@ -75,17 +79,19 @@ class Scheduler {
         scene.actions.forEach(((action, actIdx) => {
             let character_st = 1 / 0, character_et = -1 / 0;
             action.characterActions.forEach((ca => {
-                const info = this._actionProcessor.getActInfo(action.characterId, ca);
-                if (!info) return;
-                const item = new ActionItem(info.startTime, info.duration, ca, action.characterId);
-                character_st = Math.max(Math.min(item.startTime, character_st), 0), character_et = Math.max(item.startTime + item.duration, character_et), 
-                actionList.push(item);
+                ((0, vutils_1.isString)(action.characterId) ? [ action.characterId ] : action.characterId).forEach((characterId => {
+                    const info = this._actionProcessor.getActInfo(characterId, ca);
+                    if (!info) return;
+                    const item = new ActionItem(info.startTime, info.duration, ca, characterId);
+                    character_st = Math.max(Math.min(item.startTime, character_st), 0), character_et = Math.max(item.startTime + item.duration, character_et), 
+                    actionList.push(item);
+                }));
             })), scene_st = actIdx ? Math.max(Math.min(character_st, scene_st), 0) : character_st, 
             scene_et = actIdx ? Math.max(character_et, scene_et) : character_et;
         }));
         return {
-            startTime: sceneStartTime + scene_st,
-            duration: sceneStartTime + scene_et - scene_st,
+            startTime: sceneStartTime,
+            duration: scene_et,
             id: scene.id,
             actionList: actionList
         };

package/cjs/player/scheduler.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/player/scheduler.ts"],"names":[],"mappings":"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","file":"scheduler.js","sourcesContent":["import { isNumber } from '@visactor/vutils';\nimport type { IAction, IActSpec, ISceneSpec } from '../story/interface';\nimport { IStory } from '../story/interface';\nimport type { IActionProcessor } from './processor/interface/action-processor';\nimport type { IScheduler } from './interface/scheduler';\n\ninterface IActInfo {\n  startTime: number;\n  duration: number;\n  id: string;\n  sceneInfoList: ISceneInfo[];\n}\ninterface ISceneInfo {\n  startTime: number;\n  duration: number;\n  id: string;\n  actionList: IActionItem[];\n}\n\nexport interface IActionItem {\n  startTime: number;\n  duration: number;\n  actionSpec: IAction;\n  characterId: string;\n}\n\nclass ActionItem implements IActionItem {\n  startTime: number;\n  duration: number;\n  actionSpec: IAction;\n  characterId: string;\n\n  constructor(st: number, d: number, as: IAction, ci: string) {\n    this.startTime = st;\n    this.duration = d;\n    this.actionSpec = as;\n    this.characterId = ci;\n  }\n}\n\nexport class Scheduler implements IScheduler {\n  protected _actionProcessor: IActionProcessor;\n  protected _actsInfo: IActInfo[];\n  protected _runnedAct: Set<IActionItem>;\n\n  constructor(actionProcessor: IActionProcessor) {\n    this._actionProcessor = actionProcessor;\n    this._runnedAct = new Set();\n  }\n\n  clearState(): void {\n    this._runnedAct.clear();\n  }\n\n  getTotalTime(): number {\n    return this._actsInfo.reduce((t, actInfo) => Math.max(t, actInfo.startTime + actInfo.duration), 0);\n  }\n\n  findActByTime(t: number) {\n    // 规范化t\n    const totalTime = this.getTotalTime();\n    if (totalTime <= 0) {\n      return {\n        actInfo: this._actsInfo[0],\n        t: 0\n      };\n    }\n    for (let i = 0; i < this._actsInfo.length; i++) {\n      const actInfo = this._actsInfo[i];\n      if (actInfo.startTime <= t && actInfo.startTime + actInfo.duration > t) {\n        return {\n          actInfo: actInfo,\n          t: t - actInfo.startTime\n        };\n      }\n    }\n    return {\n      actInfo: this._actsInfo[this._actsInfo.length - 1],\n      t: t - this._actsInfo[this._actsInfo.length - 1].startTime\n    };\n  }\n\n  /**\n   * 获取某个时间区间的所有Action，toTime实际上是当前时间，fromTime是上一次的时间\n   * 避免跳帧\n   * @param fromTime 上一次的时间\n   * @param toTime 当前时间\n   */\n  getActionsInRange(fromTime: number, toTime: number) {\n    // 先找到目前是在哪个幕中\n    const { actInfo: fromAct, t: formatFromTime } = this.findActByTime(fromTime);\n    const { actInfo: toAct, t: formatToTime } = this.findActByTime(toTime);\n    if (fromAct !== toAct) {\n      // TODO 跳帧了\n    }\n    // const formatFromTime = Scheduler.formatTimeInAction(fromTime, toAct);\n    // const formatToTime = Scheduler.formatTimeInAction(toTime, toAct);\n\n    const actions: IActionItem[] = [];\n    toAct.sceneInfoList.forEach(sceneInfo => {\n      const { startTime: sceneStartTime } = sceneInfo;\n      sceneInfo.actionList.forEach(actionInfo => {\n        const startTime = sceneStartTime + actionInfo.startTime;\n        if (startTime <= formatToTime) {\n          if (!this._runnedAct.has(actionInfo)) {\n            this._runnedAct.add(actionInfo);\n            actions.push(actionInfo);\n          }\n        }\n      });\n    });\n    return actions;\n  }\n\n  initActs(acts: IActSpec[]) {\n    // act与act之间是串联的\n    let startTime = 0;\n    this._actsInfo = acts.map(act => {\n      const actInfo = this._getActInfo(act, startTime);\n      startTime += actInfo.duration;\n      return actInfo;\n    });\n  }\n\n  protected _getActInfo(act: IActSpec, actStartTime: number): IActInfo {\n    let sceneStartTime = 0;\n    const sceneInfoList = act.scenes.map(scene => {\n      const sceneInfo = this._getSceneInfo(scene, sceneStartTime);\n      sceneStartTime = sceneInfo.startTime + (scene.delay ?? 0) + sceneInfo.duration;\n      return sceneInfo;\n    });\n    const startTime = sceneInfoList.reduce((st, info) => Math.min(info.startTime, st), 0);\n    const endTime = sceneInfoList.reduce((et, info) => Math.max(info.startTime + info.duration, et), 0);\n    return {\n      startTime: actStartTime,\n      duration: startTime + endTime - startTime,\n      id: act.id,\n      sceneInfoList\n    };\n  }\n\n  protected _getSceneInfo(scene: ISceneSpec, sceneStartTime: number): ISceneInfo {\n    let scene_st = 0;\n    let scene_et = 0;\n    const actionList: IActionItem[] = [];\n    scene.actions.forEach((action, actIdx) => {\n      let character_st = Infinity;\n      let character_et = -Infinity;\n      action.characterActions.forEach(ca => {\n        const info = this._actionProcessor.getActInfo(action.characterId, ca);\n        if (!info) {\n          return;\n        }\n        const item = new ActionItem(info.startTime, info.duration, ca, action.characterId);\n\n        character_st = Math.max(Math.min(item.startTime, character_st), 0);\n        character_et = Math.max(item.startTime + item.duration, character_et);\n        actionList.push(item);\n      });\n\n      scene_st = !actIdx ? character_st : Math.max(Math.min(character_st, scene_st), 0);\n      scene_et = !actIdx ? character_et : Math.max(character_et, scene_et);\n    });\n\n    const sceneInfo: ISceneInfo = {\n      startTime: sceneStartTime + scene_st,\n      duration: sceneStartTime + scene_et - scene_st,\n      id: scene.id,\n      actionList\n    };\n\n    return sceneInfo;\n  }\n}\n"]}
+{"version":3,"sources":["../src/player/scheduler.ts"],"names":[],"mappings":"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","file":"scheduler.js","sourcesContent":["import { isNumber, isString } from '@visactor/vutils';\nimport type { IActionSpec, IActSpec, ISceneSpec } from '../story/interface';\nimport { IStory } from '../story/interface';\nimport type { IActionProcessor } from './processor/interface/action-processor';\nimport type { IScheduler } from './interface/scheduler';\n\ninterface IActInfo {\n  startTime: number;\n  duration: number;\n  id: string;\n  sceneInfoList: ISceneInfo[];\n}\ninterface ISceneInfo {\n  startTime: number;\n  duration: number;\n  id: string;\n  actionList: IActionItem[];\n}\n\nexport interface IActionItem {\n  startTime: number;\n  duration: number;\n  actionSpec: IActionSpec;\n  characterId: string;\n}\n\nclass ActionItem implements IActionItem {\n  startTime: number;\n  duration: number;\n  actionSpec: IActionSpec;\n  characterId: string;\n\n  constructor(st: number, d: number, as: IActionSpec, ci: string) {\n    this.startTime = st;\n    this.duration = d;\n    this.actionSpec = as;\n    this.characterId = ci;\n  }\n}\n\nexport class Scheduler implements IScheduler {\n  protected _actionProcessor: IActionProcessor;\n  protected _actsInfo: IActInfo[];\n  protected _runnedAct: Set<IActionItem>;\n\n  constructor(actionProcessor: IActionProcessor) {\n    this._actionProcessor = actionProcessor;\n    this._runnedAct = new Set();\n  }\n\n  init(acts: IActSpec[]) {\n    this.clearState();\n    this.initActs(acts);\n  }\n\n  clearState(): void {\n    this._runnedAct.clear();\n  }\n\n  getTotalTime(): number {\n    return this._actsInfo.reduce((t, actInfo) => Math.max(t, actInfo.startTime + actInfo.duration), 0);\n  }\n\n  findActByTime(t: number) {\n    // 规范化t\n    const totalTime = this.getTotalTime();\n    if (totalTime <= 0) {\n      return {\n        actInfo: this._actsInfo[0],\n        t: 0\n      };\n    }\n    for (let i = 0; i < this._actsInfo.length; i++) {\n      const actInfo = this._actsInfo[i];\n      if (actInfo.startTime <= t && actInfo.startTime + actInfo.duration > t) {\n        return {\n          actInfo: actInfo,\n          t: t - actInfo.startTime\n        };\n      }\n    }\n    return {\n      actInfo: this._actsInfo[this._actsInfo.length - 1],\n      t: t - this._actsInfo[this._actsInfo.length - 1].startTime\n    };\n  }\n\n  /**\n   * 获取某个时间区间的所有Action，toTime实际上是当前时间，fromTime是上一次的时间\n   * 避免跳帧\n   * @param fromTime 上一次的时间\n   * @param toTime 当前时间\n   */\n  getActionsInRange(fromTime: number, toTime: number) {\n    // 先找到目前是在哪个幕中\n    const { actInfo: fromAct, t: formatFromTime } = this.findActByTime(fromTime);\n    const { actInfo: toAct, t: formatToTime } = this.findActByTime(toTime);\n    if (fromAct !== toAct) {\n      // TODO 跳帧了\n    }\n    // const formatFromTime = Scheduler.formatTimeInAction(fromTime, toAct);\n    // const formatToTime = Scheduler.formatTimeInAction(toTime, toAct);\n\n    const actions: IActionItem[] = [];\n    toAct.sceneInfoList.forEach(sceneInfo => {\n      const { startTime: sceneStartTime } = sceneInfo;\n      sceneInfo.actionList.forEach(actionInfo => {\n        const startTime = sceneStartTime + actionInfo.startTime;\n        if (startTime <= formatToTime) {\n          if (!this._runnedAct.has(actionInfo)) {\n            this._runnedAct.add(actionInfo);\n            actions.push(actionInfo);\n          }\n        }\n      });\n    });\n    // actions.length && console.log('找到', fromTime, toTime, actions);\n    return actions;\n  }\n\n  protected initActs(acts: IActSpec[]) {\n    // act与act之间是串联的\n    let startTime = 0;\n    this._actsInfo = acts.map(act => {\n      const actInfo = this._getActInfo(act, startTime);\n      startTime += actInfo.duration;\n      return actInfo;\n    });\n  }\n\n  protected _getActInfo(act: IActSpec, actStartTime: number): IActInfo {\n    let sceneStartTime = 0;\n    const sceneInfoList = act.scenes.map(scene => {\n      const sceneInfo = this._getSceneInfo(scene, sceneStartTime + (scene.delay ?? 0));\n      sceneStartTime = sceneInfo.startTime + sceneInfo.duration;\n      return sceneInfo;\n    });\n    const startTime = sceneInfoList.reduce((st, info) => Math.min(info.startTime, st), 0);\n    const endTime = sceneInfoList.reduce((et, info) => Math.max(info.startTime + info.duration, et), 0);\n    return {\n      startTime: actStartTime,\n      duration: startTime + endTime - startTime,\n      id: act.id,\n      sceneInfoList\n    };\n  }\n\n  protected _getSceneInfo(scene: ISceneSpec, sceneStartTime: number): ISceneInfo {\n    let scene_st = 0;\n    let scene_et = 0;\n    const actionList: IActionItem[] = [];\n    scene.actions.forEach((action, actIdx) => {\n      let character_st = Infinity;\n      let character_et = -Infinity;\n      action.characterActions.forEach(ca => {\n        const characterIdList = isString(action.characterId) ? [action.characterId] : action.characterId;\n        characterIdList.forEach(characterId => {\n          const info = this._actionProcessor.getActInfo(characterId, ca);\n          if (!info) {\n            return;\n          }\n          const item = new ActionItem(info.startTime, info.duration, ca, characterId);\n\n          character_st = Math.max(Math.min(item.startTime, character_st), 0);\n          character_et = Math.max(item.startTime + item.duration, character_et);\n          actionList.push(item);\n        });\n      });\n\n      scene_st = !actIdx ? character_st : Math.max(Math.min(character_st, scene_st), 0);\n      scene_et = !actIdx ? character_et : Math.max(character_et, scene_et);\n    });\n\n    const sceneInfo: ISceneInfo = {\n      startTime: sceneStartTime,\n      duration: scene_et,\n      id: scene.id,\n      actionList\n    };\n\n    return sceneInfo;\n  }\n}\n"]}

package/cjs/scene/scene.js

@@ -1 +1,3 @@
+
+
 //# sourceMappingURL=scene.js.map

package/cjs/story/canvas/canvas.d.ts

@@ -8,8 +8,10 @@ export declare class StoryCanvas implements IStoryCanvas {
     protected _stage: IStage;
     getStage(): IStage;
     getCanvas(): HTMLCanvasElement;
-    constructor(story: Story, canvas: HTMLCanvasElement, width: number, height: number);
-    protected _initCanvas(width: number, height: number): void;
+    protected _container: HTMLDivElement;
+    get container(): HTMLDivElement;
+    constructor(story: Story, container: HTMLDivElement);
+    protected _initCanvas(): void;
     getEventDetail(event: StoryEvent): {
         character: ICharacter;
         characterInfo: undefined;

package/cjs/story/canvas/canvas.js

@@ -4,7 +4,10 @@ Object.defineProperty(exports, "__esModule", {
     value: !0
 }), exports.StoryCanvas = void 0;
 
-const vrender_1 = require("@visactor/vrender");
+const vrender_1 = require("@visactor/vrender"), vrender_2 = require("@visactor/vrender");
+
+(0, vrender_1.preLoadAllModule)(), (0, vrender_2.loadBrowserEnv)(vrender_1.container), 
+vrender_1.vglobal.setEnv("browser");
 
 class StoryCanvas {
     getStage() {
@@ -13,30 +16,33 @@ class StoryCanvas {
     getCanvas() {
         return this._canvas;
     }
-    constructor(story, canvas, width, height) {
-        this._story = story, this._canvas = canvas, this._initCanvas(width, height);
+    get container() {
+        return this._container;
+    }
+    constructor(story, container) {
+        this._story = story, this._container = container, this._initCanvas();
     }
-    _initCanvas(width, height) {
-        const canvas = this._canvas;
-        canvas.width = width * vrender_1.vglobal.devicePixelRatio, canvas.height = height * vrender_1.vglobal.devicePixelRatio, 
-        canvas.style && (canvas.style.width = width + "px", canvas.style.height = height + "px", 
-        canvas.style.position = "absolute");
+    _initCanvas() {
+        const canvas = document.createElement("canvas");
+        canvas.width = this._container.clientWidth * window.devicePixelRatio, canvas.height = this._container.clientHeight * window.devicePixelRatio, 
+        canvas.style.width = this._container.clientWidth + "px", canvas.style.height = this._container.clientHeight + "px", 
+        canvas.style.position = "absolute", canvas.id = `_visactor_story_canvas_${this._story.id}`, 
+        this._container.appendChild(canvas), this._canvas = canvas;
         const stage = (0, vrender_1.createStage)({
             canvas: this._canvas,
             width: this._canvas.clientWidth,
             height: this._canvas.clientHeight,
             canvasControled: !0,
-            autoRender: !1,
+            autoRender: !0,
             disableDirtyBounds: !0,
             ticker: new vrender_1.ManualTicker([]),
-            dpr: vrender_1.vglobal.devicePixelRatio,
+            pluginList: [ "RichTextEditPlugin" ],
+            dpr: window.devicePixelRatio,
             event: {
                 clickInterval: 300
             }
         });
-        this._stage = stage, stage.on("*", ((e, type) => {
-            "click" === type && console.log("canvas", e);
-        }));
+        this._stage = stage;
     }
     getEventDetail(event) {
         const characterMap = this._story.getCharacters();
@@ -55,4 +61,4 @@ class StoryCanvas {
 }
 
 exports.StoryCanvas = StoryCanvas;
-//# sourceMappingURL=canvas.js.map
+//# sourceMappingURL=canvas.js.map

package/cjs/story/canvas/canvas.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/story/canvas/canvas.ts"],"names":[],"mappings":";;;AAEA,+CAAoG;AAQpG,MAAa,WAAW;IAItB,QAAQ;QACN,OAAO,IAAI,CAAC,MAAM,CAAC;IACrB,CAAC;IAED,SAAS;QACP,OAAO,IAAI,CAAC,OAAO,CAAC;IACtB,CAAC;IAED,YAAY,KAAY,EAAE,MAAyB,EAAE,KAAa,EAAE,MAAc;QAChF,IAAI,CAAC,MAAM,GAAG,KAAK,CAAC;QACpB,IAAI,CAAC,OAAO,GAAG,MAAM,CAAC;QACtB,IAAI,CAAC,WAAW,CAAC,KAAK,EAAE,MAAM,CAAC,CAAC;IAClC,CAAC;IAES,WAAW,CAAC,KAAa,EAAE,MAAc;QACjD,MAAM,MAAM,GAAG,IAAI,CAAC,OAAO,CAAC;QAC5B,MAAM,CAAC,KAAK,GAAG,KAAK,GAAG,iBAAO,CAAC,gBAAgB,CAAC;QAChD,MAAM,CAAC,MAAM,GAAG,MAAM,GAAG,iBAAO,CAAC,gBAAgB,CAAC;QAClD,IAAI,MAAM,CAAC,KAAK,EAAE;YAChB,MAAM,CAAC,KAAK,CAAC,KAAK,GAAG,KAAK,GAAG,IAAI,CAAC;YAClC,MAAM,CAAC,KAAK,CAAC,MAAM,GAAG,MAAM,GAAG,IAAI,CAAC;YACpC,MAAM,CAAC,KAAK,CAAC,QAAQ,GAAG,UAAU,CAAC;SACpC;QACD,MAAM,KAAK,GAAG,IAAA,qBAAW,EAAC;YACxB,MAAM,EAAE,IAAI,CAAC,OAAO;YACpB,KAAK,EAAE,IAAI,CAAC,OAAO,CAAC,WAAW;YAC/B,MAAM,EAAE,IAAI,CAAC,OAAO,CAAC,YAAY;YACjC,eAAe,EAAE,IAAI;YACrB,UAAU,EAAE,KAAK;YACjB,kBAAkB,EAAE,IAAI;YACxB,MAAM,EAAE,IAAI,sBAAY,CAAC,EAAE,CAAC;YAC5B,GAAG,EAAE,iBAAO,CAAC,gBAAgB;YAC7B,KAAK,EAAE;gBACL,aAAa,EAAE,GAAG;aACnB;SACF,CAAC,CAAC;QAEH,IAAI,CAAC,MAAM,GAAG,KAAK,CAAC;QACpB,KAAK,CAAC,EAAE,CAAC,GAAG,EAAE,CAAC,CAAC,EAAE,IAAI,EAAE,EAAE;YAExB,IAAI,KAAK,OAAO,IAAI,OAAO,CAAC,GAAG,CAAC,QAAQ,EAAE,CAAC,CAAC,CAAC;QAC/C,CAAC,CAAC,CAAC;IACL,CAAC;IAED,cAAc,CAAC,KAAiB;QAE9B,MAAM,YAAY,GAAG,IAAI,CAAC,MAAM,CAAC,aAAa,EAAE,CAAC;QACjD,IAAI,aAAa,CAAC;QAClB,IAAI,SAAqB,CAAC;QAC1B,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,MAAM,CAAC,aAAa,EAAE,CAAC,CAAC,IAAI,CAAC,EAAE,CAAC,EAAE;YACjD,MAAM,aAAa,GAAG,YAAY,CAAC,EAAE,CAAC,CAAC;YACvC,MAAM,IAAI,GAAG,aAAa,CAAC,UAAU,CAAC,KAAK,CAAC,CAAC;YAC7C,IAAI,IAAI,EAAE;gBACR,aAAa,GAAG,IAAI,CAAC;gBACrB,SAAS,GAAG,aAAa,CAAC;gBAC1B,OAAO,IAAI,CAAC;aACb;YACD,OAAO,KAAK,CAAC;QACf,CAAC,CAAC,CAAC;QAEH,OAAO;YACL,SAAS;YACT,aAAa;SACd,CAAC;IACJ,CAAC;IAED,OAAO;QACL,IAAI,CAAC,MAAM,CAAC,OAAO,EAAE,CAAC;IACxB,CAAC;CACF;AAzED,kCAyEC","file":"canvas.js","sourcesContent":["import type { Story } from '../story';\nimport type { IStage } from '@visactor/vrender';\nimport { createStage, vglobal, container, preLoadAllModule, ManualTicker } from '@visactor/vrender';\nimport { loadBrowserEnv } from '@visactor/vrender';\nimport type { IStoryCanvas, StoryEvent } from '../interface/runtime-interface';\nimport type { ICharacter } from '../character/runtime-interface';\n\n// preLoadAllModule();\n// loadBrowserEnv(container);\n\nexport class StoryCanvas implements IStoryCanvas {\n  protected _story: Story;\n  protected _canvas: HTMLCanvasElement;\n  protected _stage: IStage;\n  getStage() {\n    return this._stage;\n  }\n\n  getCanvas() {\n    return this._canvas;\n  }\n\n  constructor(story: Story, canvas: HTMLCanvasElement, width: number, height: number) {\n    this._story = story;\n    this._canvas = canvas;\n    this._initCanvas(width, height);\n  }\n\n  protected _initCanvas(width: number, height: number) {\n    const canvas = this._canvas;\n    canvas.width = width * vglobal.devicePixelRatio;\n    canvas.height = height * vglobal.devicePixelRatio;\n    if (canvas.style) {\n      canvas.style.width = width + 'px';\n      canvas.style.height = height + 'px';\n      canvas.style.position = 'absolute';\n    }\n    const stage = createStage({\n      canvas: this._canvas,\n      width: this._canvas.clientWidth,\n      height: this._canvas.clientHeight,\n      canvasControled: true,\n      autoRender: false,\n      disableDirtyBounds: true,\n      ticker: new ManualTicker([]),\n      dpr: vglobal.devicePixelRatio,\n      event: {\n        clickInterval: 300\n      }\n    });\n    // @ts-ignore\n    this._stage = stage;\n    stage.on('*', (e, type) => {\n      // eslint-disable-next-line no-console\n      type === 'click' && console.log('canvas', e);\n    });\n  }\n\n  getEventDetail(event: StoryEvent) {\n    // 得到交互元素的详细信息\n    const characterMap = this._story.getCharacters();\n    let characterInfo;\n    let character: ICharacter;\n    Object.keys(this._story.getCharacters()).find(id => {\n      const characterTemp = characterMap[id];\n      const info = characterTemp.checkEvent(event);\n      if (info) {\n        characterInfo = info;\n        character = characterTemp;\n        return true;\n      }\n      return false;\n    });\n\n    return {\n      character,\n      characterInfo\n    };\n  }\n\n  release() {\n    this._stage.release();\n  }\n}\n"]}
+{"version":3,"sources":["../src/story/canvas/canvas.ts"],"names":[],"mappings":"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","file":"canvas.js","sourcesContent":["import type { Story } from '../story';\nimport type { IStage } from '@visactor/vrender';\nimport { createStage, vglobal, container, preLoadAllModule, ManualTicker } from '@visactor/vrender';\nimport { loadBrowserEnv } from '@visactor/vrender';\nimport type { IStoryCanvas, StoryEvent } from '../interface/runtime-interface';\nimport type { ICharacter } from '../character/runtime-interface';\n\npreLoadAllModule();\nloadBrowserEnv(container);\nvglobal.setEnv('browser');\n\nexport class StoryCanvas implements IStoryCanvas {\n  protected _story: Story;\n  protected _canvas: HTMLCanvasElement;\n  protected _stage: IStage;\n  getStage() {\n    return this._stage;\n  }\n\n  getCanvas() {\n    return this._canvas;\n  }\n\n  protected _container: HTMLDivElement;\n  get container() {\n    return this._container;\n  }\n\n  constructor(story: Story, container: HTMLDivElement) {\n    this._story = story;\n    this._container = container;\n    this._initCanvas();\n  }\n\n  protected _initCanvas() {\n    const canvas = document.createElement('canvas');\n    canvas.width = this._container.clientWidth * window.devicePixelRatio;\n    canvas.height = this._container.clientHeight * window.devicePixelRatio;\n    canvas.style.width = this._container.clientWidth + 'px';\n    canvas.style.height = this._container.clientHeight + 'px';\n    canvas.style.position = 'absolute';\n    canvas.id = `_visactor_story_canvas_${this._story.id}`;\n    this._container.appendChild(canvas);\n    this._canvas = canvas;\n    const stage = createStage({\n      canvas: this._canvas,\n      width: this._canvas.clientWidth,\n      height: this._canvas.clientHeight,\n      canvasControled: true,\n      // 得开启自动渲染，否则编辑场景中无法触发视图更新\n      autoRender: true,\n      disableDirtyBounds: true,\n      ticker: new ManualTicker([]),\n      pluginList: ['RichTextEditPlugin'],\n      dpr: window.devicePixelRatio,\n      event: {\n        clickInterval: 300\n      }\n    });\n    // @ts-ignore\n    this._stage = stage;\n  }\n\n  getEventDetail(event: StoryEvent) {\n    // 得到交互元素的详细信息\n    const characterMap = this._story.getCharacters();\n    let characterInfo;\n    let character: ICharacter;\n    Object.keys(this._story.getCharacters()).find(id => {\n      const characterTemp = characterMap[id];\n      const info = characterTemp.checkEvent(event);\n      if (info) {\n        characterInfo = info;\n        character = characterTemp;\n        return true;\n      }\n      return false;\n    });\n\n    return {\n      character,\n      characterInfo\n    };\n  }\n\n  release() {\n    this._stage.release();\n  }\n}\n"]}

package/cjs/story/character/base/base.d.ts

@@ -1,15 +1,16 @@
+import type { IBoundsLike } from '@visactor/vutils';
 import type { ICharacterInitOption, ICharacterPickInfo } from '../runtime-interface';
 import type { ICharacter, ICharacterSpec } from '..';
 import type { IGroup } from '@visactor/vrender';
 import type { StoryEvent } from '../../interface';
-import { Graphic } from '../component/graphic/graphic';
-import { IVisactorGraphic } from '../visactor/interface';
 export declare abstract class CharacterBase implements ICharacter {
     readonly id: string;
-    protected _graphic: Graphic | IVisactorGraphic;
-    get graphic(): IVisactorGraphic | Graphic;
+    readonly visActorType: string;
+    readonly type: string;
     protected _spec: ICharacterSpec;
     get spec(): ICharacterSpec;
+    protected _graphic: any;
+    get graphic(): any;
     protected _option: ICharacterInitOption;
     get option(): ICharacterInitOption;
     constructor(spec: ICharacterSpec, option: ICharacterInitOption);
@@ -25,6 +26,8 @@ export declare abstract class CharacterBase implements ICharacter {
     abstract hide(): void;
     getPositionData(): void;
     abstract getGraphicParent(): IGroup;
+    abstract getLayoutBounds(): IBoundsLike;
     abstract clearCharacter(): void;
     abstract checkEvent(event: StoryEvent): false | ICharacterPickInfo;
+    release(): void;
 }

package/cjs/story/character/base/base.js

@@ -7,17 +7,17 @@ Object.defineProperty(exports, "__esModule", {
 const vutils_1 = require("@visactor/vutils");
 
 class CharacterBase {
-    get graphic() {
-        return this._graphic;
-    }
     get spec() {
         return this._spec;
     }
+    get graphic() {
+        return this._graphic;
+    }
     get option() {
         return this._option;
     }
     constructor(spec, option) {
-        this.id = spec.id, this._spec = spec, this._option = option;
+        this.type = spec.type, this.id = spec.id, this._spec = spec, this._option = option;
     }
     updateSpec(spec) {
         var _a;
@@ -37,6 +37,9 @@ class CharacterBase {
         this.clearCharacter(), this.init();
     }
     getPositionData() {}
+    release() {
+        this.graphic && this.graphic.release && this.graphic.release();
+    }
 }
 
 exports.CharacterBase = CharacterBase;

package/cjs/story/character/base/base.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/story/character/base/base.ts"],"names":[],"mappings":";;;AAAA,6CAAkD;AAQlD,MAAsB,aAAa;IAGjC,IAAI,OAAO;QACT,OAAO,IAAI,CAAC,QAAQ,CAAC;IACvB,CAAC;IAED,IAAI,IAAI;QACN,OAAO,IAAI,CAAC,KAAK,CAAC;IACpB,CAAC;IAGD,IAAI,MAAM;QACR,OAAO,IAAI,CAAC,OAAO,CAAC;IACtB,CAAC;IAED,YAAY,IAAoB,EAAE,MAA4B;QAC5D,IAAI,CAAC,EAAE,GAAG,IAAI,CAAC,EAAE,CAAC;QAClB,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC;QAClB,IAAI,CAAC,OAAO,GAAG,MAAM,CAAC;IACxB,CAAC;IACD,UAAU,CAAC,IAAkD;;QAC3D,IAAI,IAAI,CAAC,QAAQ,EAAE;YACjB,IAAI,CAAC,KAAK,CAAC,QAAQ,GAAG,IAAI,CAAC,QAAQ,CAAC;SACrC;QACD,IAAI,IAAA,gBAAO,EAAC,IAAI,CAAC,MAAM,CAAC,EAAE;YACxB,IAAI,CAAC,KAAK,CAAC,MAAM,GAAG,IAAI,CAAC,MAAM,CAAC;SACjC;QACD,IAAI,IAAI,CAAC,OAAO,EAAE;YAChB,IAAI,CAAC,KAAK,CAAC,OAAO,GAAG,IAAA,cAAK,EAAC,MAAA,IAAI,CAAC,KAAK,CAAC,OAAO,mCAAI,EAAE,EAAE,IAAI,CAAC,OAAO,CAAC,CAAC;SACpE;IACH,CAAC;IAED,aAAa,CAAC,IAAyB;QACrC,MAAM,IAAI,KAAK,CAAC,oBAAoB,CAAC,CAAC;IACxC,CAAC;IAED,MAAM,CAAC,CAAS;QACd,MAAM,IAAI,KAAK,CAAC,yBAAyB,CAAC,CAAC;IAC7C,CAAC;IAED,IAAI;QACF,IAAI,CAAC,YAAY,EAAE,CAAC;QACpB,IAAI,CAAC,WAAW,EAAE,CAAC;QACnB,IAAI,CAAC,aAAa,EAAE,CAAC;IACvB,CAAC;IAED,KAAK;QACH,IAAI,CAAC,cAAc,EAAE,CAAC;QACtB,IAAI,CAAC,IAAI,EAAE,CAAC;IACd,CAAC;IASD,eAAe;QACb,OAAO;IACT,CAAC;CAOF;AApED,sCAoEC","file":"base.js","sourcesContent":["import { isValid, merge } from '@visactor/vutils';\nimport type { ICharacterInitOption, ICharacterPickInfo } from '../runtime-interface';\nimport type { ICharacter, ICharacterSpec } from '..';\nimport type { IGroup } from '@visactor/vrender';\nimport type { StoryEvent } from '../../interface';\nimport { Graphic } from '../component/graphic/graphic';\nimport { IVisactorGraphic } from '../visactor/interface';\n\nexport abstract class CharacterBase implements ICharacter {\n  readonly id: string;\n  protected declare _graphic: Graphic | IVisactorGraphic;\n  get graphic() {\n    return this._graphic;\n  }\n  protected _spec: ICharacterSpec;\n  get spec() {\n    return this._spec;\n  }\n\n  protected _option: ICharacterInitOption;\n  get option() {\n    return this._option;\n  }\n\n  constructor(spec: ICharacterSpec, option: ICharacterInitOption) {\n    this.id = spec.id;\n    this._spec = spec;\n    this._option = option;\n  }\n  updateSpec(spec: Omit<Partial<ICharacterSpec>, 'id' | 'type'>): void {\n    if (spec.position) {\n      this._spec.position = spec.position;\n    }\n    if (isValid(spec.zIndex)) {\n      this._spec.zIndex = spec.zIndex;\n    }\n    if (spec.options) {\n      this._spec.options = merge(this._spec.options ?? {}, spec.options);\n    }\n  }\n\n  setAttributes(attr: Record<string, any>) {\n    throw new Error('请重载setAttributes函数');\n  }\n\n  tickTo(t: number): void {\n    throw new Error('Method not implemented.');\n  }\n\n  init() {\n    this._initRuntime();\n    this._parserSpec();\n    this._initGraphics();\n  }\n\n  reset() {\n    this.clearCharacter();\n    this.init();\n  }\n\n  protected abstract _initRuntime(): void;\n  protected abstract _parserSpec(): void;\n  protected abstract _initGraphics(): void;\n\n  abstract show(): void;\n  abstract hide(): void;\n\n  getPositionData() {\n    return;\n  }\n\n  abstract getGraphicParent(): IGroup;\n\n  abstract clearCharacter(): void;\n\n  abstract checkEvent(event: StoryEvent): false | ICharacterPickInfo;\n}\n"]}
+{"version":3,"sources":["../src/story/character/base/base.ts"],"names":[],"mappings":";;;AACA,6CAAkD;AAOlD,MAAsB,aAAa;IAKjC,IAAI,IAAI;QACN,OAAO,IAAI,CAAC,KAAK,CAAC;IACpB,CAAC;IAED,IAAI,OAAO;QACT,OAAO,IAAI,CAAC,QAAQ,CAAC;IACvB,CAAC;IAGD,IAAI,MAAM;QACR,OAAO,IAAI,CAAC,OAAO,CAAC;IACtB,CAAC;IAED,YAAY,IAAoB,EAAE,MAA4B;QAC5D,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC,IAAI,CAAC;QACtB,IAAI,CAAC,EAAE,GAAG,IAAI,CAAC,EAAE,CAAC;QAClB,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC;QAClB,IAAI,CAAC,OAAO,GAAG,MAAM,CAAC;IACxB,CAAC;IACD,UAAU,CAAC,IAAkD;;QAC3D,IAAI,IAAI,CAAC,QAAQ,EAAE;YACjB,IAAI,CAAC,KAAK,CAAC,QAAQ,GAAG,IAAI,CAAC,QAAQ,CAAC;SACrC;QACD,IAAI,IAAA,gBAAO,EAAC,IAAI,CAAC,MAAM,CAAC,EAAE;YACxB,IAAI,CAAC,KAAK,CAAC,MAAM,GAAG,IAAI,CAAC,MAAM,CAAC;SACjC;QACD,IAAI,IAAI,CAAC,OAAO,EAAE;YAChB,IAAI,CAAC,KAAK,CAAC,OAAO,GAAG,IAAA,cAAK,EAAC,MAAA,IAAI,CAAC,KAAK,CAAC,OAAO,mCAAI,EAAE,EAAE,IAAI,CAAC,OAAO,CAAC,CAAC;SACpE;IACH,CAAC;IAED,aAAa,CAAC,IAAyB;QACrC,MAAM,IAAI,KAAK,CAAC,oBAAoB,CAAC,CAAC;IACxC,CAAC;IAED,MAAM,CAAC,CAAS;QACd,MAAM,IAAI,KAAK,CAAC,yBAAyB,CAAC,CAAC;IAC7C,CAAC;IAED,IAAI;QACF,IAAI,CAAC,YAAY,EAAE,CAAC;QACpB,IAAI,CAAC,WAAW,EAAE,CAAC;QACnB,IAAI,CAAC,aAAa,EAAE,CAAC;IACvB,CAAC;IAED,KAAK;QACH,IAAI,CAAC,cAAc,EAAE,CAAC;QACtB,IAAI,CAAC,IAAI,EAAE,CAAC;IACd,CAAC;IASD,eAAe;QACb,OAAO;IACT,CAAC;IAQD,OAAO;QACL,IAAI,CAAC,OAAO,IAAI,IAAI,CAAC,OAAO,CAAC,OAAO,IAAI,IAAI,CAAC,OAAO,CAAC,OAAO,EAAE,CAAC;IACjE,CAAC;CACF;AA3ED,sCA2EC","file":"base.js","sourcesContent":["import type { IBoundsLike } from '@visactor/vutils';\nimport { isValid, merge } from '@visactor/vutils';\nimport type { ICharacterInitOption, ICharacterPickInfo } from '../runtime-interface';\nimport type { ICharacter, ICharacterSpec } from '..';\nimport type { IGroup } from '@visactor/vrender';\nimport type { StoryEvent } from '../../interface';\nimport { IVisactorGraphic } from '../visactor/interface';\n\nexport abstract class CharacterBase implements ICharacter {\n  readonly id: string;\n  readonly visActorType: string;\n  readonly type: string;\n  protected _spec: ICharacterSpec;\n  get spec() {\n    return this._spec;\n  }\n  protected declare _graphic: any;\n  get graphic() {\n    return this._graphic;\n  }\n\n  protected _option: ICharacterInitOption;\n  get option() {\n    return this._option;\n  }\n\n  constructor(spec: ICharacterSpec, option: ICharacterInitOption) {\n    this.type = spec.type;\n    this.id = spec.id;\n    this._spec = spec;\n    this._option = option;\n  }\n  updateSpec(spec: Omit<Partial<ICharacterSpec>, 'id' | 'type'>): void {\n    if (spec.position) {\n      this._spec.position = spec.position;\n    }\n    if (isValid(spec.zIndex)) {\n      this._spec.zIndex = spec.zIndex;\n    }\n    if (spec.options) {\n      this._spec.options = merge(this._spec.options ?? {}, spec.options);\n    }\n  }\n\n  setAttributes(attr: Record<string, any>) {\n    throw new Error('请重载setAttributes函数');\n  }\n\n  tickTo(t: number): void {\n    throw new Error('Method not implemented.');\n  }\n\n  init() {\n    this._initRuntime();\n    this._parserSpec();\n    this._initGraphics();\n  }\n\n  reset() {\n    this.clearCharacter();\n    this.init();\n  }\n\n  protected abstract _initRuntime(): void;\n  protected abstract _parserSpec(): void;\n  protected abstract _initGraphics(): void;\n\n  abstract show(): void;\n  abstract hide(): void;\n\n  getPositionData() {\n    return;\n  }\n\n  abstract getGraphicParent(): IGroup;\n  abstract getLayoutBounds(): IBoundsLike;\n\n  abstract clearCharacter(): void;\n\n  abstract checkEvent(event: StoryEvent): false | ICharacterPickInfo;\n  release() {\n    this.graphic && this.graphic.release && this.graphic.release();\n  }\n}\n"]}

package/cjs/story/character/chart/character.d.ts

@@ -1,5 +1,6 @@
 import type { IChartCharacterRuntimeConstructor } from './runtime/interface';
 import type { IChartCharacterSpec } from '../dsl-interface';
+import { Chart } from './graphic/vchart-graphic';
 import { CharacterVisactor } from '../visactor/character';
 import { SpecProcess } from './spec-process/spec-process';
 import type { ITicker } from '@visactor/vrender';
@@ -8,17 +9,32 @@ import type { ICharacterPickInfo } from '../runtime-interface';
 export declare class CharacterChart extends CharacterVisactor {
     static type: string;
     static RunTime: IChartCharacterRuntimeConstructor[];
+    readonly visActorType = "chart";
     protected _specProcess: SpecProcess;
     protected _ticker: ITicker;
+    _graphic: Chart;
     protected _spec: IChartCharacterSpec;
     get spec(): IChartCharacterSpec;
     protected _initSpecProcess(): void;
     protected _initRuntime(): void;
     protected _parserSpec(): void;
     protected _initGraphics(): void;
+    setAttributes(attr: Record<string, any>): void;
+    getViewBoxFromSpec(): {
+        layout: Partial<import("../runtime-interface").ILayoutAttribute>;
+        viewBox: {
+            x1: number;
+            x2: number;
+            y1: number;
+            y2: number;
+        };
+    };
+    private _getChartOption;
     protected _afterRender(): void;
     protected _updateVisactorSpec(): void;
     clearCharacter(): void;
     tickTo(t: number): void;
     checkEvent(event: StoryEvent): false | ICharacterPickInfo;
+    release(): void;
+    private _reflow;
 }

package/cjs/story/character/chart/character.js

@@ -4,9 +4,12 @@ Object.defineProperty(exports, "__esModule", {
     value: !0
 }), exports.CharacterChart = void 0;
 
-const common_spec_1 = require("./runtime/common-spec"), component_spec_1 = require("./runtime/component-spec"), vutils_1 = require("@visactor/vutils"), vchart_1 = require("@visactor/vchart"), vchart_graphic_1 = require("./graphic/vchart-graphic"), layout_1 = require("../../utils/layout"), character_1 = require("../visactor/character"), spec_process_1 = require("./spec-process/spec-process"), data_temp_transform_1 = require("./spec-process/data-temp-transform"), series_spec_1 = require("./runtime/series-spec");
+const common_spec_1 = require("./runtime/common-spec"), component_spec_1 = require("./runtime/component-spec"), vutils_1 = require("@visactor/vutils"), vchart_1 = require("@visactor/vchart"), vchart_graphic_1 = require("./graphic/vchart-graphic"), character_1 = require("../visactor/character"), spec_process_1 = require("./spec-process/spec-process"), data_temp_transform_1 = require("./spec-process/data-temp-transform"), series_spec_1 = require("./runtime/series-spec"), layout_1 = require("../../utils/layout"), vchart_pick_1 = require("../../utils/vchart-pick");
 
 class CharacterChart extends character_1.CharacterVisactor {
+    constructor() {
+        super(...arguments), this.visActorType = "chart";
+    }
     get spec() {
         return this._spec;
     }
@@ -22,21 +25,16 @@ class CharacterChart extends character_1.CharacterVisactor {
         this._specProcess.updateConfig(this._spec);
     }
     _initGraphics() {
-        var _a;
-        const layout = (0, layout_1.getLayoutFromWidget)(this._spec.position), viewBox = {
-            x1: layout.x,
-            x2: layout.x + layout.width,
-            y1: layout.y,
-            y2: layout.y + layout.height
-        }, spec = (0, vutils_1.cloneDeep)(this._specProcess.getVisSpec());
-        spec.width = layout.width, spec.height = layout.height, this._graphic = new vchart_graphic_1.Chart(Object.assign(Object.assign({
+        var _a, _b;
+        const {spec: spec, viewBox: viewBox} = this._getChartOption();
+        this._graphic = new vchart_graphic_1.Chart(Object.assign(Object.assign({
             renderCanvas: this._option.canvas.getCanvas(),
             spec: spec,
             ClassType: vchart_1.VChart,
             vchart: null,
             zIndex: this._spec.zIndex,
-            mode: vchart_1.vglobal.env,
-            dpr: vchart_1.vglobal.devicePixelRatio,
+            mode: "desktop-browser",
+            dpr: window.devicePixelRatio,
             interactive: !1,
             autoRender: !1,
             disableDirtyBounds: !0,
@@ -44,7 +42,7 @@ class CharacterChart extends character_1.CharacterVisactor {
             ticker: this._option.canvas.getStage().ticker,
             visibleAll: !1
         }, null !== (_a = this._spec.options.panel) && void 0 !== _a ? _a : {}), {
-            chartInitOptions: {
+            chartInitOptions: (0, vutils_1.merge)({
                 animation: !0,
                 disableTriggerEvent: !0,
                 performanceHook: {
@@ -64,9 +62,33 @@ class CharacterChart extends character_1.CharacterVisactor {
                         }));
                     }
                 }
-            }
+            }, null !== (_b = this._spec.options.initOption) && void 0 !== _b ? _b : {})
         })), this.option.graphicParent.add(this._graphic);
     }
+    setAttributes(attr) {
+        attr.position && (this._spec.position = attr.position, this._graphic.updateViewBox(this.getViewBoxFromSpec().viewBox));
+    }
+    getViewBoxFromSpec() {
+        const layout = (0, layout_1.getLayoutFromWidget)(this._spec.position);
+        return {
+            layout: layout,
+            viewBox: {
+                x1: layout.x,
+                x2: layout.x + layout.width,
+                y1: layout.y,
+                y2: layout.y + layout.height
+            }
+        };
+    }
+    _getChartOption() {
+        var _a;
+        const {layout: layout, viewBox: viewBox} = this.getViewBoxFromSpec(), spec = (0, 
+        vutils_1.cloneDeep)(null !== (_a = this._specProcess.getVisSpec()) && void 0 !== _a ? _a : this._spec.options.spec);
+        return spec.width = layout.width, spec.height = layout.height, {
+            viewBox: viewBox,
+            spec: spec
+        };
+    }
     _afterRender() {}
     _updateVisactorSpec() {
         var _a;
@@ -79,7 +101,30 @@ class CharacterChart extends character_1.CharacterVisactor {
         this._ticker.tickAt(t);
     }
     checkEvent(event) {
-        return !1;
+        var _a;
+        if (!(null !== (_a = event.detailPath) && void 0 !== _a ? _a : event.path).some((g => g === this._graphic))) return !1;
+        const chartPath = event.detailPath[event.detailPath.length - 1], result = (0, vchart_pick_1.getChartModelWithEvent)(this._graphic.vProduct, event);
+        if (!result) return !!this._graphic.pointInViewBox(event.canvasX, event.canvasY) && {
+            part: "null",
+            graphic: null,
+            modelInfo: null,
+            graphicType: "null"
+        };
+        const graphic = null == chartPath ? void 0 : chartPath[chartPath.length - 1];
+        return {
+            part: result.type,
+            modelInfo: result,
+            graphic: graphic,
+            graphicType: graphic.type
+        };
+    }
+    release() {
+        this.option.graphicParent.removeChild(this._graphic), this._graphic.release && this._graphic.release();
+    }
+    _reflow() {
+        if (!this._graphic) return void this._initGraphics();
+        const {spec: spec} = this._getChartOption();
+        this._graphic.updateSpec(spec);
     }
 }