From 054a103b286277708a3a807a52da6cca12e1b0ce Mon Sep 17 00:00:00 2001 From: Chocobozzz Date: Mon, 11 Jun 2018 16:49:56 +0200 Subject: Add theatre mode --- client/src/assets/player/theater-button.ts | 46 ++++++++++++++++++++++++++++++ 1 file changed, 46 insertions(+) create mode 100644 client/src/assets/player/theater-button.ts (limited to 'client/src/assets/player/theater-button.ts') 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 @@ +import { VideoJSComponentInterface, videojsUntyped } from './peertube-videojs-typings' +import { getStoredTheater, saveTheaterInStore } from './utils' + +const Button: VideoJSComponentInterface = videojsUntyped.getComponent('Button') +class TheaterButton extends Button { + + private static readonly THEATER_MODE_CLASS = 'vjs-theater-enabled' + + constructor (player, options) { + super(player, options) + + const enabled = getStoredTheater() + if (enabled === true) { + this.player_.addClass(TheaterButton.THEATER_MODE_CLASS) + this.handleTheaterChange() + } + } + + buildCSSClass () { + return `vjs-theater-control ${super.buildCSSClass()}` + } + + handleTheaterChange () { + if (this.isTheaterEnabled()) { + this.controlText('Normal mode') + } else { + this.controlText('Theater mode') + } + + saveTheaterInStore(this.isTheaterEnabled()) + } + + handleClick () { + this.player_.toggleClass(TheaterButton.THEATER_MODE_CLASS) + + this.handleTheaterChange() + } + + private isTheaterEnabled () { + return this.player_.hasClass(TheaterButton.THEATER_MODE_CLASS) + } +} + +TheaterButton.prototype.controlText_ = 'Theater mode' + +TheaterButton.registerComponent('TheaterButton', TheaterButton) -- cgit v1.2.3