client/src/assets/player/resolution-menu-item.ts

   1 import * as videojs from 'video.js'
   2 import { VideoJSComponentInterface, videojsUntyped } from './peertube-videojs-typings'
   3
   4 const MenuItem: VideoJSComponentInterface = videojsUntyped.getComponent('MenuItem')
   5 class ResolutionMenuItem extends MenuItem {
   6
   7   constructor (player: videojs.Player, options) {
   8     const currentResolutionId = player.peertube().getCurrentResolutionId()
   9     options.selectable = true
  10     options.selected = options.id === currentResolutionId
  11
  12     super(player, options)
  13
  14     this.label = options.label
  15     this.id = options.id
  16
  17     player.peertube().on('videoFileUpdate', () => this.updateSelection())
  18     player.peertube().on('autoResolutionUpdate', () => this.updateSelection())
  19   }
  20
  21   handleClick (event) {
  22     super.handleClick(event)
  23
  24     // Auto resolution
  25     if (this.id === -1) {
  26       this.player_.peertube().enableAutoResolution()
  27       return
  28     }
  29
  30     this.player_.peertube().disableAutoResolution()
  31     this.player_.peertube().updateResolution(this.id)
  32   }
  33
  34   updateSelection () {
  35     if (this.player_.peertube().isAutoResolutionOn()) {
  36       this.selected(this.id === -1)
  37       return
  38     }
  39
  40     this.selected(this.player_.peertube().getCurrentResolutionId() === this.id)
  41   }
  42
  43   getLabel () {
  44     if (this.id === -1) {
  45       return this.label + ' <small>' + this.player_.peertube().getCurrentResolutionLabel() + '</small>'
  46     }
  47
  48     return this.label
  49   }
  50 }
  51 MenuItem.registerComponent('ResolutionMenuItem', ResolutionMenuItem)
  52
  53 export { ResolutionMenuItem }