1 import { Socket } from 'socket.io-client'
2 import { LiveVideoEventPayload, VideoDetails, VideoState } from '../../../../../shared/models'
3 import { PlayerHTML } from './player-html'
4 import { Translations } from './translations'
6 export class LiveManager {
7 private liveSocket: Socket
9 private listeners = new Map<string, (payload: LiveVideoEventPayload) => void>()
12 private readonly playerHTML: PlayerHTML
17 async listenForChanges (options: {
19 onPublishedVideo: () => any
21 const { video, onPublishedVideo } = options
23 if (!this.liveSocket) {
24 const io = (await import('socket.io-client')).io
25 this.liveSocket = io(window.location.origin + '/live-videos')
28 const listener = (payload: LiveVideoEventPayload) => {
29 if (payload.state === VideoState.PUBLISHED) {
30 this.playerHTML.removeInformation()
36 this.liveSocket.on('state-change', listener)
37 this.listeners.set(video.uuid, listener)
39 this.liveSocket.emit('subscribe', { videoId: video.id })
42 stopListeningForChanges (video: VideoDetails) {
43 const listener = this.listeners.get(video.uuid)
45 this.liveSocket.off('state-change', listener)
48 this.liveSocket.emit('unsubscribe', { videoId: video.id })
51 displayInfo (options: {
53 translations: Translations
55 const { state, translations } = options
57 if (state === VideoState.WAITING_FOR_LIVE) {
58 this.displayWaitingForLiveInfo(translations)
62 if (state === VideoState.LIVE_ENDED) {
63 this.displayEndedLiveInfo(translations)
68 private displayWaitingForLiveInfo (translations: Translations) {
69 this.playerHTML.displayInformation('This live has not started yet.', translations)
72 private displayEndedLiveInfo (translations: Translations) {
73 this.playerHTML.displayInformation('This live has ended.', translations)