client/src/assets/player/videojs-components/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   partEls_: any[]
  10
  11   constructor (player: Player, options: any) {
  12     super(player, options)
  13     this.partEls_ = []
  14     this.on(player, 'progress', this.update)
  15   }
  16
  17   createEl () {
  18     return super.createEl('div', {
  19       className: 'vjs-load-progress',
  20       innerHTML: `<span class="vjs-control-text"><span>${this.localize('Loaded')}</span>: 0%</span>`
  21     })
  22   }
  23
  24   dispose () {
  25     this.partEls_ = null
  26
  27     super.dispose()
  28   }
  29
  30   update () {
  31     const torrent = this.player().webtorrent().getTorrent()
  32     if (!torrent) return
  33
  34     this.el_.style.width = (torrent.progress * 100) + '%'
  35   }
  36
  37 }
  38
  39 Component.registerComponent('PeerTubeLoadProgressBar', PeerTubeLoadProgressBar)