2019-01-23 15:36:45 +01:00
|
|
|
import { VideoJSComponentInterface, videojsUntyped } from '../peertube-videojs-typings'
|
2018-10-18 14:35:31 +02:00
|
|
|
// FIXME: something weird with our path definition in tsconfig and typings
|
|
|
|
// @ts-ignore
|
|
|
|
import { Player } from 'video.js'
|
2018-05-31 09:51:51 +02:00
|
|
|
|
|
|
|
const Component: VideoJSComponentInterface = videojsUntyped.getComponent('Component')
|
|
|
|
|
|
|
|
class PeerTubeLoadProgressBar extends Component {
|
2019-08-01 11:38:26 +02:00
|
|
|
partEls_: any[]
|
2018-05-31 09:51:51 +02:00
|
|
|
|
2018-10-18 14:35:31 +02:00
|
|
|
constructor (player: Player, options: any) {
|
2018-05-31 09:51:51 +02:00
|
|
|
super(player, options)
|
|
|
|
this.partEls_ = []
|
|
|
|
this.on(player, 'progress', this.update)
|
|
|
|
}
|
|
|
|
|
|
|
|
createEl () {
|
|
|
|
return super.createEl('div', {
|
|
|
|
className: 'vjs-load-progress',
|
|
|
|
innerHTML: `<span class="vjs-control-text"><span>${this.localize('Loaded')}</span>: 0%</span>`
|
|
|
|
})
|
|
|
|
}
|
|
|
|
|
|
|
|
dispose () {
|
|
|
|
this.partEls_ = null
|
|
|
|
|
|
|
|
super.dispose()
|
|
|
|
}
|
|
|
|
|
|
|
|
update () {
|
2019-01-23 15:36:45 +01:00
|
|
|
const torrent = this.player().webtorrent().getTorrent()
|
2018-05-31 09:51:51 +02:00
|
|
|
if (!torrent) return
|
|
|
|
|
|
|
|
this.el_.style.width = (torrent.progress * 100) + '%'
|
|
|
|
}
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
Component.registerComponent('PeerTubeLoadProgressBar', PeerTubeLoadProgressBar)
|