aboutsummaryrefslogtreecommitdiffhomepage
path: root/client/src/assets/player/theater-button.ts
diff options
context:
space:
mode:
Diffstat (limited to 'client/src/assets/player/theater-button.ts')
-rw-r--r--client/src/assets/player/theater-button.ts46
1 files changed, 46 insertions, 0 deletions
diff --git a/client/src/assets/player/theater-button.ts b/client/src/assets/player/theater-button.ts
new file mode 100644
index 000000000..1d330e08f
--- /dev/null
+++ b/client/src/assets/player/theater-button.ts
@@ -0,0 +1,46 @@
1import { VideoJSComponentInterface, videojsUntyped } from './peertube-videojs-typings'
2import { getStoredTheater, saveTheaterInStore } from './utils'
3
4const Button: VideoJSComponentInterface = videojsUntyped.getComponent('Button')
5class TheaterButton extends Button {
6
7 private static readonly THEATER_MODE_CLASS = 'vjs-theater-enabled'
8
9 constructor (player, options) {
10 super(player, options)
11
12 const enabled = getStoredTheater()
13 if (enabled === true) {
14 this.player_.addClass(TheaterButton.THEATER_MODE_CLASS)
15 this.handleTheaterChange()
16 }
17 }
18
19 buildCSSClass () {
20 return `vjs-theater-control ${super.buildCSSClass()}`
21 }
22
23 handleTheaterChange () {
24 if (this.isTheaterEnabled()) {
25 this.controlText('Normal mode')
26 } else {
27 this.controlText('Theater mode')
28 }
29
30 saveTheaterInStore(this.isTheaterEnabled())
31 }
32
33 handleClick () {
34 this.player_.toggleClass(TheaterButton.THEATER_MODE_CLASS)
35
36 this.handleTheaterChange()
37 }
38
39 private isTheaterEnabled () {
40 return this.player_.hasClass(TheaterButton.THEATER_MODE_CLASS)
41 }
42}
43
44TheaterButton.prototype.controlText_ = 'Theater mode'
45
46TheaterButton.registerComponent('TheaterButton', TheaterButton)