From 729a756e2135aea2a62dd35a20bc9fe2f929e813 Mon Sep 17 00:00:00 2001 From: Alex Maras Date: Sat, 25 Jun 2022 23:53:40 +0800 Subject: [PATCH 1/3] fix: use total time for chapter name resolution when in chapter track mode --- client/components/player/PlayerTrackBar.vue | 12 +++++++----- 1 file changed, 7 insertions(+), 5 deletions(-) diff --git a/client/components/player/PlayerTrackBar.vue b/client/components/player/PlayerTrackBar.vue index 506c34dd..e5fef21c 100644 --- a/client/components/player/PlayerTrackBar.vue +++ b/client/components/player/PlayerTrackBar.vue @@ -85,7 +85,7 @@ export default { var perc = offsetX / this.trackWidth const baseTime = this.useChapterTrack ? this.currentChapterStart : 0; const duration = this.useChapterTrack ? this.currentChapterDuration : this.duration; - var time = baseTime + (perc * duration); + const time = baseTime + (perc * duration); if (isNaN(time) || time === null) { console.error('Invalid time', perc, time) return @@ -143,8 +143,10 @@ export default { mousemoveTrack(e) { var offsetX = e.offsetX - const duration = this.useChapterTrack ? this.currentChapterDuration : this.duration - const time = (offsetX / this.trackWidth) * duration + const baseTime = this.useChapterTrack ? this.currentChapterStart : 0; + const duration = this.useChapterTrack ? this.currentChapterDuration : this.duration; + const chapterTime = (offsetX / this.trackWidth) * duration; + const totalTime = baseTime + ((offsetX / this.trackWidth) * duration); if (this.$refs.hoverTimestamp) { var width = this.$refs.hoverTimestamp.clientWidth @@ -165,9 +167,9 @@ export default { this.$refs.hoverTimestampArrow.style.left = posLeft + 'px' } if (this.$refs.hoverTimestampText) { - var hoverText = this.$secondsToTimestamp(time) + var hoverText = this.$secondsToTimestamp(chapterTime) - var chapter = this.chapters.find((chapter) => chapter.start <= time && time < chapter.end) + var chapter = this.chapters.find((chapter) => chapter.start <= totalTime && totalTime < chapter.end) if (chapter && chapter.title) { hoverText += ` - ${chapter.title}` } From e837e5f78035bec49991123be5ae5afaaac5bf45 Mon Sep 17 00:00:00 2001 From: Alex Maras Date: Sat, 25 Jun 2022 23:58:55 +0800 Subject: [PATCH 2/3] fix: reuse existing variable --- client/components/player/PlayerTrackBar.vue | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/client/components/player/PlayerTrackBar.vue b/client/components/player/PlayerTrackBar.vue index e5fef21c..8eaf7690 100644 --- a/client/components/player/PlayerTrackBar.vue +++ b/client/components/player/PlayerTrackBar.vue @@ -146,7 +146,7 @@ export default { const baseTime = this.useChapterTrack ? this.currentChapterStart : 0; const duration = this.useChapterTrack ? this.currentChapterDuration : this.duration; const chapterTime = (offsetX / this.trackWidth) * duration; - const totalTime = baseTime + ((offsetX / this.trackWidth) * duration); + const totalTime = baseTime + chapterTime; if (this.$refs.hoverTimestamp) { var width = this.$refs.hoverTimestamp.clientWidth From 3c347bef7d40f1d3eac0d3f6f1c854c10ea451cf Mon Sep 17 00:00:00 2001 From: Alex Maras Date: Sun, 26 Jun 2022 00:00:52 +0800 Subject: [PATCH 3/3] fix: better variable naming --- client/components/player/PlayerTrackBar.vue | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/client/components/player/PlayerTrackBar.vue b/client/components/player/PlayerTrackBar.vue index 8eaf7690..7b4f7c87 100644 --- a/client/components/player/PlayerTrackBar.vue +++ b/client/components/player/PlayerTrackBar.vue @@ -145,8 +145,8 @@ export default { const baseTime = this.useChapterTrack ? this.currentChapterStart : 0; const duration = this.useChapterTrack ? this.currentChapterDuration : this.duration; - const chapterTime = (offsetX / this.trackWidth) * duration; - const totalTime = baseTime + chapterTime; + const progressTime = (offsetX / this.trackWidth) * duration; + const totalTime = baseTime + progressTime; if (this.$refs.hoverTimestamp) { var width = this.$refs.hoverTimestamp.clientWidth @@ -167,7 +167,7 @@ export default { this.$refs.hoverTimestampArrow.style.left = posLeft + 'px' } if (this.$refs.hoverTimestampText) { - var hoverText = this.$secondsToTimestamp(chapterTime) + var hoverText = this.$secondsToTimestamp(progressTime) var chapter = this.chapters.find((chapter) => chapter.start <= totalTime && totalTime < chapter.end) if (chapter && chapter.title) {