From b345cee512a3a8969f26b33b3b423a627b49d1e1 Mon Sep 17 00:00:00 2001 From: brandonocasey Date: Tue, 27 Apr 2021 15:33:30 -0400 Subject: [PATCH] fix: seekbar liveui keybinds, only user seeks should ignore liveThreshold --- .../control-bar/progress-control/seek-bar.js | 40 ++++++++++++------- src/js/live-tracker.js | 18 ++++++--- 2 files changed, 38 insertions(+), 20 deletions(-) diff --git a/src/js/control-bar/progress-control/seek-bar.js b/src/js/control-bar/progress-control/seek-bar.js index 4712f789f6..7210840f3d 100644 --- a/src/js/control-bar/progress-control/seek-bar.js +++ b/src/js/control-bar/progress-control/seek-bar.js @@ -186,6 +186,14 @@ class SeekBar extends Slider { return percent; } + userSeek_(ct) { + if (this.player_.liveTracker && this.player_.liveTracker.isLive()) { + this.player_.liveTracker.nextSeekedFromUser(); + } + + this.player_.currentTime(ct); + } + /** * Get the value of current time but allows for smooth scrubbing, * when player can't keep up. @@ -302,14 +310,8 @@ class SeekBar extends Slider { } } - // tell live tracker that the current seek can be - // behind live. - if (liveTracker) { - liveTracker.userSeek_(true); - } - // Set new time (tell player to seek to new time) - this.player_.currentTime(newTime); + this.userSeek_(newTime); } enable() { @@ -372,14 +374,14 @@ class SeekBar extends Slider { * Move more quickly fast forward for keyboard-only users */ stepForward() { - this.player_.currentTime(this.player_.currentTime() + STEP_SECONDS); + this.userSeek_(this.player_.currentTime() + STEP_SECONDS); } /** * Move more quickly rewind for keyboard-only users */ stepBack() { - this.player_.currentTime(this.player_.currentTime() - STEP_SECONDS); + this.userSeek_(this.player_.currentTime() - STEP_SECONDS); } /** @@ -415,6 +417,8 @@ class SeekBar extends Slider { * @listens keydown */ handleKeyDown(event) { + const liveTracker = this.player_.liveTracker; + if (keycode.isEventKey(event, 'Space') || keycode.isEventKey(event, 'Enter')) { event.preventDefault(); event.stopPropagation(); @@ -422,25 +426,33 @@ class SeekBar extends Slider { } else if (keycode.isEventKey(event, 'Home')) { event.preventDefault(); event.stopPropagation(); - this.player_.currentTime(0); + this.userSeek_(0); } else if (keycode.isEventKey(event, 'End')) { event.preventDefault(); event.stopPropagation(); - this.player_.currentTime(this.player_.duration()); + if (liveTracker && liveTracker.isLive()) { + this.userSeek_(liveTracker.liveCurrentTime()); + } else { + this.userSeek_(this.player_.duration()); + } } else if (/^[0-9]$/.test(keycode(event))) { event.preventDefault(); event.stopPropagation(); const gotoFraction = (keycode.codes[keycode(event)] - keycode.codes['0']) * 10.0 / 100.0; - this.player_.currentTime(this.player_.duration() * gotoFraction); + if (liveTracker && liveTracker.isLive()) { + this.userSeek_(liveTracker.seekableStart() + (liveTracker.liveWindow() * gotoFraction)); + } else { + this.userSeek_(this.player_.duration() * gotoFraction); + } } else if (keycode.isEventKey(event, 'PgDn')) { event.preventDefault(); event.stopPropagation(); - this.player_.currentTime(this.player_.currentTime() - (STEP_SECONDS * PAGE_KEY_MULTIPLIER)); + this.userSeek_(this.player_.currentTime() - (STEP_SECONDS * PAGE_KEY_MULTIPLIER)); } else if (keycode.isEventKey(event, 'PgUp')) { event.preventDefault(); event.stopPropagation(); - this.player_.currentTime(this.player_.currentTime() + (STEP_SECONDS * PAGE_KEY_MULTIPLIER)); + this.userSeek_(this.player_.currentTime() + (STEP_SECONDS * PAGE_KEY_MULTIPLIER)); } else { // Pass keydown handling up for unsupported keys super.handleKeyDown(event); diff --git a/src/js/live-tracker.js b/src/js/live-tracker.js index e4519184d8..2538c0825e 100644 --- a/src/js/live-tracker.js +++ b/src/js/live-tracker.js @@ -191,8 +191,8 @@ class LiveTracker extends Component { handleSeeked() { const timeDiff = Math.abs(this.liveCurrentTime() - this.player_.currentTime()); - this.seekedBehindLive_ = this.userSeek__ && timeDiff > 2; - this.userSeek__ = false; + this.seekedBehindLive_ = this.nextSeekedFromUser_ && timeDiff > 2; + this.nextSeekedFromUser_ = false; this.trackLive_(); } @@ -215,7 +215,7 @@ class LiveTracker extends Component { this.behindLiveEdge_ = true; this.timeupdateSeen_ = false; this.seekedBehindLive_ = false; - this.userSeek__ = false; + this.nextSeekedFromUser_ = false; this.clearInterval(this.trackingInterval_); this.trackingInterval_ = null; @@ -227,8 +227,13 @@ class LiveTracker extends Component { this.off(this.player_, 'timeupdate', this.seekToLiveEdge_); } - userSeek_(v) { - this.userSeek__ = v; + /** + * The next seeked event is from the user. Meaning that any seek + * > 2s behind live will be considered behind live for real and + * liveTolerance will be ignored. + */ + nextSeekedFromUser() { + this.nextSeekedFromUser_ = true; } /** @@ -375,7 +380,8 @@ class LiveTracker extends Component { * Seek to the live edge if we are behind the live edge */ seekToLiveEdge() { - this.userSeek__ = false; + this.seekedBehindLive_ = false; + this.nextSeekedFromUser_ = false; if (this.atLiveEdge()) { return; }