Fix player progress bar
[oweals/peertube.git] / client / src / assets / player / peertube-load-progress-bar.ts
1 import * as Bitfield from 'bitfield'
2 import { VideoJSComponentInterface, videojsUntyped } from './peertube-videojs-typings'
3
4 const Component: VideoJSComponentInterface = videojsUntyped.getComponent('Component')
5
6 class PeerTubeLoadProgressBar extends Component {
7
8   constructor (player, options) {
9     super(player, options)
10     this.partEls_ = []
11     this.on(player, 'progress', this.update)
12   }
13
14   createEl () {
15     return super.createEl('div', {
16       className: 'vjs-load-progress',
17       innerHTML: `<span class="vjs-control-text"><span>${this.localize('Loaded')}</span>: 0%</span>`
18     })
19   }
20
21   dispose () {
22     this.partEls_ = null
23
24     super.dispose()
25   }
26
27   update () {
28     const torrent = this.player().peertube().getTorrent()
29     if (!torrent) return
30
31     this.el_.style.width = (torrent.progress * 100) + '%'
32   }
33
34 }
35
36 Component.registerComponent('PeerTubeLoadProgressBar', PeerTubeLoadProgressBar)