about summary refs log tree commit diff
path: root/app/javascript/flavours/glitch/features/audio
diff options
context:
space:
mode:
authorEugen Rochko <eugen@zeonfederated.com>2020-07-10 22:09:28 +0200
committerThibaut Girka <thib@sitedethib.com>2020-07-15 15:48:24 +0200
commitdad313204651dc7aed462b5fc2db314954e9e5e1 (patch)
tree5735b3cac536cdb68e4fe004d7a282ff89d9dcd2 /app/javascript/flavours/glitch/features/audio
parent3f60b096b51b000905290d69ea05b874b60fa9e0 (diff)
[Glitch] Fix audio and video items in account gallery in web UI
Port 6cc5b822f5ca7df9b267ac2b5d24e2aac2dc0325 to glitch-soc

Signed-off-by: Thibaut Girka <thib@sitedethib.com>
Diffstat (limited to 'app/javascript/flavours/glitch/features/audio')
-rw-r--r--app/javascript/flavours/glitch/features/audio/index.js14
1 files changed, 12 insertions, 2 deletions
diff --git a/app/javascript/flavours/glitch/features/audio/index.js b/app/javascript/flavours/glitch/features/audio/index.js
index 120a5ce1a..9cb2307fd 100644
--- a/app/javascript/flavours/glitch/features/audio/index.js
+++ b/app/javascript/flavours/glitch/features/audio/index.js
@@ -37,6 +37,7 @@ class Audio extends React.PureComponent {
     backgroundColor: PropTypes.string,
     foregroundColor: PropTypes.string,
     accentColor: PropTypes.string,
+    autoPlay: PropTypes.bool,
   };
 
   state = {
@@ -244,6 +245,14 @@ class Audio extends React.PureComponent {
     this.setState({ hovered: false });
   }
 
+  handleLoadedData = () => {
+    const { autoPlay } = this.props;
+
+    if (autoPlay) {
+      this.audio.play();
+    }
+  }
+
   _initAudioContext () {
     const context  = new AudioContext();
     const source   = context.createMediaElementSource(this.audio);
@@ -321,7 +330,7 @@ class Audio extends React.PureComponent {
   }
 
   render () {
-    const { src, intl, alt, editable } = this.props;
+    const { src, intl, alt, editable, autoPlay } = this.props;
     const { paused, muted, volume, currentTime, duration, buffer, dragging } = this.state;
     const progress = (currentTime / duration) * 100;
 
@@ -330,10 +339,11 @@ class Audio extends React.PureComponent {
         <audio
           src={src}
           ref={this.setAudioRef}
-          preload='none'
+          preload={autoPlay ? 'auto' : 'none'}
           onPlay={this.handlePlay}
           onPause={this.handlePause}
           onProgress={this.handleProgress}
+          onLoadedData={this.handleLoadedData}
           crossOrigin='anonymous'
         />