diff options
| author | Jules Laplace <julescarbon@gmail.com> | 2020-11-05 19:05:57 +0100 |
|---|---|---|
| committer | Jules Laplace <julescarbon@gmail.com> | 2020-11-05 19:05:57 +0100 |
| commit | f86e92add6484af080db4e51a35d66aefe851590 (patch) | |
| tree | 0e547291e35f73cd15938251ee3bbe5927c0f66b /animism-align/frontend/app | |
| parent | 8028a1052e8471bb8915847cd43da9217e92f8a3 (diff) | |
fix weird end-of-section bug
Diffstat (limited to 'animism-align/frontend/app')
3 files changed, 22 insertions, 7 deletions
diff --git a/animism-align/frontend/app/views/viewer/nav/nav.player.js b/animism-align/frontend/app/views/viewer/nav/nav.player.js index 7c2050e..75e53b4 100644 --- a/animism-align/frontend/app/views/viewer/nav/nav.player.js +++ b/animism-align/frontend/app/views/viewer/nav/nav.player.js @@ -4,11 +4,18 @@ import { connect } from 'react-redux' import { PlayButton, PlayerTime, VolumeControl } from './viewer.icons' class NavPlayer extends Component { + constructor(props) { + super(props) + this.stopPropagation = this.stopPropagation.bind(this) + } + stopPropagation(e) { + e && e.stopPropagation() + } render() { const { playing, play_ts, duration, volume } = this.props const className = playing ? 'nav-player playing' : 'nav-player' return ( - <div className={className}> + <div className={className} onClick={this.stopPropagation}> <PlayButton playing={playing} /> <PlayerTime play_ts={play_ts} duration={duration} /> <VolumeControl volume={volume} /> diff --git a/animism-align/frontend/app/views/viewer/player/components.media/video.scrubber.js b/animism-align/frontend/app/views/viewer/player/components.media/video.scrubber.js index aec82ca..fcc097a 100644 --- a/animism-align/frontend/app/views/viewer/player/components.media/video.scrubber.js +++ b/animism-align/frontend/app/views/viewer/player/components.media/video.scrubber.js @@ -51,6 +51,7 @@ class VideoScrubber extends Component { const seconds = percent * duration // we can use this to seek the audio actions.audio.seek(start_ts + seconds) + actions.audio.play() // apply the video start offset. // in case the video loops, modulo the length of the original video const video_seek = ((seconds + video_start_ts) % timing.duration) diff --git a/animism-align/frontend/app/views/viewer/player/player.container.js b/animism-align/frontend/app/views/viewer/player/player.container.js index 8972386..26697f9 100644 --- a/animism-align/frontend/app/views/viewer/player/player.container.js +++ b/animism-align/frontend/app/views/viewer/player/player.container.js @@ -71,20 +71,27 @@ class PlayerContainer extends Component { componentDidUpdate(prevProps) { if (this.props.audio.play_ts === prevProps.audio.play_ts) return - this.setCurrentSection() + this.handleTimeUpdate() } - setCurrentSection() { + handleTimeUpdate() { const { audio, currentSection, autoAdvance } = this.props - const { play_ts, seek_ts } = audio - const didSeek = floatEQ(play_ts, seek_ts) + const { play_ts } = audio + // const { play_ts, seek_ts } = audio + // const didSeek = floatEQ(play_ts, seek_ts) + const inCurrentSection = floatInRange(currentSection.start_ts, play_ts, currentSection.end_ts) + // console.log('inCurrentSection?', inCurrentSection) // console.log('didSeek?', didSeek) - if (!didSeek || floatInRange(currentSection.start_ts, play_ts, currentSection.end_ts)) { + // if the current TS isn't in the same section as the current one... + if (inCurrentSection) { return } + // at end of section () if (autoAdvance) { actions.viewer.setSectionFromTimestamp(play_ts) - } else { + } + else { + console.log(">> Reached end of section") actions.viewer.reachedEndOfSection(currentSection) } } |
