Correctly terminate an ended live

client/src/standalone/videos/embed.ts

@@ -3,12 +3,12 @@ import '../../assets/player/shared/dock/peertube-dock-component'
 import '../../assets/player/shared/dock/peertube-dock-plugin'
 import videojs from 'video.js'
 import { peertubeTranslate } from '../../../../shared/core-utils/i18n'
-import { HTMLServerConfig, ResultList, VideoDetails, VideoPlaylist, VideoPlaylistElement } from '../../../../shared/models'
+import { HTMLServerConfig, ResultList, VideoDetails, VideoPlaylist, VideoPlaylistElement, VideoState } from '../../../../shared/models'
 import { PeertubePlayerManager } from '../../assets/player'
 import { TranslationsManager } from '../../assets/player/translations-manager'
 import { getParamString, logger, videoRequiresAuth } from '../../root-helpers'
 import { PeerTubeEmbedApi } from './embed-api'
-import { AuthHTTP, LiveManager, PeerTubePlugin, PlayerManagerOptions, PlaylistFetcher, PlaylistTracker, VideoFetcher } from './shared'
+import { AuthHTTP, LiveManager, PeerTubePlugin, PlayerManagerOptions, PlaylistFetcher, PlaylistTracker, Translations, VideoFetcher } from './shared'
 import { PlayerHTML } from './shared/player-html'
 
 export class PeerTubeEmbed {
@@ -251,18 +251,25 @@ export class PeerTubeEmbed {
       })
     }
 
-    this.peertubePlugin.getPluginsManager().runHook('action:embed.player.loaded', undefined, { player: this.player, videojs, video })
-
     if (video.isLive) {
-      this.liveManager.displayInfoAndListenForChanges({
+      this.liveManager.listenForChanges({
         video,
-        translations,
         onPublishedVideo: () => {
           this.liveManager.stopListeningForChanges(video)
           this.loadVideoAndBuildPlayer(video.uuid)
         }
       })
+
+      if (video.state.id === VideoState.WAITING_FOR_LIVE || video.state.id === VideoState.LIVE_ENDED) {
+        this.liveManager.displayInfo({ state: video.state.id, translations })
+
+        this.disablePlayer()
+      } else {
+        this.correctlyHandleLiveEnding(translations)
+      }
     }
+
+    this.peertubePlugin.getPluginsManager().runHook('action:embed.player.loaded', undefined, { player: this.player, videojs, video })
   }
 
   private resetPlayerElement () {
@@ -351,6 +358,31 @@ export class PeerTubeEmbed {
   private isPlaylistEmbed () {
     return window.location.pathname.split('/')[1] === 'video-playlists'
   }
+
+  // ---------------------------------------------------------------------------
+
+  private correctlyHandleLiveEnding (translations: Translations) {
+    this.player.one('ended', () => {
+      // Display the live ended information
+      this.liveManager.displayInfo({ state: VideoState.LIVE_ENDED, translations })
+
+      this.disablePlayer()
+    })
+  }
+
+  private disablePlayer () {
+    if (this.player.isFullscreen()) {
+      this.player.exitFullscreen()
+    }
+
+    // Disable player
+    this.player.hasStarted(false)
+    this.player.removeClass('vjs-has-autoplay')
+    this.player.bigPlayButton.hide();
+
+    (this.player.el() as HTMLElement).style.pointerEvents = 'none'
+  }
+
 }
 
 PeerTubeEmbed.main()

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

@@ -14,15 +14,12 @@ export class LiveManager {
 
   }
 
-  async displayInfoAndListenForChanges (options: {
+  async listenForChanges (options: {
     video: VideoDetails
-    translations: Translations
     onPublishedVideo: () => any
   }) {
     const { video, onPublishedVideo } = options
 
-    this.displayAppropriateInfo(options)
-
     if (!this.liveSocket) {
       const io = (await import('socket.io-client')).io
       this.liveSocket = io(window.location.origin + '/live-videos')
@@ -51,18 +48,18 @@ export class LiveManager {
     this.liveSocket.emit('unsubscribe', { videoId: video.id })
   }
 
-  private displayAppropriateInfo (options: {
+  displayInfo (options: {
-    video: VideoDetails
+    state: VideoState
     translations: Translations
   }) {
-    const { video, translations } = options
+    const { state, translations } = options
 
-    if (video.state.id === VideoState.WAITING_FOR_LIVE) {
+    if (state === VideoState.WAITING_FOR_LIVE) {
       this.displayWaitingForLiveInfo(translations)
       return
     }
 
-    if (video.state.id === VideoState.LIVE_ENDED) {
+    if (state === VideoState.LIVE_ENDED) {
       this.displayEndedLiveInfo(translations)
       return
     }

server/tests/api/views/video-views-counter.ts

@@ -76,7 +76,7 @@ describe('Test video views/viewers counters', function () {
     let command: FfmpegCommand
 
     before(async function () {
-      this.timeout(120000);
+      this.timeout(240000);
 
       ({ vodVideoId, liveVideoId, ffmpegCommand: command } = await prepareViewsVideos({ servers, live: true, vod: true }))
     })

server/tests/api/views/video-views-overall-stats.ts

@@ -20,7 +20,7 @@ describe('Test views overall stats', function () {
     let command: FfmpegCommand
 
     before(async function () {
-      this.timeout(120000);
+      this.timeout(240000);
 
       ({ vodVideoId, liveVideoId, ffmpegCommand: command } = await prepareViewsVideos({ servers, live: true, vod: true }))
     })
@@ -179,7 +179,7 @@ describe('Test views overall stats', function () {
     let before2Watchers: Date
 
     before(async function () {
-      this.timeout(120000);
+      this.timeout(240000);
 
       ({ vodVideoId: videoUUID } = await prepareViewsVideos({ servers, live: true, vod: true }))
     })

server/tests/api/views/video-views-retention-stats.ts

@@ -17,7 +17,7 @@ describe('Test views retention stats', function () {
     let vodVideoId: string
 
     before(async function () {
-      this.timeout(120000);
+      this.timeout(240000);
 
       ({ vodVideoId } = await prepareViewsVideos({ servers, live: false, vod: true }))
     })

server/tests/api/views/video-views-timeserie-stats.ts

@@ -30,7 +30,7 @@ describe('Test views timeserie stats', function () {
     let vodVideoId: string
 
     before(async function () {
-      this.timeout(120000);
+      this.timeout(240000);
 
       ({ vodVideoId } = await prepareViewsVideos({ servers, live: false, vod: true }))
     })
@@ -81,7 +81,7 @@ describe('Test views timeserie stats', function () {
     }
 
     before(async function () {
-      this.timeout(120000);
+      this.timeout(240000);
 
       ({ vodVideoId, liveVideoId, ffmpegCommand: command } = await prepareViewsVideos({ servers, live: true, vod: true }))
     })