fix(expertise): vidéo bloquée quand fwdTarget = duration (3+ items)
All checks were successful
Deploy / Deploy to Production (push) Successful in 22s
All checks were successful
Deploy / Deploy to Production (push) Successful in 22s
Bug : quand la vidéo forward atteint la fin (duration), timeupdate ne fire pas toujours avec currentTime >= duration exactement. Le handler ne se déclenche jamais, fwdTarget n'est pas nettoyé, currentFwdTime garde l'ancienne valeur → la reprise en reverse part du mauvais point. Corrections : - Écoute l'événement ended sur les deux vidéos pour garantir le snap de currentFwdTime aux bornes (0 ou duration) - Tolérance de 50ms dans les comparaisons timeupdate (>= target - 0.05) pour capter la cible avant la fin naturelle de la vidéo - Suppression du reassign de currentTime dans les handlers timeupdate (inutile et pouvait causer un seek superflu) Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
parent
7838342f96
commit
5cfecd7786
1 changed files with 20 additions and 6 deletions
|
|
@ -189,27 +189,39 @@
|
||||||
|
|
||||||
const onFwdUpdate = () => {
|
const onFwdUpdate = () => {
|
||||||
if (!videoFwd || videoFwd.paused || fwdTarget === null) return
|
if (!videoFwd || videoFwd.paused || fwdTarget === null) return
|
||||||
if (videoFwd.currentTime >= fwdTarget) {
|
if (videoFwd.currentTime >= fwdTarget - 0.05) {
|
||||||
currentFwdTime = fwdTarget // snap exactement à la cible
|
currentFwdTime = fwdTarget
|
||||||
videoFwd.currentTime = fwdTarget
|
|
||||||
videoFwd.pause()
|
videoFwd.pause()
|
||||||
fwdTarget = null
|
fwdTarget = null
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
videoFwd?.addEventListener('timeupdate', onFwdUpdate)
|
videoFwd?.addEventListener('timeupdate', onFwdUpdate)
|
||||||
|
|
||||||
|
// Quand la vidéo forward atteint la fin naturellement, timeupdate
|
||||||
|
// peut ne pas fire avec currentTime >= duration. ended le garantit.
|
||||||
|
const onFwdEnded = () => {
|
||||||
|
currentFwdTime = videoDuration
|
||||||
|
fwdTarget = null
|
||||||
|
}
|
||||||
|
videoFwd?.addEventListener('ended', onFwdEnded)
|
||||||
|
|
||||||
const onRevUpdate = () => {
|
const onRevUpdate = () => {
|
||||||
if (!videoRev || videoRev.paused || revTarget === null) return
|
if (!videoRev || videoRev.paused || revTarget === null) return
|
||||||
if (videoRev.currentTime >= revTarget) {
|
if (videoRev.currentTime >= revTarget - 0.05) {
|
||||||
const fwdPos = videoDuration - revTarget
|
const fwdPos = videoDuration - revTarget
|
||||||
currentFwdTime = Math.max(fwdPos, 0) // snap exactement
|
currentFwdTime = Math.max(fwdPos, 0)
|
||||||
videoRev.currentTime = revTarget
|
|
||||||
videoRev.pause()
|
videoRev.pause()
|
||||||
revTarget = null
|
revTarget = null
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
videoRev?.addEventListener('timeupdate', onRevUpdate)
|
videoRev?.addEventListener('timeupdate', onRevUpdate)
|
||||||
|
|
||||||
|
const onRevEnded = () => {
|
||||||
|
currentFwdTime = 0
|
||||||
|
revTarget = null
|
||||||
|
}
|
||||||
|
videoRev?.addEventListener('ended', onRevEnded)
|
||||||
|
|
||||||
const onResize = () => { if (isActive) computeOffset() }
|
const onResize = () => { if (isActive) computeOffset() }
|
||||||
window.addEventListener('resize', onResize)
|
window.addEventListener('resize', onResize)
|
||||||
window.addEventListener('orientationchange', onResize)
|
window.addEventListener('orientationchange', onResize)
|
||||||
|
|
@ -218,7 +230,9 @@
|
||||||
return () => {
|
return () => {
|
||||||
sectionEl?.removeEventListener('wheel', nav.onWheel)
|
sectionEl?.removeEventListener('wheel', nav.onWheel)
|
||||||
videoFwd?.removeEventListener('timeupdate', onFwdUpdate)
|
videoFwd?.removeEventListener('timeupdate', onFwdUpdate)
|
||||||
|
videoFwd?.removeEventListener('ended', onFwdEnded)
|
||||||
videoRev?.removeEventListener('timeupdate', onRevUpdate)
|
videoRev?.removeEventListener('timeupdate', onRevUpdate)
|
||||||
|
videoRev?.removeEventListener('ended', onRevEnded)
|
||||||
window.removeEventListener('resize', onResize)
|
window.removeEventListener('resize', onResize)
|
||||||
window.removeEventListener('orientationchange', onResize)
|
window.removeEventListener('orientationchange', onResize)
|
||||||
window.removeEventListener('keydown', nav.onKeyDown)
|
window.removeEventListener('keydown', nav.onKeyDown)
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue