143 lines
3.9 KiB
TypeScript
143 lines
3.9 KiB
TypeScript
import type { Store } from '../common/types'
|
|
import Player, { State as PlayerState } from '../player/Player'
|
|
|
|
import MessageManager from './MessageManager'
|
|
import InspectorController from './InspectorController'
|
|
import TargetMarker from './TargetMarker'
|
|
import AssistManager, {
|
|
INITIAL_STATE as ASSIST_INITIAL_STATE,
|
|
} from './assist/AssistManager'
|
|
import Screen from './Screen/Screen'
|
|
|
|
// export type State = typeof WebPlayer.INITIAL_STATE
|
|
|
|
export default class WebPlayer extends Player {
|
|
static INITIAL_STATE = {
|
|
...Player.INITIAL_STATE,
|
|
...TargetMarker.INITIAL_STATE,
|
|
|
|
...MessageManager.INITIAL_STATE,
|
|
...ASSIST_INITIAL_STATE,
|
|
|
|
inspectorMode: false,
|
|
liveTimeTravel: false,
|
|
}
|
|
|
|
private readonly screen: Screen
|
|
private readonly inspectorController: InspectorController
|
|
protected readonly messageManager: MessageManager
|
|
|
|
assistManager: AssistManager // public so far
|
|
private targetMarker: TargetMarker
|
|
|
|
constructor(private wpState: Store<typeof WebPlayer.INITIAL_STATE>, session, config: RTCIceServer[], live: boolean) {
|
|
|
|
let initialLists = live ? {
|
|
event: session.events.toJSON(),
|
|
stack: session.stackEvents.toJSON(),
|
|
resource: session.resources.toJSON(),
|
|
exceptions: session.errors,
|
|
} : {}
|
|
|
|
const screen = new Screen()
|
|
const messageManager = new MessageManager(session, wpState, screen, initialLists)
|
|
super(wpState, messageManager)
|
|
this.screen = screen
|
|
this.messageManager = messageManager
|
|
|
|
this.targetMarker = new TargetMarker(this.screen, wpState)
|
|
this.inspectorController = new InspectorController(screen)
|
|
|
|
|
|
const endTime = !live && session.duration.valueOf()
|
|
wpState.update({
|
|
//@ts-ignore
|
|
initialized: true,
|
|
//@ts-ignore
|
|
session,
|
|
|
|
live,
|
|
livePlay: live,
|
|
endTime, // : 0, //TODO: through initialState
|
|
})
|
|
|
|
// TODO: separate LiveWebPlayer
|
|
this.assistManager = new AssistManager(session, this.messageManager, config, wpState)
|
|
if (live) {
|
|
this.assistManager.connect(session.agentToken)
|
|
}
|
|
}
|
|
|
|
attach(parent: HTMLElement) {
|
|
this.screen.attach(parent)
|
|
window.addEventListener('resize', this.scale)
|
|
this.scale()
|
|
}
|
|
scale = () => {
|
|
const { width, height } = this.wpState.get()
|
|
this.screen.scale({ width, height })
|
|
this.inspectorController.scale({ width, height })
|
|
|
|
// this.updateMarketTargets() ??
|
|
}
|
|
|
|
// Inspector & marker
|
|
mark(e: Element) {
|
|
this.inspectorController.marker?.mark(e)
|
|
}
|
|
toggleInspectorMode(flag: boolean, clickCallback?: (args: any) => any) {
|
|
if (typeof flag !== 'boolean') {
|
|
const { inspectorMode } = this.wpState.get()
|
|
flag = !inspectorMode;
|
|
}
|
|
|
|
if (flag) {
|
|
this.pause()
|
|
this.wpState.update({ inspectorMode: true })
|
|
return this.inspectorController.enableInspector(clickCallback);
|
|
} else {
|
|
this.inspectorController.disableInspector();
|
|
this.wpState.update({ inspectorMode: false });
|
|
}
|
|
}
|
|
|
|
setActiveTarget(args: Parameters<TargetMarker['setActiveTarget']>) {
|
|
this.targetMarker.setActiveTarget(...args)
|
|
}
|
|
|
|
markTargets(args: Parameters<TargetMarker['markTargets']>) {
|
|
this.pause()
|
|
this.targetMarker.markTargets(...args)
|
|
}
|
|
|
|
|
|
// TODO
|
|
async toggleTimetravel() {
|
|
if (!this.wpState.get().liveTimeTravel) {
|
|
return await this.messageManager.reloadWithUnprocessedFile(() =>
|
|
this.wpState.update({
|
|
liveTimeTravel: true,
|
|
})
|
|
)
|
|
}
|
|
}
|
|
|
|
// TODO: restore notes functionality
|
|
// injectNotes(notes: Note[]) {
|
|
// update({ notes })
|
|
// }
|
|
// filterOutNote(noteId: number) {
|
|
// const { notes } = getState()
|
|
// update({ notes: notes.filter((note: Note) => note.noteId !== noteId) })
|
|
// }
|
|
|
|
toggleUserName(name?: string) {
|
|
this.screen.cursor.showTag(name)
|
|
}
|
|
|
|
clean() {
|
|
super.clean()
|
|
this.assistManager.clean()
|
|
window.removeEventListener('resize', this.scale)
|
|
}
|
|
}
|