close #274 implement the new state management proposal

typings/replay/index.d.ts

@@ -1,17 +1,18 @@
 import { Timer } from './timer';
+import { createPlayerService, createSpeedService } from './machine';
 import { eventWithTime, playerConfig, playerMetaData, Handler } from '../types';
 import './styles/style.css';
 export declare class Replayer {
     wrapper: HTMLDivElement;
     iframe: HTMLIFrameElement;
+    service: ReturnType<typeof createPlayerService>;
+    speedService: ReturnType<typeof createSpeedService>;
     get timer(): Timer;
-    private config;
+    config: playerConfig;
     private mouse;
     private emitter;
     private nextUserInteractionEvent;
-    private noramlSpeed;
     private legacy_missingNodeRetryMap;
-    private service;
     private treeIndex;
     private fragmentParentMap;
     constructor(events: Array<eventWithTime | string>, config?: Partial<playerConfig>);
@@ -21,7 +22,7 @@ export declare class Replayer {
     getCurrentTime(): number;
     getTimeOffset(): number;
     play(timeOffset?: number): void;
-    pause(): void;
+    pause(timeOffset?: number): void;
     resume(timeOffset?: number): void;
     startLive(baselineTime?: number): void;
     addEvent(rawEvent: eventWithTime | string): void;
@@ -40,7 +41,7 @@ export declare class Replayer {
     private moveAndHover;
     private hoverElements;
     private isUserInteraction;
-    private restoreSpeed;
+    private backToNormal;
     private warnNodeNotFound;
     private debugNodeNotFound;
 }

typings/replay/machine.d.ts

@@ -1,9 +1,9 @@
+import { StateMachine } from '@xstate/fsm';
 import { playerConfig, eventWithTime, Emitter } from '../types';
 import { Timer } from './timer';
 export declare type PlayerContext = {
     events: eventWithTime[];
     timer: Timer;
-    speed: playerConfig['speed'];
     timeOffset: number;
     baselineTime: number;
     lastPlayedEvent: eventWithTime | null;
@@ -20,19 +20,6 @@ export declare type PlayerEvent = {
     };
 } | {
     type: 'PAUSE';
-} | {
-    type: 'RESUME';
-    payload: {
-        timeOffset: number;
-    };
-} | {
-    type: 'END';
-} | {
-    type: 'REPLAY';
-} | {
-    type: 'FAST_FORWARD';
-} | {
-    type: 'BACK_TO_NORMAL';
 } | {
     type: 'TO_LIVE';
     payload: {
@@ -43,22 +30,15 @@ export declare type PlayerEvent = {
     payload: {
         event: eventWithTime;
     };
+} | {
+    type: 'END';
 };
 export declare type PlayerState = {
-    value: 'inited';
-    context: PlayerContext;
-} | {
     value: 'playing';
     context: PlayerContext;
 } | {
     value: 'paused';
     context: PlayerContext;
-} | {
-    value: 'ended';
-    context: PlayerContext;
-} | {
-    value: 'skipping';
-    context: PlayerContext;
 } | {
     value: 'live';
     context: PlayerContext;
@@ -68,5 +48,32 @@ declare type PlayerAssets = {
     emitter: Emitter;
     getCastFn(event: eventWithTime, isSync: boolean): () => void;
 };
-export declare function createPlayerService(context: PlayerContext, { getCastFn, emitter }: PlayerAssets): import("@xstate/fsm").StateMachine.Service<PlayerContext, PlayerEvent, PlayerState>;
+export declare function createPlayerService(context: PlayerContext, { getCastFn, emitter }: PlayerAssets): StateMachine.Service<PlayerContext, PlayerEvent, PlayerState>;
+export declare type SpeedContext = {
+    normalSpeed: playerConfig['speed'];
+    timer: Timer;
+};
+export declare type SpeedEvent = {
+    type: 'FAST_FORWARD';
+    payload: {
+        speed: playerConfig['speed'];
+    };
+} | {
+    type: 'BACK_TO_NORMAL';
+} | {
+    type: 'SET_SPEED';
+    payload: {
+        speed: playerConfig['speed'];
+    };
+};
+export declare type SpeedState = {
+    value: 'normal';
+    context: SpeedContext;
+} | {
+    value: 'skipping';
+    context: SpeedContext;
+};
+export declare function createSpeedService(context: SpeedContext): StateMachine.Service<SpeedContext, SpeedEvent, SpeedState>;
+export declare type PlayerMachineState = StateMachine.State<PlayerContext, PlayerEvent, PlayerState>;
+export declare type SpeedMachineState = StateMachine.State<SpeedContext, SpeedEvent, SpeedState>;
 export {};

typings/replay/timer.d.ts

@@ -1,14 +1,17 @@
-import { playerConfig, actionWithDelay, eventWithTime } from '../types';
+import { actionWithDelay, eventWithTime } from '../types';
 export declare class Timer {
     timeOffset: number;
+    speed: number;
     private actions;
-    private config;
     private raf;
-    constructor(config: playerConfig, actions?: actionWithDelay[]);
+    private liveMode;
+    constructor(actions: actionWithDelay[] | undefined, speed: number);
     addAction(action: actionWithDelay): void;
     addActions(actions: actionWithDelay[]): void;
     start(): void;
     clear(): void;
+    setSpeed(speed: number): void;
+    toggleLiveMode(mode: boolean): void;
     private findActionIndex;
 }
 export declare function getDelay(event: eventWithTime, baselineTime: number): number;