client/src/standalone/videos/shared/live-manager.ts

   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'
   5
   6 export class LiveManager {
   7   private liveSocket: Socket
   8
   9   private listeners = new Map<string, (payload: LiveVideoEventPayload) => void>()
  10
  11   constructor (
  12     private readonly playerHTML: PlayerHTML
  13   ) {
  14
  15   }
  16
  17   async displayInfoAndListenForChanges (options: {
  18     video: VideoDetails
  19     translations: Translations
  20     onPublishedVideo: () => any
  21   }) {
  22     const { video, onPublishedVideo } = options
  23
  24     this.displayAppropriateInfo(options)
  25
  26     if (!this.liveSocket) {
  27       const io = (await import('socket.io-client')).io
  28       this.liveSocket = io(window.location.origin + '/live-videos')
  29     }
  30
  31     const listener = (payload: LiveVideoEventPayload) => {
  32       if (payload.state === VideoState.PUBLISHED) {
  33         this.playerHTML.removeInformation()
  34         onPublishedVideo()
  35         return
  36       }
  37     }
  38
  39     this.liveSocket.on('state-change', listener)
  40     this.listeners.set(video.uuid, listener)
  41
  42     this.liveSocket.emit('subscribe', { videoId: video.id })
  43   }
  44
  45   stopListeningForChanges (video: VideoDetails) {
  46     const listener = this.listeners.get(video.uuid)
  47     if (listener) {
  48       this.liveSocket.off('state-change', listener)
  49     }
  50
  51     this.liveSocket.emit('unsubscribe', { videoId: video.id })
  52   }
  53
  54   private displayAppropriateInfo (options: {
  55     video: VideoDetails
  56     translations: Translations
  57   }) {
  58     const { video, translations } = options
  59
  60     if (video.state.id === VideoState.WAITING_FOR_LIVE) {
  61       this.displayWaitingForLiveInfo(translations)
  62       return
  63     }
  64
  65     if (video.state.id === VideoState.LIVE_ENDED) {
  66       this.displayEndedLiveInfo(translations)
  67       return
  68     }
  69   }
  70
  71   private displayWaitingForLiveInfo (translations: Translations) {
  72     this.playerHTML.displayInformation('This live has not started yet.', translations)
  73   }
  74
  75   private displayEndedLiveInfo (translations: Translations) {
  76     this.playerHTML.displayInformation('This live has ended.', translations)
  77
  78   }
  79 }