aboutsummaryrefslogtreecommitdiffhomepage
path: root/client/src/standalone
diff options
context:
space:
mode:
authorChocobozzz <me@florianbigard.com>2022-11-15 08:55:27 +0100
committerChocobozzz <me@florianbigard.com>2022-11-15 10:50:57 +0100
commitc2419476302b20e9fe3708d7a0a889ae18c95c1b (patch)
tree3276a4b6979ce3bba80f776f116d7e5cc55863db /client/src/standalone
parent90dbc73132f22888a60628d921c92f938499bd7b (diff)
downloadPeerTube-c2419476302b20e9fe3708d7a0a889ae18c95c1b.tar.gz
PeerTube-c2419476302b20e9fe3708d7a0a889ae18c95c1b.tar.zst
PeerTube-c2419476302b20e9fe3708d7a0a889ae18c95c1b.zip
Correctly terminate an ended live
Diffstat (limited to 'client/src/standalone')
-rw-r--r--client/src/standalone/videos/embed.ts44
-rw-r--r--client/src/standalone/videos/shared/live-manager.ts15
2 files changed, 44 insertions, 15 deletions
diff --git a/client/src/standalone/videos/embed.ts b/client/src/standalone/videos/embed.ts
index 356f149c0..2b826b9a2 100644
--- a/client/src/standalone/videos/embed.ts
+++ b/client/src/standalone/videos/embed.ts
@@ -3,12 +3,12 @@ import '../../assets/player/shared/dock/peertube-dock-component'
3import '../../assets/player/shared/dock/peertube-dock-plugin' 3import '../../assets/player/shared/dock/peertube-dock-plugin'
4import videojs from 'video.js' 4import videojs from 'video.js'
5import { peertubeTranslate } from '../../../../shared/core-utils/i18n' 5import { peertubeTranslate } from '../../../../shared/core-utils/i18n'
6import { HTMLServerConfig, ResultList, VideoDetails, VideoPlaylist, VideoPlaylistElement } from '../../../../shared/models' 6import { HTMLServerConfig, ResultList, VideoDetails, VideoPlaylist, VideoPlaylistElement, VideoState } from '../../../../shared/models'
7import { PeertubePlayerManager } from '../../assets/player' 7import { PeertubePlayerManager } from '../../assets/player'
8import { TranslationsManager } from '../../assets/player/translations-manager' 8import { TranslationsManager } from '../../assets/player/translations-manager'
9import { getParamString, logger, videoRequiresAuth } from '../../root-helpers' 9import { getParamString, logger, videoRequiresAuth } from '../../root-helpers'
10import { PeerTubeEmbedApi } from './embed-api' 10import { PeerTubeEmbedApi } from './embed-api'
11import { AuthHTTP, LiveManager, PeerTubePlugin, PlayerManagerOptions, PlaylistFetcher, PlaylistTracker, VideoFetcher } from './shared' 11import { AuthHTTP, LiveManager, PeerTubePlugin, PlayerManagerOptions, PlaylistFetcher, PlaylistTracker, Translations, VideoFetcher } from './shared'
12import { PlayerHTML } from './shared/player-html' 12import { PlayerHTML } from './shared/player-html'
13 13
14export class PeerTubeEmbed { 14export class PeerTubeEmbed {
@@ -251,18 +251,25 @@ export class PeerTubeEmbed {
251 }) 251 })
252 } 252 }
253 253
254 this.peertubePlugin.getPluginsManager().runHook('action:embed.player.loaded', undefined, { player: this.player, videojs, video })
255
256 if (video.isLive) { 254 if (video.isLive) {
257 this.liveManager.displayInfoAndListenForChanges({ 255 this.liveManager.listenForChanges({
258 video, 256 video,
259 translations,
260 onPublishedVideo: () => { 257 onPublishedVideo: () => {
261 this.liveManager.stopListeningForChanges(video) 258 this.liveManager.stopListeningForChanges(video)
262 this.loadVideoAndBuildPlayer(video.uuid) 259 this.loadVideoAndBuildPlayer(video.uuid)
263 } 260 }
264 }) 261 })
262
263 if (video.state.id === VideoState.WAITING_FOR_LIVE || video.state.id === VideoState.LIVE_ENDED) {
264 this.liveManager.displayInfo({ state: video.state.id, translations })
265
266 this.disablePlayer()
267 } else {
268 this.correctlyHandleLiveEnding(translations)
269 }
265 } 270 }
271
272 this.peertubePlugin.getPluginsManager().runHook('action:embed.player.loaded', undefined, { player: this.player, videojs, video })
266 } 273 }
267 274
268 private resetPlayerElement () { 275 private resetPlayerElement () {
@@ -351,6 +358,31 @@ export class PeerTubeEmbed {
351 private isPlaylistEmbed () { 358 private isPlaylistEmbed () {
352 return window.location.pathname.split('/')[1] === 'video-playlists' 359 return window.location.pathname.split('/')[1] === 'video-playlists'
353 } 360 }
361
362 // ---------------------------------------------------------------------------
363
364 private correctlyHandleLiveEnding (translations: Translations) {
365 this.player.one('ended', () => {
366 // Display the live ended information
367 this.liveManager.displayInfo({ state: VideoState.LIVE_ENDED, translations })
368
369 this.disablePlayer()
370 })
371 }
372
373 private disablePlayer () {
374 if (this.player.isFullscreen()) {
375 this.player.exitFullscreen()
376 }
377
378 // Disable player
379 this.player.hasStarted(false)
380 this.player.removeClass('vjs-has-autoplay')
381 this.player.bigPlayButton.hide();
382
383 (this.player.el() as HTMLElement).style.pointerEvents = 'none'
384 }
385
354} 386}
355 387
356PeerTubeEmbed.main() 388PeerTubeEmbed.main()
diff --git a/client/src/standalone/videos/shared/live-manager.ts b/client/src/standalone/videos/shared/live-manager.ts
index ec11d0b61..5fac229ba 100644
--- a/client/src/standalone/videos/shared/live-manager.ts
+++ b/client/src/standalone/videos/shared/live-manager.ts
@@ -14,15 +14,12 @@ export class LiveManager {
14 14
15 } 15 }
16 16
17 async displayInfoAndListenForChanges (options: { 17 async listenForChanges (options: {
18 video: VideoDetails 18 video: VideoDetails
19 translations: Translations
20 onPublishedVideo: () => any 19 onPublishedVideo: () => any
21 }) { 20 }) {
22 const { video, onPublishedVideo } = options 21 const { video, onPublishedVideo } = options
23 22
24 this.displayAppropriateInfo(options)
25
26 if (!this.liveSocket) { 23 if (!this.liveSocket) {
27 const io = (await import('socket.io-client')).io 24 const io = (await import('socket.io-client')).io
28 this.liveSocket = io(window.location.origin + '/live-videos') 25 this.liveSocket = io(window.location.origin + '/live-videos')
@@ -51,18 +48,18 @@ export class LiveManager {
51 this.liveSocket.emit('unsubscribe', { videoId: video.id }) 48 this.liveSocket.emit('unsubscribe', { videoId: video.id })
52 } 49 }
53 50
54 private displayAppropriateInfo (options: { 51 displayInfo (options: {
55 video: VideoDetails 52 state: VideoState
56 translations: Translations 53 translations: Translations
57 }) { 54 }) {
58 const { video, translations } = options 55 const { state, translations } = options
59 56
60 if (video.state.id === VideoState.WAITING_FOR_LIVE) { 57 if (state === VideoState.WAITING_FOR_LIVE) {
61 this.displayWaitingForLiveInfo(translations) 58 this.displayWaitingForLiveInfo(translations)
62 return 59 return
63 } 60 }
64 61
65 if (video.state.id === VideoState.LIVE_ENDED) { 62 if (state === VideoState.LIVE_ENDED) {
66 this.displayEndedLiveInfo(translations) 63 this.displayEndedLiveInfo(translations)
67 return 64 return
68 } 65 }