about summary refs log tree commit diff
path: root/app/javascript/flavours/glitch/features
diff options
context:
space:
mode:
authorThibaut Girka <thib@sitedethib.com>2020-11-04 15:12:06 +0100
committerThibG <thib@sitedethib.com>2020-11-04 18:53:39 +0100
commita48dbc78f829874190ba062635881a7444d1e5f9 (patch)
tree374055e474785e005fd2ee56eac99f2b874ad690 /app/javascript/flavours/glitch/features
parent1f69ad798d9a42d8ec3df69ded7625524c5eb67c (diff)
Fix hiding video breaking playback
Also make the video player code closer to upstream
Diffstat (limited to 'app/javascript/flavours/glitch/features')
-rw-r--r--app/javascript/flavours/glitch/features/video/index.js28
1 files changed, 16 insertions, 12 deletions
diff --git a/app/javascript/flavours/glitch/features/video/index.js b/app/javascript/flavours/glitch/features/video/index.js
index d22bc1d56..870812856 100644
--- a/app/javascript/flavours/glitch/features/video/index.js
+++ b/app/javascript/flavours/glitch/features/video/index.js
@@ -281,9 +281,9 @@ class Video extends React.PureComponent {
 
   togglePlay = () => {
     if (this.state.paused) {
-      this.video.play();
+      this.setState({ paused: false }, () => this.video.play());
     } else {
-      this.video.pause();
+      this.setState({ paused: true }, () => this.video.pause());
     }
   }
 
@@ -381,13 +381,16 @@ class Video extends React.PureComponent {
   }
 
   toggleMute = () => {
-    this.video.muted = !this.video.muted;
-    this.setState({ muted: this.video.muted });
+    const muted = !this.video.muted;
+
+    this.setState({ muted }, () => {
+      this.video.muted = muted;
+    });
   }
 
   toggleReveal = () => {
     if (this.state.revealed) {
-      this.video.pause();
+      this.setState({ paused: true });
     }
 
     if (this.props.onToggleVisibility) {
@@ -475,13 +478,6 @@ class Video extends React.PureComponent {
       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;
 
     if (this.props.currentTime || fullscreen || dragging) {
@@ -492,6 +488,14 @@ class Video extends React.PureComponent {
       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 (
       <div
         className={computedClass}