]>
Commit | Line | Data |
---|---|---|
1 | import * as Hlsjs from 'hls.js/dist/hls.light.js' | |
2 | import { Events, Segment } from 'p2p-media-loader-core' | |
3 | import { Engine, initHlsJsPlayer, initVideoJsContribHlsJsPlayer } from 'p2p-media-loader-hlsjs' | |
4 | import videojs from 'video.js' | |
5 | import { timeToInt } from '@shared/core-utils' | |
6 | import { P2PMediaLoaderPluginOptions, PlayerNetworkInfo } from '../peertube-videojs-typings' | |
7 | import { registerConfigPlugin, registerSourceHandler } from './hls-plugin' | |
8 | ||
9 | registerConfigPlugin(videojs) | |
10 | registerSourceHandler(videojs) | |
11 | ||
12 | const Plugin = videojs.getPlugin('plugin') | |
13 | class P2pMediaLoaderPlugin extends Plugin { | |
14 | ||
15 | private readonly CONSTANTS = { | |
16 | INFO_SCHEDULER: 1000 // Don't change this | |
17 | } | |
18 | private readonly options: P2PMediaLoaderPluginOptions | |
19 | ||
20 | private hlsjs: Hlsjs | |
21 | private p2pEngine: Engine | |
22 | private statsP2PBytes = { | |
23 | pendingDownload: [] as number[], | |
24 | pendingUpload: [] as number[], | |
25 | numPeers: 0, | |
26 | totalDownload: 0, | |
27 | totalUpload: 0 | |
28 | } | |
29 | private statsHTTPBytes = { | |
30 | pendingDownload: [] as number[], | |
31 | pendingUpload: [] as number[], | |
32 | totalDownload: 0, | |
33 | totalUpload: 0 | |
34 | } | |
35 | private startTime: number | |
36 | ||
37 | private networkInfoInterval: any | |
38 | ||
39 | private hlsjsCurrentLevel: number | |
40 | private hlsjsLevels: Hlsjs.Level[] | |
41 | ||
42 | constructor (player: videojs.Player, options?: P2PMediaLoaderPluginOptions) { | |
43 | super(player) | |
44 | ||
45 | this.options = options | |
46 | ||
47 | // FIXME: typings https://github.com/Microsoft/TypeScript/issues/14080 | |
48 | if (!(videojs as any).Html5Hlsjs) { | |
49 | console.warn('HLS.js does not seem to be supported. Try to fallback to built in HLS.') | |
50 | ||
51 | if (!player.canPlayType('application/vnd.apple.mpegurl')) { | |
52 | const message = 'Cannot fallback to built-in HLS' | |
53 | console.warn(message) | |
54 | ||
55 | player.ready(() => player.trigger('error', new Error(message))) | |
56 | return | |
57 | } | |
58 | } else { | |
59 | // FIXME: typings https://github.com/Microsoft/TypeScript/issues/14080 | |
60 | (videojs as any).Html5Hlsjs.addHook('beforeinitialize', (videojsPlayer: any, hlsjs: any) => { | |
61 | this.hlsjs = hlsjs | |
62 | }) | |
63 | ||
64 | initVideoJsContribHlsJsPlayer(player) | |
65 | } | |
66 | ||
67 | this.startTime = timeToInt(options.startTime) | |
68 | ||
69 | player.src({ | |
70 | type: options.type, | |
71 | src: options.src | |
72 | }) | |
73 | ||
74 | player.ready(() => { | |
75 | this.initializeCore() | |
76 | ||
77 | if ((videojs as any).Html5Hlsjs) { | |
78 | this.initializePlugin() | |
79 | } | |
80 | }) | |
81 | } | |
82 | ||
83 | dispose () { | |
84 | if (this.hlsjs) this.hlsjs.destroy() | |
85 | if (this.p2pEngine) this.p2pEngine.destroy() | |
86 | ||
87 | clearInterval(this.networkInfoInterval) | |
88 | } | |
89 | ||
90 | getCurrentLevel () { | |
91 | return this.hlsjsLevels.find(l => l.level === this.hlsjsCurrentLevel) | |
92 | } | |
93 | ||
94 | getLiveLatency () { | |
95 | return undefined as number | |
96 | // FIXME: Use latency when hls >= V1 | |
97 | // return this.hlsjs.latency | |
98 | } | |
99 | ||
100 | getHLSJS () { | |
101 | return this.hlsjs | |
102 | } | |
103 | ||
104 | private initializeCore () { | |
105 | this.player.one('play', () => { | |
106 | this.player.addClass('vjs-has-big-play-button-clicked') | |
107 | }) | |
108 | ||
109 | this.player.one('canplay', () => { | |
110 | if (this.startTime) { | |
111 | this.player.currentTime(this.startTime) | |
112 | } | |
113 | }) | |
114 | } | |
115 | ||
116 | private initializePlugin () { | |
117 | initHlsJsPlayer(this.hlsjs) | |
118 | ||
119 | // FIXME: typings | |
120 | const options = this.player.tech(true).options_ as any | |
121 | this.p2pEngine = options.hlsjsConfig.loader.getEngine() | |
122 | ||
123 | this.hlsjs.on(Hlsjs.Events.LEVEL_SWITCHING, (_: any, data: any) => { | |
124 | this.trigger('resolutionChange', { auto: this.hlsjs.autoLevelEnabled, resolutionId: data.height }) | |
125 | }) | |
126 | ||
127 | this.hlsjs.on(Hlsjs.Events.MANIFEST_LOADED, (_: any, data: any) => { | |
128 | this.trigger('resolutionsLoaded') | |
129 | }) | |
130 | ||
131 | this.p2pEngine.on(Events.SegmentError, (segment: Segment, err) => { | |
132 | console.error('Segment error.', segment, err) | |
133 | ||
134 | this.options.redundancyUrlManager.removeBySegmentUrl(segment.requestUrl) | |
135 | }) | |
136 | ||
137 | this.statsP2PBytes.numPeers = 1 + this.options.redundancyUrlManager.countBaseUrls() | |
138 | ||
139 | this.runStats() | |
140 | } | |
141 | ||
142 | private runStats () { | |
143 | this.p2pEngine.on(Events.PieceBytesDownloaded, (method: string, size: number) => { | |
144 | const elem = method === 'p2p' ? this.statsP2PBytes : this.statsHTTPBytes | |
145 | ||
146 | elem.pendingDownload.push(size) | |
147 | elem.totalDownload += size | |
148 | }) | |
149 | ||
150 | this.p2pEngine.on(Events.PieceBytesUploaded, (method: string, size: number) => { | |
151 | const elem = method === 'p2p' ? this.statsP2PBytes : this.statsHTTPBytes | |
152 | ||
153 | elem.pendingUpload.push(size) | |
154 | elem.totalUpload += size | |
155 | }) | |
156 | ||
157 | this.p2pEngine.on(Events.PeerConnect, () => this.statsP2PBytes.numPeers++) | |
158 | this.p2pEngine.on(Events.PeerClose, () => this.statsP2PBytes.numPeers--) | |
159 | ||
160 | this.hlsjs.on(Hlsjs.Events.MANIFEST_PARSED, (_e, manifest) => { | |
161 | this.hlsjsCurrentLevel = manifest.firstLevel | |
162 | this.hlsjsLevels = manifest.levels | |
163 | }) | |
164 | this.hlsjs.on(Hlsjs.Events.LEVEL_LOADED, (_e, level) => { | |
165 | this.hlsjsCurrentLevel = level.levelId || (level as any).id | |
166 | }) | |
167 | ||
168 | this.networkInfoInterval = setInterval(() => { | |
169 | const p2pDownloadSpeed = this.arraySum(this.statsP2PBytes.pendingDownload) | |
170 | const p2pUploadSpeed = this.arraySum(this.statsP2PBytes.pendingUpload) | |
171 | ||
172 | const httpDownloadSpeed = this.arraySum(this.statsHTTPBytes.pendingDownload) | |
173 | const httpUploadSpeed = this.arraySum(this.statsHTTPBytes.pendingUpload) | |
174 | ||
175 | this.statsP2PBytes.pendingDownload = [] | |
176 | this.statsP2PBytes.pendingUpload = [] | |
177 | this.statsHTTPBytes.pendingDownload = [] | |
178 | this.statsHTTPBytes.pendingUpload = [] | |
179 | ||
180 | return this.player.trigger('p2pInfo', { | |
181 | source: 'p2p-media-loader', | |
182 | http: { | |
183 | downloadSpeed: httpDownloadSpeed, | |
184 | uploadSpeed: httpUploadSpeed, | |
185 | downloaded: this.statsHTTPBytes.totalDownload, | |
186 | uploaded: this.statsHTTPBytes.totalUpload | |
187 | }, | |
188 | p2p: { | |
189 | downloadSpeed: p2pDownloadSpeed, | |
190 | uploadSpeed: p2pUploadSpeed, | |
191 | numPeers: this.statsP2PBytes.numPeers, | |
192 | downloaded: this.statsP2PBytes.totalDownload, | |
193 | uploaded: this.statsP2PBytes.totalUpload | |
194 | }, | |
195 | bandwidthEstimate: (this.hlsjs as any).bandwidthEstimate / 8 | |
196 | } as PlayerNetworkInfo) | |
197 | }, this.CONSTANTS.INFO_SCHEDULER) | |
198 | } | |
199 | ||
200 | private arraySum (data: number[]) { | |
201 | return data.reduce((a: number, b: number) => a + b, 0) | |
202 | } | |
203 | } | |
204 | ||
205 | videojs.registerPlugin('p2pMediaLoader', P2pMediaLoaderPlugin) | |
206 | export { P2pMediaLoaderPlugin } |