use timeupdate instead of pause to update video state

This commit is contained in:
Travis Eden 2017-12-22 18:14:54 -05:00
parent 7d29c4b91d
commit 11a5f9d1d5
4 changed files with 12 additions and 17 deletions

View file

@ -45,7 +45,8 @@ const perform = dispatch => ({
changeVolume: volume => dispatch(doChangeVolume(volume)), changeVolume: volume => dispatch(doChangeVolume(volume)),
// setVideoPause: val => dispatch(setVideoPause(val)), // setVideoPause: val => dispatch(setVideoPause(val)),
doPlay: () => dispatch(doPlay()), doPlay: () => dispatch(doPlay()),
doPause: (id, position) => dispatch(doPause(id, position)), doPause: () => dispatch(doPause()),
savePosition: (id, position) => dispatch(savePosition(id, position)),
}); });
export default connect(select, perform)(Video); export default connect(select, perform)(Video);

View file

@ -72,10 +72,10 @@ class VideoPlayer extends React.PureComponent {
if (mediaElement) { if (mediaElement) {
mediaElement.currentTime = position; mediaElement.currentTime = position;
mediaElement.addEventListener("play", () => this.props.doPlay()); mediaElement.addEventListener("play", () => this.props.doPlay());
mediaElement.addEventListener("pause", () => { mediaElement.addEventListener("pause", () => this.props.doPause());
console.log("CURRENT TIME:", mediaElement.currentTime); mediaElement.addEventListener("timeupdate", () =>
this.props.doPause(this.props.mediaId, mediaElement.currentTime); this.props.savePosition(mediaId, mediaElement.currentTime)
}); );
mediaElement.addEventListener("click", this.togglePlayListener); mediaElement.addEventListener("click", this.togglePlayListener);
mediaElement.addEventListener( mediaElement.addEventListener(
"loadedmetadata", "loadedmetadata",

View file

@ -58,6 +58,7 @@ class Video extends React.PureComponent {
uri, uri,
doPlay, doPlay,
doPause, doPause,
savePosition,
mediaPaused, mediaPaused,
mediaPosition, mediaPosition,
} = this.props; } = this.props;
@ -119,6 +120,7 @@ class Video extends React.PureComponent {
volume={volume} volume={volume}
doPlay={doPlay} doPlay={doPlay}
doPause={doPause} doPause={doPause}
savePosition={savePosition}
mediaId={mediaId} mediaId={mediaId}
paused={mediaPaused} paused={mediaPaused}
position={mediaPosition} position={mediaPosition}

View file

@ -8,18 +8,10 @@ export const doPlay = () => (dispatch: Dispatch) =>
type: actions.MEDIA_PLAY, type: actions.MEDIA_PLAY,
}); });
export const doPause = (id: String, position: String) => ( export const doPause = () => (dispatch: Dispatch) =>
dispatch: Dispatch
) => {
if (id && position) {
dispatch({ dispatch({
type: actions.MEDIA_POSITION, type: actions.MEDIA_PAUSE,
id,
position,
}); });
}
dispatch({ type: actions.MEDIA_PAUSE });
};
export const savePosition = (id: String, position: String) => ( export const savePosition = (id: String, position: String) => (
dispatch: Dispatch dispatch: Dispatch