export type CommonOptions = {
playerElement: HTMLVideoElement
+ onPlayerElementChange: (element: HTMLVideoElement) => void
autoplay: boolean
videoDuration: number
export type PeertubePlayerManagerOptions = {
common: CommonOptions,
- webtorrent?: WebtorrentOptions,
+ webtorrent: WebtorrentOptions,
p2pMediaLoader?: P2PMediaLoaderOptions
}
export class PeertubePlayerManager {
private static videojsLocaleCache: { [ path: string ]: any } = {}
+ private static playerElementClassName: string
static getServerTranslations (serverUrl: string, locale: string) {
const path = PeertubePlayerManager.getLocalePath(serverUrl, locale)
static async initialize (mode: PlayerMode, options: PeertubePlayerManagerOptions) {
let p2pMediaLoader: any
+ this.playerElementClassName = options.common.playerElement.className
+
if (mode === 'webtorrent') await import('./webtorrent/webtorrent-plugin')
if (mode === 'p2p-media-loader') {
[ p2pMediaLoader ] = await Promise.all([
videojs(options.common.playerElement, videojsOptions, function (this: any) {
const player = this
+ player.tech_.one('error', () => self.maybeFallbackToWebTorrent(mode, player, options))
+ player.one('error', () => self.maybeFallbackToWebTorrent(mode, player, options))
+
self.addContextMenu(mode, player, options.common.embedUrl)
return res(player)
})
}
+ 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
+ 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
+ options.common.onPlayerElementChange(newVideoElement)
+
+ player.dispose()
+
+ await import('./webtorrent/webtorrent-plugin')
+
+ const mode = 'webtorrent'
+ const videojsOptions = this.getVideojsOptions(mode, options)
+
+ const self = this
+ videojs(newVideoElement, videojsOptions, function (this: any) {
+ const player = this
+
+ self.addContextMenu(mode, player, options.common.embedUrl)
+ })
+ }
+
private static loadLocaleInVideoJS (serverUrl: string, locale: string) {
const path = PeertubePlayerManager.getLocalePath(serverUrl, locale)
// It is the default locale, nothing to translate
}
}
- if (p2pMediaLoaderOptions) {
+ if (mode === 'p2p-media-loader') {
const p2pMediaLoader: P2PMediaLoaderPluginOptions = {
redundancyBaseUrls: options.p2pMediaLoader.redundancyBaseUrls,
type: 'application/x-mpegURL',
html5 = streamrootHls.html5
}
- if (webtorrentOptions) {
+ if (mode === 'webtorrent') {
const webtorrent = {
autoplay,
videoDuration: commonOptions.videoDuration,
: undefined, // Undefined so the player knows it has to check the local storage
poster: commonOptions.poster,
- autoplay,
+ autoplay: autoplay === true ? 'any' : autoplay, // Use 'any' instead of true to get notifier by videojs if autoplay fails
inactivityTimeout: commonOptions.inactivityTimeout,
playbackRates: [ 0.5, 0.75, 1, 1.25, 1.5, 2 ],
plugins,