]>
Commit | Line | Data |
---|---|---|
1 | import { VideoJSComponentInterface, videojsUntyped } from './peertube-videojs-typings' | |
2 | import { ResolutionMenuItem } from './resolution-menu-item' | |
3 | ||
4 | const Menu: VideoJSComponentInterface = videojsUntyped.getComponent('Menu') | |
5 | const MenuButton: VideoJSComponentInterface = videojsUntyped.getComponent('MenuButton') | |
6 | class ResolutionMenuButton extends MenuButton { | |
7 | label: HTMLElement | |
8 | ||
9 | constructor (player: any, options: any) { | |
10 | super(player, options) | |
11 | this.player = player | |
12 | ||
13 | player.peertube().on('videoFileUpdate', () => this.updateLabel()) | |
14 | player.peertube().on('autoResolutionUpdate', () => this.updateLabel()) | |
15 | } | |
16 | ||
17 | createEl () { | |
18 | const el = super.createEl() | |
19 | ||
20 | this.labelEl_ = videojsUntyped.dom.createEl('div', { | |
21 | className: 'vjs-resolution-value', | |
22 | innerHTML: this.buildLabelHTML() | |
23 | }) | |
24 | ||
25 | el.appendChild(this.labelEl_) | |
26 | ||
27 | return el | |
28 | } | |
29 | ||
30 | updateARIAAttributes () { | |
31 | this.el().setAttribute('aria-label', 'Quality') | |
32 | } | |
33 | ||
34 | createMenu () { | |
35 | const menu = new Menu(this.player_) | |
36 | for (const videoFile of this.player_.peertube().videoFiles) { | |
37 | let label = videoFile.resolution.label | |
38 | if (videoFile.fps && videoFile.fps >= 50) { | |
39 | label += videoFile.fps | |
40 | } | |
41 | ||
42 | menu.addChild(new ResolutionMenuItem( | |
43 | this.player_, | |
44 | { | |
45 | id: videoFile.resolution.id, | |
46 | label, | |
47 | src: videoFile.magnetUri | |
48 | }) | |
49 | ) | |
50 | } | |
51 | ||
52 | menu.addChild(new ResolutionMenuItem( | |
53 | this.player_, | |
54 | { | |
55 | id: -1, | |
56 | label: this.player_.localize('Auto'), | |
57 | src: null | |
58 | } | |
59 | )) | |
60 | ||
61 | return menu | |
62 | } | |
63 | ||
64 | updateLabel () { | |
65 | if (!this.labelEl_) return | |
66 | ||
67 | this.labelEl_.innerHTML = this.buildLabelHTML() | |
68 | } | |
69 | ||
70 | buildCSSClass () { | |
71 | return super.buildCSSClass() + ' vjs-resolution-button' | |
72 | } | |
73 | ||
74 | buildWrapperCSSClass () { | |
75 | return 'vjs-resolution-control ' + super.buildWrapperCSSClass() | |
76 | } | |
77 | ||
78 | private buildLabelHTML () { | |
79 | return this.player_.peertube().getCurrentResolutionLabel() | |
80 | } | |
81 | } | |
82 | ResolutionMenuButton.prototype.controlText_ = 'Quality' | |
83 | ||
84 | MenuButton.registerComponent('ResolutionMenuButton', ResolutionMenuButton) |