Fix hiding video breaking playback

Also make the video player code closer to upstream
This commit is contained in:
Thibaut Girka 2020-11-04 15:12:06 +01:00 committed by ThibG
parent 1f69ad798d
commit a48dbc78f8
1 changed files with 16 additions and 12 deletions

View File

@ -281,9 +281,9 @@ class Video extends React.PureComponent {
togglePlay = () => { togglePlay = () => {
if (this.state.paused) { if (this.state.paused) {
this.video.play(); this.setState({ paused: false }, () => this.video.play());
} else { } else {
this.video.pause(); this.setState({ paused: true }, () => this.video.pause());
} }
} }
@ -381,13 +381,16 @@ class Video extends React.PureComponent {
} }
toggleMute = () => { toggleMute = () => {
this.video.muted = !this.video.muted; const muted = !this.video.muted;
this.setState({ muted: this.video.muted });
this.setState({ muted }, () => {
this.video.muted = muted;
});
} }
toggleReveal = () => { toggleReveal = () => {
if (this.state.revealed) { if (this.state.revealed) {
this.video.pause(); this.setState({ paused: true });
} }
if (this.props.onToggleVisibility) { if (this.props.onToggleVisibility) {
@ -475,13 +478,6 @@ class Video extends React.PureComponent {
return (<div className={computedClass} ref={this.setPlayerRef} tabindex={0}></div>); return (<div className={computedClass} ref={this.setPlayerRef} tabindex={0}></div>);
} }
let warning;
if (sensitive) {
warning = <FormattedMessage id='status.sensitive_warning' defaultMessage='Sensitive content' />;
} else {
warning = <FormattedMessage id='status.media_hidden' defaultMessage='Media hidden' />;
}
let preload; let preload;
if (this.props.currentTime || fullscreen || dragging) { if (this.props.currentTime || fullscreen || dragging) {
@ -492,6 +488,14 @@ class Video extends React.PureComponent {
preload = 'none'; preload = 'none';
} }
let warning;
if (sensitive) {
warning = <FormattedMessage id='status.sensitive_warning' defaultMessage='Sensitive content' />;
} else {
warning = <FormattedMessage id='status.media_hidden' defaultMessage='Media hidden' />;
}
return ( return (
<div <div
className={computedClass} className={computedClass}