1 import videojs, { VideoJsPlayer } from 'video.js'
2 import { P2PMediaLoaderPluginOptions, PlayerNetworkInfo } from '../peertube-videojs-typings'
3 import { Engine, initHlsJsPlayer, initVideoJsContribHlsJsPlayer } from 'p2p-media-loader-hlsjs'
4 import { Events, Segment } from 'p2p-media-loader-core'
5 import { timeToInt } from '../utils'
6 import { registerConfigPlugin, registerSourceHandler } from './hls-plugin'
7 import * as Hlsjs from 'hls.js/dist/hls.light.js'
9 registerConfigPlugin(videojs)
10 registerSourceHandler(videojs)
12 const Plugin = videojs.getPlugin('plugin')
13 class P2pMediaLoaderPlugin extends Plugin {
15 private readonly CONSTANTS = {
16 INFO_SCHEDULER: 1000 // Don't change this
18 private readonly options: P2PMediaLoaderPluginOptions
21 private p2pEngine: Engine
22 private statsP2PBytes = {
23 pendingDownload: [] as number[],
24 pendingUpload: [] as number[],
29 private statsHTTPBytes = {
30 pendingDownload: [] as number[],
31 pendingUpload: [] as number[],
35 private startTime: number
37 private networkInfoInterval: any
39 constructor (player: VideoJsPlayer, options?: P2PMediaLoaderPluginOptions) {
42 this.options = options
44 // FIXME: typings https://github.com/Microsoft/TypeScript/issues/14080
45 if (!(videojs as any).Html5Hlsjs) {
46 const message = 'HLS.js does not seem to be supported.'
49 player.ready(() => player.trigger('error', new Error(message)))
53 // FIXME: typings https://github.com/Microsoft/TypeScript/issues/14080
54 (videojs as any).Html5Hlsjs.addHook('beforeinitialize', (videojsPlayer: any, hlsjs: any) => {
58 initVideoJsContribHlsJsPlayer(player)
60 this.startTime = timeToInt(options.startTime)
67 player.one('play', () => {
68 player.addClass('vjs-has-big-play-button-clicked')
71 player.ready(() => this.initialize())
75 if (this.hlsjs) this.hlsjs.destroy()
76 if (this.p2pEngine) this.p2pEngine.destroy()
78 clearInterval(this.networkInfoInterval)
85 private initialize () {
86 initHlsJsPlayer(this.hlsjs)
89 const options = this.player.tech(true).options_ as any
90 this.p2pEngine = options.hlsjsConfig.loader.getEngine()
92 this.hlsjs.on(Hlsjs.Events.LEVEL_SWITCHING, (_: any, data: any) => {
93 this.trigger('resolutionChange', { auto: this.hlsjs.autoLevelEnabled, resolutionId: data.height })
96 this.p2pEngine.on(Events.SegmentError, (segment: Segment, err) => {
97 console.error('Segment error.', segment, err)
99 this.options.redundancyUrlManager.removeBySegmentUrl(segment.requestUrl)
102 this.statsP2PBytes.numPeers = 1 + this.options.redundancyUrlManager.countBaseUrls()
106 this.player.one('canplay', () => {
107 if (this.startTime) {
108 this.player.currentTime(this.startTime)
113 private runStats () {
114 this.p2pEngine.on(Events.PieceBytesDownloaded, (method: string, size: number) => {
115 const elem = method === 'p2p' ? this.statsP2PBytes : this.statsHTTPBytes
117 elem.pendingDownload.push(size)
118 elem.totalDownload += size
121 this.p2pEngine.on(Events.PieceBytesUploaded, (method: string, size: number) => {
122 const elem = method === 'p2p' ? this.statsP2PBytes : this.statsHTTPBytes
124 elem.pendingUpload.push(size)
125 elem.totalUpload += size
128 this.p2pEngine.on(Events.PeerConnect, () => this.statsP2PBytes.numPeers++)
129 this.p2pEngine.on(Events.PeerClose, () => this.statsP2PBytes.numPeers--)
131 this.networkInfoInterval = setInterval(() => {
132 const p2pDownloadSpeed = this.arraySum(this.statsP2PBytes.pendingDownload)
133 const p2pUploadSpeed = this.arraySum(this.statsP2PBytes.pendingUpload)
135 const httpDownloadSpeed = this.arraySum(this.statsHTTPBytes.pendingDownload)
136 const httpUploadSpeed = this.arraySum(this.statsHTTPBytes.pendingUpload)
138 this.statsP2PBytes.pendingDownload = []
139 this.statsP2PBytes.pendingUpload = []
140 this.statsHTTPBytes.pendingDownload = []
141 this.statsHTTPBytes.pendingUpload = []
143 return this.player.trigger('p2pInfo', {
145 downloadSpeed: httpDownloadSpeed,
146 uploadSpeed: httpUploadSpeed,
147 downloaded: this.statsHTTPBytes.totalDownload,
148 uploaded: this.statsHTTPBytes.totalUpload
151 downloadSpeed: p2pDownloadSpeed,
152 uploadSpeed: p2pUploadSpeed,
153 numPeers: this.statsP2PBytes.numPeers,
154 downloaded: this.statsP2PBytes.totalDownload,
155 uploaded: this.statsP2PBytes.totalUpload
157 } as PlayerNetworkInfo)
158 }, this.CONSTANTS.INFO_SCHEDULER)
161 private arraySum (data: number[]) {
162 return data.reduce((a: number, b: number) => a + b, 0)
166 videojs.registerPlugin('p2pMediaLoader', P2pMediaLoaderPlugin)
167 export { P2pMediaLoaderPlugin }