]> git.immae.eu Git - github/Chocobozzz/PeerTube.git/blame - client/src/assets/player/resolution-menu-button.ts
Create webtorrent client on player load
[github/Chocobozzz/PeerTube.git] / client / src / assets / player / resolution-menu-button.ts
CommitLineData
c6352f2c
C
1import * as videojs from 'video.js'
2import { VideoJSComponentInterface, videojsUntyped } from './peertube-videojs-typings'
3import { ResolutionMenuItem } from './resolution-menu-item'
4
5const Menu: VideoJSComponentInterface = videojsUntyped.getComponent('Menu')
6const MenuButton: VideoJSComponentInterface = videojsUntyped.getComponent('MenuButton')
7class ResolutionMenuButton extends MenuButton {
8 label: HTMLElement
9
10 constructor (player: videojs.Player, options) {
c6352f2c 11 super(player, options)
c6352f2c
C
12 this.player = player
13
14 player.peertube().on('videoFileUpdate', () => this.updateLabel())
15 }
16
17 createEl () {
18 const el = super.createEl()
19
20 this.labelEl_ = videojsUntyped.dom.createEl('div', {
21 className: 'vjs-resolution-value',
a8462c8e 22 innerHTML: this.buildLabelHTML()
c6352f2c
C
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 () {
b891f9bc 35 const menu = new Menu(this.player_)
c6352f2c
C
36 for (const videoFile of this.player_.peertube().videoFiles) {
37 menu.addChild(new ResolutionMenuItem(
38 this.player_,
39 {
40 id: videoFile.resolution.id,
41 label: videoFile.resolution.label,
42 src: videoFile.magnetUri
43 })
44 )
45 }
46
a8462c8e
C
47 menu.addChild(new ResolutionMenuItem(
48 this.player_,
49 {
50 id: -1,
e945b184 51 label: this.player_.localize('Auto'),
a8462c8e
C
52 src: null
53 }
54 ))
55
c6352f2c
C
56 return menu
57 }
58
59 updateLabel () {
60 if (!this.labelEl_) return
61
a8462c8e 62 this.labelEl_.innerHTML = this.buildLabelHTML()
c6352f2c
C
63 }
64
65 buildCSSClass () {
66 return super.buildCSSClass() + ' vjs-resolution-button'
67 }
68
69 buildWrapperCSSClass () {
70 return 'vjs-resolution-control ' + super.buildWrapperCSSClass()
71 }
a8462c8e
C
72
73 private buildLabelHTML () {
74 return this.player_.peertube().getCurrentResolutionLabel()
75 }
c6352f2c 76}
e945b184
C
77ResolutionMenuButton.prototype.controlText_ = 'Quality'
78
c6352f2c 79MenuButton.registerComponent('ResolutionMenuButton', ResolutionMenuButton)