diff options
Diffstat (limited to 'client/src/assets/player/videojs-components/peertube-load-progress-bar.ts')
-rw-r--r-- | client/src/assets/player/videojs-components/peertube-load-progress-bar.ts | 38 |
1 files changed, 38 insertions, 0 deletions
diff --git a/client/src/assets/player/videojs-components/peertube-load-progress-bar.ts b/client/src/assets/player/videojs-components/peertube-load-progress-bar.ts new file mode 100644 index 000000000..9a0e3b550 --- /dev/null +++ b/client/src/assets/player/videojs-components/peertube-load-progress-bar.ts | |||
@@ -0,0 +1,38 @@ | |||
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().webtorrent().getTorrent() | ||
31 | if (!torrent) return | ||
32 | |||
33 | this.el_.style.width = (torrent.progress * 100) + '%' | ||
34 | } | ||
35 | |||
36 | } | ||
37 | |||
38 | Component.registerComponent('PeerTubeLoadProgressBar', PeerTubeLoadProgressBar) | ||