]>
Commit | Line | Data |
---|---|---|
2adfc7ea C |
1 | // FIXME: something weird with our path definition in tsconfig and typings |
2 | // @ts-ignore | |
3 | import * as videojs from 'video.js' | |
09209296 C |
4 | import { P2PMediaLoaderPluginOptions, PlayerNetworkInfo, VideoJSComponentInterface } from '../peertube-videojs-typings' |
5 | import { Engine, initHlsJsPlayer, initVideoJsContribHlsJsPlayer } from 'p2p-media-loader-hlsjs' | |
6 | import { Events } from 'p2p-media-loader-core' | |
e2f01c47 | 7 | import { timeToInt } from '../utils' |
2adfc7ea C |
8 | |
9 | // videojs-hlsjs-plugin needs videojs in window | |
10 | window['videojs'] = videojs | |
4348a27d | 11 | require('@streamroot/videojs-hlsjs-plugin') |
2adfc7ea | 12 | |
2adfc7ea C |
13 | const Plugin: VideoJSComponentInterface = videojs.getPlugin('plugin') |
14 | class P2pMediaLoaderPlugin extends Plugin { | |
15 | ||
3b6f205c C |
16 | private readonly CONSTANTS = { |
17 | INFO_SCHEDULER: 1000 // Don't change this | |
18 | } | |
09209296 | 19 | private readonly options: P2PMediaLoaderPluginOptions |
3b6f205c | 20 | |
4348a27d | 21 | private hlsjs: any // Don't type hlsjs to not bundle the module |
3b6f205c C |
22 | private p2pEngine: Engine |
23 | private statsP2PBytes = { | |
24 | pendingDownload: [] as number[], | |
25 | pendingUpload: [] as number[], | |
26 | numPeers: 0, | |
27 | totalDownload: 0, | |
28 | totalUpload: 0 | |
29 | } | |
09209296 C |
30 | private statsHTTPBytes = { |
31 | pendingDownload: [] as number[], | |
32 | pendingUpload: [] as number[], | |
33 | totalDownload: 0, | |
34 | totalUpload: 0 | |
35 | } | |
e2f01c47 | 36 | private startTime: number |
3b6f205c C |
37 | |
38 | private networkInfoInterval: any | |
39 | ||
2adfc7ea C |
40 | constructor (player: videojs.Player, options: P2PMediaLoaderPluginOptions) { |
41 | super(player, options) | |
42 | ||
09209296 C |
43 | this.options = options |
44 | ||
96cb4527 C |
45 | if (!videojs.Html5Hlsjs) { |
46 | const message = 'HLS.js does not seem to be supported.' | |
47 | console.warn(message) | |
48 | ||
49 | player.ready(() => player.trigger('error', new Error(message))) | |
50 | return | |
51 | } | |
52 | ||
4348a27d | 53 | videojs.Html5Hlsjs.addHook('beforeinitialize', (videojsPlayer: any, hlsjs: any) => { |
3b6f205c | 54 | this.hlsjs = hlsjs |
3b6f205c C |
55 | }) |
56 | ||
57 | initVideoJsContribHlsJsPlayer(player) | |
2adfc7ea | 58 | |
e2f01c47 | 59 | this.startTime = timeToInt(options.startTime) |
dfe4294a | 60 | console.log(this.startTime) |
e2f01c47 | 61 | |
2adfc7ea C |
62 | player.src({ |
63 | type: options.type, | |
64 | src: options.src | |
65 | }) | |
09209296 | 66 | |
e2f01c47 | 67 | player.one('play', () => { |
6ec0b75b C |
68 | player.addClass('vjs-has-big-play-button-clicked') |
69 | }) | |
70 | ||
09209296 | 71 | player.ready(() => this.initialize()) |
2adfc7ea C |
72 | } |
73 | ||
3b6f205c | 74 | dispose () { |
6ec0b75b C |
75 | if (this.hlsjs) this.hlsjs.destroy() |
76 | if (this.p2pEngine) this.p2pEngine.destroy() | |
77 | ||
3b6f205c C |
78 | clearInterval(this.networkInfoInterval) |
79 | } | |
80 | ||
81 | private initialize () { | |
09209296 C |
82 | initHlsJsPlayer(this.hlsjs) |
83 | ||
6ec0b75b C |
84 | const tech = this.player.tech_ |
85 | this.p2pEngine = tech.options_.hlsjsConfig.loader.getEngine() | |
3b6f205c | 86 | |
4348a27d C |
87 | // Avoid using constants to not import hls.hs |
88 | // https://github.com/video-dev/hls.js/blob/master/src/events.js#L37 | |
89 | this.hlsjs.on('hlsLevelSwitching', (_: any, data: any) => { | |
3b6f205c C |
90 | this.trigger('resolutionChange', { auto: this.hlsjs.autoLevelEnabled, resolutionId: data.height }) |
91 | }) | |
92 | ||
09209296 C |
93 | this.p2pEngine.on(Events.SegmentError, (segment, err) => { |
94 | console.error('Segment error.', segment, err) | |
95 | }) | |
96 | ||
97 | this.statsP2PBytes.numPeers = 1 + this.options.redundancyBaseUrls.length | |
98 | ||
3b6f205c | 99 | this.runStats() |
e2f01c47 C |
100 | |
101 | this.hlsjs.on('hlsLevelLoaded', () => { | |
dfe4294a C |
102 | console.log('hello1') |
103 | if (this.startTime) { | |
104 | this.player.currentTime(this.startTime) | |
105 | } | |
e2f01c47 C |
106 | |
107 | this.hlsjs.off('hlsLevelLoaded', this) | |
108 | }) | |
dfe4294a C |
109 | |
110 | this.hlsjs.on('hlsFragParsed', () => { | |
111 | console.log('hello2') | |
112 | }) | |
113 | ||
114 | this.hlsjs.on('hlsFragBuffered', () => { | |
115 | console.log('hello 3') | |
116 | }) | |
117 | ||
118 | this.player.one('loadedmetadata', () => { | |
119 | console.log('hello 4') | |
120 | }) | |
3b6f205c C |
121 | } |
122 | ||
123 | private runStats () { | |
124 | this.p2pEngine.on(Events.PieceBytesDownloaded, (method: string, size: number) => { | |
09209296 C |
125 | const elem = method === 'p2p' ? this.statsP2PBytes : this.statsHTTPBytes |
126 | ||
127 | elem.pendingDownload.push(size) | |
128 | elem.totalDownload += size | |
3b6f205c C |
129 | }) |
130 | ||
131 | this.p2pEngine.on(Events.PieceBytesUploaded, (method: string, size: number) => { | |
09209296 C |
132 | const elem = method === 'p2p' ? this.statsP2PBytes : this.statsHTTPBytes |
133 | ||
134 | elem.pendingUpload.push(size) | |
135 | elem.totalUpload += size | |
3b6f205c C |
136 | }) |
137 | ||
138 | this.p2pEngine.on(Events.PeerConnect, () => this.statsP2PBytes.numPeers++) | |
139 | this.p2pEngine.on(Events.PeerClose, () => this.statsP2PBytes.numPeers--) | |
140 | ||
141 | this.networkInfoInterval = setInterval(() => { | |
09209296 C |
142 | const p2pDownloadSpeed = this.arraySum(this.statsP2PBytes.pendingDownload) |
143 | const p2pUploadSpeed = this.arraySum(this.statsP2PBytes.pendingUpload) | |
144 | ||
145 | const httpDownloadSpeed = this.arraySum(this.statsHTTPBytes.pendingDownload) | |
146 | const httpUploadSpeed = this.arraySum(this.statsHTTPBytes.pendingUpload) | |
3b6f205c C |
147 | |
148 | this.statsP2PBytes.pendingDownload = [] | |
149 | this.statsP2PBytes.pendingUpload = [] | |
09209296 C |
150 | this.statsHTTPBytes.pendingDownload = [] |
151 | this.statsHTTPBytes.pendingUpload = [] | |
3b6f205c C |
152 | |
153 | return this.player.trigger('p2pInfo', { | |
09209296 C |
154 | http: { |
155 | downloadSpeed: httpDownloadSpeed, | |
156 | uploadSpeed: httpUploadSpeed, | |
157 | downloaded: this.statsHTTPBytes.totalDownload, | |
158 | uploaded: this.statsHTTPBytes.totalUpload | |
159 | }, | |
3b6f205c | 160 | p2p: { |
09209296 C |
161 | downloadSpeed: p2pDownloadSpeed, |
162 | uploadSpeed: p2pUploadSpeed, | |
3b6f205c C |
163 | numPeers: this.statsP2PBytes.numPeers, |
164 | downloaded: this.statsP2PBytes.totalDownload, | |
165 | uploaded: this.statsP2PBytes.totalUpload | |
166 | } | |
167 | } as PlayerNetworkInfo) | |
168 | }, this.CONSTANTS.INFO_SCHEDULER) | |
169 | } | |
09209296 C |
170 | |
171 | private arraySum (data: number[]) { | |
172 | return data.reduce((a: number, b: number) => a + b, 0) | |
173 | } | |
2adfc7ea C |
174 | } |
175 | ||
176 | videojs.registerPlugin('p2pMediaLoader', P2pMediaLoaderPlugin) | |
177 | export { P2pMediaLoaderPlugin } |