diff options
Diffstat (limited to 'client/src/assets/player/videojs-components/resolution-menu-button.ts')
-rw-r--r-- | client/src/assets/player/videojs-components/resolution-menu-button.ts | 41 |
1 files changed, 8 insertions, 33 deletions
diff --git a/client/src/assets/player/videojs-components/resolution-menu-button.ts b/client/src/assets/player/videojs-components/resolution-menu-button.ts index 98e7f56fc..8bd5b4f03 100644 --- a/client/src/assets/player/videojs-components/resolution-menu-button.ts +++ b/client/src/assets/player/videojs-components/resolution-menu-button.ts | |||
@@ -1,6 +1,4 @@ | |||
1 | import videojs from 'video.js' | 1 | import videojs from 'video.js' |
2 | |||
3 | import { LoadedQualityData } from '../peertube-videojs-typings' | ||
4 | import { ResolutionMenuItem } from './resolution-menu-item' | 2 | import { ResolutionMenuItem } from './resolution-menu-item' |
5 | 3 | ||
6 | const Menu = videojs.getComponent('Menu') | 4 | const Menu = videojs.getComponent('Menu') |
@@ -13,9 +11,12 @@ class ResolutionMenuButton extends MenuButton { | |||
13 | 11 | ||
14 | this.controlText('Quality') | 12 | this.controlText('Quality') |
15 | 13 | ||
16 | player.tech(true).on('loadedqualitydata', (e: any, data: any) => this.buildQualities(data)) | 14 | player.peertubeResolutions().on('resolutionsAdded', () => this.buildQualities()) |
17 | 15 | ||
18 | player.peertube().on('resolutionChange', () => setTimeout(() => this.trigger('updateLabel'), 0)) | 16 | // For parent |
17 | player.peertubeResolutions().on('resolutionChanged', () => { | ||
18 | setTimeout(() => this.trigger('labelUpdated')) | ||
19 | }) | ||
19 | } | 20 | } |
20 | 21 | ||
21 | createEl () { | 22 | createEl () { |
@@ -58,20 +59,8 @@ class ResolutionMenuButton extends MenuButton { | |||
58 | }) | 59 | }) |
59 | } | 60 | } |
60 | 61 | ||
61 | private buildQualities (data: LoadedQualityData) { | 62 | private buildQualities () { |
62 | // The automatic resolution item will need other labels | 63 | for (const d of this.player().peertubeResolutions().getResolutions()) { |
63 | const labels: { [ id: number ]: string } = {} | ||
64 | |||
65 | data.qualityData.video.sort((a, b) => { | ||
66 | if (a.id > b.id) return -1 | ||
67 | if (a.id === b.id) return 0 | ||
68 | return 1 | ||
69 | }) | ||
70 | |||
71 | for (const d of data.qualityData.video) { | ||
72 | // Skip auto resolution, we'll add it ourselves | ||
73 | if (d.id === -1) continue | ||
74 | |||
75 | const label = d.label === '0p' | 64 | const label = d.label === '0p' |
76 | ? this.player().localize('Audio-only') | 65 | ? this.player().localize('Audio-only') |
77 | : d.label | 66 | : d.label |
@@ -81,25 +70,11 @@ class ResolutionMenuButton extends MenuButton { | |||
81 | { | 70 | { |
82 | id: d.id, | 71 | id: d.id, |
83 | label, | 72 | label, |
84 | selected: d.selected, | 73 | selected: d.selected |
85 | callback: data.qualitySwitchCallback | ||
86 | }) | 74 | }) |
87 | ) | 75 | ) |
88 | |||
89 | labels[d.id] = d.label | ||
90 | } | 76 | } |
91 | 77 | ||
92 | this.menu.addChild(new ResolutionMenuItem( | ||
93 | this.player_, | ||
94 | { | ||
95 | id: -1, | ||
96 | label: this.player_.localize('Auto'), | ||
97 | labels, | ||
98 | callback: data.qualitySwitchCallback, | ||
99 | selected: true // By default, in auto mode | ||
100 | } | ||
101 | )) | ||
102 | |||
103 | for (const m of this.menu.children()) { | 78 | for (const m of this.menu.children()) { |
104 | this.addClickListener(m) | 79 | this.addClickListener(m) |
105 | } | 80 | } |