From e993ecb3b761bba8fba2b8329270ae904bd3a0d7 Mon Sep 17 00:00:00 2001 From: Chocobozzz Date: Thu, 29 Mar 2018 16:01:50 +0200 Subject: Improve player progress bar --- .../src/assets/player/peertube-videojs-plugin.ts | 24 ++++++++++++++++++++++ 1 file changed, 24 insertions(+) (limited to 'client/src/assets/player') diff --git a/client/src/assets/player/peertube-videojs-plugin.ts b/client/src/assets/player/peertube-videojs-plugin.ts index 52846503d..4843e3d8a 100644 --- a/client/src/assets/player/peertube-videojs-plugin.ts +++ b/client/src/assets/player/peertube-videojs-plugin.ts @@ -408,6 +408,8 @@ class PeerTubePlugin extends Plugin { } private initializePlayer () { + this.initSmoothProgressBar() + if (this.autoplay === true) { this.updateVideoFile(undefined, () => this.player.play()) } else { @@ -491,5 +493,27 @@ class PeerTubePlugin extends Plugin { private disableErrorDisplay () { this.player.removeClass('vjs-error-display-enabled') } + + // Thanks: https://github.com/videojs/video.js/issues/4460#issuecomment-312861657 + private initSmoothProgressBar () { + const SeekBar = videojsUntyped.getComponent('SeekBar') + SeekBar.prototype.getPercent = function getPercent () { + // Allows for smooth scrubbing, when player can't keep up. + // const time = (this.player_.scrubbing()) ? + // this.player_.getCache().currentTime : + // this.player_.currentTime() + const time = this.player_.currentTime() + const percent = time / this.player_.duration() + return percent >= 1 ? 1 : percent + } + SeekBar.prototype.handleMouseMove = function handleMouseMove (event) { + let newTime = this.calculateDistance(event) * this.player_.duration() + if (newTime === this.player_.duration()) { + newTime = newTime - 0.1 + } + this.player_.currentTime(newTime) + this.update() + } + } } videojsUntyped.registerPlugin('peertube', PeerTubePlugin) -- cgit v1.2.3