about summary refs log tree commit diff
path: root/app/assets/javascripts/components
diff options
context:
space:
mode:
authorEugen Rochko <eugen@zeonfederated.com>2016-12-04 12:26:12 +0100
committerEugen Rochko <eugen@zeonfederated.com>2016-12-04 12:28:10 +0100
commit80c44ed9c19855d494ab26011dca0f6fbc644d0c (patch)
treea14d280f0fa88bfa6e3ef97fff26d50a632471b3 /app/assets/javascripts/components
parent290ffb63cdf4753bc30224619f182cc3db654e91 (diff)
Do not autoplay videos, display play button instead. Use expiring links when using S3. Do not keep originals
for avatars/headers, resize avatars down to 120x120 instead of 300x300. Set cache headers on S3 stuff, also
make it private (aka only accessible via expiring links to prevent hotlinking)
Diffstat (limited to 'app/assets/javascripts/components')
-rw-r--r--app/assets/javascripts/components/components/video_player.jsx9
1 files changed, 8 insertions, 1 deletions
diff --git a/app/assets/javascripts/components/components/video_player.jsx b/app/assets/javascripts/components/components/video_player.jsx
index 61c1995a7..8f64ad3cd 100644
--- a/app/assets/javascripts/components/components/video_player.jsx
+++ b/app/assets/javascripts/components/components/video_player.jsx
@@ -53,7 +53,8 @@ const VideoPlayer = React.createClass({
   propTypes: {
     media: ImmutablePropTypes.map.isRequired,
     width: React.PropTypes.number,
-    height: React.PropTypes.number
+    height: React.PropTypes.number,
+    sensitive: React.PropTypes.bool
   },
 
   getDefaultProps () {
@@ -102,6 +103,12 @@ const VideoPlayer = React.createClass({
           <span style={spoilerSubSpanStyle}><FormattedMessage id='status.sensitive_toggle' defaultMessage='Click to view' /></span>
         </div>
       );
+    } else if (!sensitive && !this.state.visible) {
+      return (
+        <div style={{ cursor: 'pointer', position: 'relative', marginTop: '8px', width: `${width}px`, height: `${height}px`, background: `url(${media.get('preview_url')}) no-repeat center`, backgroundSize: 'cover' }} onClick={this.handleOpen}>
+          <div style={{ position: 'absolute', top: '50%', left: '50%', fontSize: '36px', transform: 'translate(-50%, -50%)', padding: '5px', borderRadius: '100px', color: 'rgba(255, 255, 255, 0.8)' }}><i className='fa fa-play' /></div>
+        </div>
+      );
     }
 
     return (