X-Git-Url: https://git.immae.eu/?a=blobdiff_plain;f=client%2Fsrc%2Fassets%2Fplayer%2Fpeertube-player-manager.ts;h=7be9f8719b06565644f5af18304195c8ca194437;hb=852ecadfc4284aa2f8110274ff49d2a53d4166ba;hp=0ba9bcb1142267422055d96eef196e34defa532f;hpb=b718fd22374d64534bcfe69932cf562894abed6a;p=github%2FChocobozzz%2FPeerTube.git diff --git a/client/src/assets/player/peertube-player-manager.ts b/client/src/assets/player/peertube-player-manager.ts index 0ba9bcb11..7be9f8719 100644 --- a/client/src/assets/player/peertube-player-manager.ts +++ b/client/src/assets/player/peertube-player-manager.ts @@ -17,6 +17,7 @@ import { buildVideoEmbed, buildVideoLink, copyToClipboard, getRtcConfig } from ' import { getCompleteLocale, getShortLocale, is18nLocale, isDefaultLocale } from '../../../../shared/models/i18n/i18n' import { segmentValidatorFactory } from './p2p-media-loader/segment-validator' import { segmentUrlBuilderFactory } from './p2p-media-loader/segment-url-builder' +import { RedundancyUrlManager } from './p2p-media-loader/redundancy-url-manager' // Change 'Playback Rate' to 'Speed' (smaller for our settings menu) videojsUntyped.getComponent('PlaybackRateMenuButton').prototype.controlText_ = 'Speed' @@ -39,7 +40,19 @@ export type P2PMediaLoaderOptions = { videoFiles: VideoFile[] } -export type CommonOptions = { +export interface CustomizationOptions { + startTime: number | string + stopTime: number | string + + controls?: boolean + muted?: boolean + loop?: boolean + subtitle?: string + + peertubeLink: boolean +} + +export interface CommonOptions extends CustomizationOptions { playerElement: HTMLVideoElement onPlayerElementChange: (element: HTMLVideoElement) => void @@ -48,20 +61,14 @@ export type CommonOptions = { enableHotkeys: boolean inactivityTimeout: number poster: string - startTime: number | string theaterMode: boolean captions: boolean - peertubeLink: boolean videoViewUrl: string embedUrl: string language?: string - controls?: boolean - muted?: boolean - loop?: boolean - subtitle?: string videoCaptions: VideoJSCaption[] @@ -80,6 +87,7 @@ export class PeertubePlayerManager { private static videojsLocaleCache: { [ path: string ]: any } = {} private static playerElementClassName: string + private static onPlayerChange: (player: any) => void static getServerTranslations (serverUrl: string, locale: string) { const path = PeertubePlayerManager.getLocalePath(serverUrl, locale) @@ -94,9 +102,10 @@ export class PeertubePlayerManager { }) } - static async initialize (mode: PlayerMode, options: PeertubePlayerManagerOptions) { + static async initialize (mode: PlayerMode, options: PeertubePlayerManagerOptions, onPlayerChange: (player: any) => void) { let p2pMediaLoader: any + this.onPlayerChange = onPlayerChange this.playerElementClassName = options.common.playerElement.className if (mode === 'webtorrent') await import('./webtorrent/webtorrent-plugin') @@ -116,11 +125,16 @@ export class PeertubePlayerManager { videojs(options.common.playerElement, videojsOptions, function (this: any) { const player = this - player.tech_.on('error', () => { - // Fallback to webtorrent? - if (mode === 'p2p-media-loader') { - self.fallbackToWebTorrent(player, options) - } + let alreadyFallback = false + + player.tech_.one('error', () => { + if (!alreadyFallback) self.maybeFallbackToWebTorrent(mode, player, options) + alreadyFallback = true + }) + + player.one('error', () => { + if (!alreadyFallback) self.maybeFallbackToWebTorrent(mode, player, options) + alreadyFallback = true }) self.addContextMenu(mode, player, options.common.embedUrl) @@ -130,12 +144,19 @@ export class PeertubePlayerManager { }) } - private static async fallbackToWebTorrent (player: any, options: PeertubePlayerManagerOptions) { + private static async maybeFallbackToWebTorrent (currentMode: PlayerMode, player: any, options: PeertubePlayerManagerOptions) { + if (currentMode === 'webtorrent') return + + console.log('Fallback to webtorrent.') + const newVideoElement = document.createElement('video') newVideoElement.className = this.playerElementClassName // VideoJS wraps our video element inside a div - const currentParentPlayerElement = options.common.playerElement.parentNode + let currentParentPlayerElement = options.common.playerElement.parentNode + // Fix on IOS, don't ask me why + if (!currentParentPlayerElement) currentParentPlayerElement = document.getElementById(options.common.playerElement.id).parentNode + currentParentPlayerElement.parentNode.insertBefore(newVideoElement, currentParentPlayerElement) options.common.playerElement = newVideoElement @@ -153,6 +174,8 @@ export class PeertubePlayerManager { const player = this self.addContextMenu(mode, player, options.common.embedUrl) + + PeertubePlayerManager.onPlayerChange(player) }) } @@ -196,17 +219,20 @@ export class PeertubePlayerManager { autoplay, // Use peertube plugin autoplay because we get the file by webtorrent videoViewUrl: commonOptions.videoViewUrl, videoDuration: commonOptions.videoDuration, - startTime: commonOptions.startTime, userWatching: commonOptions.userWatching, subtitle: commonOptions.subtitle, - videoCaptions: commonOptions.videoCaptions + videoCaptions: commonOptions.videoCaptions, + stopTime: commonOptions.stopTime } } if (mode === 'p2p-media-loader') { + const redundancyUrlManager = new RedundancyUrlManager(options.p2pMediaLoader.redundancyBaseUrls) + const p2pMediaLoader: P2PMediaLoaderPluginOptions = { - redundancyBaseUrls: options.p2pMediaLoader.redundancyBaseUrls, + redundancyUrlManager, type: 'application/x-mpegURL', + startTime: commonOptions.startTime, src: p2pMediaLoaderOptions.playlistUrl } @@ -219,7 +245,7 @@ export class PeertubePlayerManager { segmentValidator: segmentValidatorFactory(options.p2pMediaLoader.segmentsSha256Url), rtcConfig: getRtcConfig(), requiredSegmentsPriority: 5, - segmentUrlBuilder: segmentUrlBuilderFactory(options.p2pMediaLoader.redundancyBaseUrls) + segmentUrlBuilder: segmentUrlBuilderFactory(redundancyUrlManager) }, segments: { swarmId: p2pMediaLoaderOptions.playlistUrl @@ -251,7 +277,8 @@ export class PeertubePlayerManager { autoplay, videoDuration: commonOptions.videoDuration, playerElement: commonOptions.playerElement, - videoFiles: webtorrentOptions.videoFiles + videoFiles: webtorrentOptions.videoFiles, + startTime: commonOptions.startTime } Object.assign(plugins, { webtorrent }) @@ -426,7 +453,7 @@ export class PeertubePlayerManager { label: player.localize('Copy the video URL at the current time'), listener: function () { const player = this as videojs.Player - copyToClipboard(buildVideoLink(player.currentTime())) + copyToClipboard(buildVideoLink({ startTime: player.currentTime() })) } }, {