]>
Commit | Line | Data |
---|---|---|
1 | // FIXME: something weird with our path definition in tsconfig and typings | |
2 | // @ts-ignore | |
3 | import * as videojs from 'video.js' | |
4 | ||
5 | import { VideoJSComponentInterface, videojsUntyped } from './peertube-videojs-typings' | |
6 | import { saveTheaterInStore, getStoredTheater } from './peertube-player-local-storage' | |
7 | ||
8 | const Button: VideoJSComponentInterface = videojsUntyped.getComponent('Button') | |
9 | class TheaterButton extends Button { | |
10 | ||
11 | private static readonly THEATER_MODE_CLASS = 'vjs-theater-enabled' | |
12 | ||
13 | constructor (player: videojs.Player, options: any) { | |
14 | super(player, options) | |
15 | ||
16 | const enabled = getStoredTheater() | |
17 | if (enabled === true) { | |
18 | this.player_.addClass(TheaterButton.THEATER_MODE_CLASS) | |
19 | this.handleTheaterChange() | |
20 | } | |
21 | } | |
22 | ||
23 | buildCSSClass () { | |
24 | return `vjs-theater-control ${super.buildCSSClass()}` | |
25 | } | |
26 | ||
27 | handleTheaterChange () { | |
28 | if (this.isTheaterEnabled()) { | |
29 | this.controlText('Normal mode') | |
30 | } else { | |
31 | this.controlText('Theater mode') | |
32 | } | |
33 | ||
34 | saveTheaterInStore(this.isTheaterEnabled()) | |
35 | } | |
36 | ||
37 | handleClick () { | |
38 | this.player_.toggleClass(TheaterButton.THEATER_MODE_CLASS) | |
39 | ||
40 | this.handleTheaterChange() | |
41 | } | |
42 | ||
43 | private isTheaterEnabled () { | |
44 | return this.player_.hasClass(TheaterButton.THEATER_MODE_CLASS) | |
45 | } | |
46 | } | |
47 | ||
48 | TheaterButton.prototype.controlText_ = 'Theater mode' | |
49 | ||
50 | TheaterButton.registerComponent('TheaterButton', TheaterButton) |