Adjust bounding correctly and fix invalid date error

This commit is contained in:
Korbs 2025-02-05 15:26:07 -05:00
parent 0c7d506ddb
commit d60188a96c
Signed by: Korbs
SSH key fingerprint: SHA256:Q0b0KraMldpAO9oKa+w+gcsXsOTykQ4UkAKn0ByGn5U

View file

@ -30,19 +30,12 @@ const {
* for the JavaScript code in this page.
*
*/
var Player = document.querySelector('#zorn-player-' + PlayerName + ' video')
Player.addEventListener('durationchange', (event) => {Seek()})
function Seek() {
var Player = document.querySelector('#zorn-player-' + PlayerName + ' video')
const timeElapsed = document.querySelector('#zorn-player-' + PlayerName + ' #current')
const duration = document.querySelector('#zorn-player-' + PlayerName + ' #duration')
function formatTime(timeInSeconds) {
const result = new Date(timeInSeconds * 1e3)
.toISOString()
.substr(11, 8)
return {
minutes: result.substr(3, 2),
seconds: result.substr(6, 2),
}
}
function initializeVideo() {
const videoDuration = Math.round(Player.duration)
const time = formatTime(videoDuration)
@ -52,6 +45,15 @@ function Seek() {
`${time.minutes}m ${time.seconds}s`,
)
}
function formatTime(timeInSeconds) {
const result = new Date(timeInSeconds * 1e3)
.toISOString()
.substr(11, 8)
return {
minutes: result.substr(3, 2),
seconds: result.substr(6, 2),
}
}
Player.addEventListener("loadedmetadata", initializeVideo)
function updateTimeElapsed() {
const time = formatTime(Math.round(Player.currentTime))
@ -89,7 +91,7 @@ function Seek() {
seek.setAttribute("data-seek", skipTo)
const t = formatTime(skipTo)
seekTooltip.textContent = `${t.minutes}:${t.seconds}`
const rect = Player.getBoundingClientRect()
const rect = progressBar.getBoundingClientRect()
seekTooltip.style.left = `${event.pageX - rect.left}px`
seekTooltip.style.opacity = '1'
document.querySelector('#zorn-player-' + PlayerName + ' .vc-progress-bar').style.width = Player.currentTime / Player.duration * 100 + '%'
@ -110,5 +112,4 @@ function Seek() {
initializeVideo()
}
setTimeout(() => {Seek()}, 1000) // Prevent invalid date error
</script>