client/src/assets/player/peertube-load-progress-bar.ts

   1 import { VideoJSComponentInterface, videojsUntyped } from './peertube-videojs-typings'
   2 // FIXME: something weird with our path definition in tsconfig and typings
   3 // @ts-ignore
   4 import { Player } from 'video.js'
   5
   6 const Component: VideoJSComponentInterface = videojsUntyped.getComponent('Component')
   7
   8 class PeerTubeLoadProgressBar extends Component {
   9
  10   constructor (player: Player, options: any) {
  11     super(player, options)
  12     this.partEls_ = []
  13     this.on(player, 'progress', this.update)
  14   }
  15
  16   createEl () {
  17     return super.createEl('div', {
  18       className: 'vjs-load-progress',
  19       innerHTML: `<span class="vjs-control-text"><span>${this.localize('Loaded')}</span>: 0%</span>`
  20     })
  21   }
  22
  23   dispose () {
  24     this.partEls_ = null
  25
  26     super.dispose()
  27   }
  28
  29   update () {
  30     const torrent = this.player().peertube().getTorrent()
  31     if (!torrent) return
  32
  33     this.el_.style.width = (torrent.progress * 100) + '%'
  34   }
  35
  36 }
  37
  38 Component.registerComponent('PeerTubeLoadProgressBar', PeerTubeLoadProgressBar)