onClick: PropTypes.func.isRequired,
displayWidth: PropTypes.number,
visible: PropTypes.bool.isRequired,
+ autoplay: PropTypes.bool,
};
static defaultProps = {
}
}
+ getAutoPlay() {
+ return this.props.autoplay || autoPlayGif;
+ }
+
hoverToPlay () {
const { attachment } = this.props;
- return !autoPlayGif && attachment.get('type') === 'gifv';
+ return !this.getAutoPlay() && attachment.get('type') === 'gifv';
}
handleClick = (e) => {
</a>
);
} else if (attachment.get('type') === 'gifv') {
- const autoPlay = !isIOS() && autoPlayGif;
+ const autoPlay = !isIOS() && this.getAutoPlay();
thumbnail = (
<div className={classNames('media-gallery__gifv', { autoplay: autoPlay })}>
defaultWidth: PropTypes.number,
cacheWidth: PropTypes.func,
visible: PropTypes.bool,
+ autoplay: PropTypes.bool,
onToggleVisibility: PropTypes.func,
};
}
render () {
- const { media, intl, sensitive, letterbox, fullwidth, defaultWidth } = this.props;
+ const { media, intl, sensitive, letterbox, fullwidth, defaultWidth, autoplay } = this.props;
const { visible } = this.state;
const size = media.take(4).size;
const uncached = media.every(attachment => attachment.get('type') === 'unknown');
}
if (this.isStandaloneEligible()) {
- children = <Item standalone onClick={this.handleClick} attachment={media.get(0)} displayWidth={width} visible={visible} />;
+ children = <Item standalone autoplay={autoplay} onClick={this.handleClick} attachment={media.get(0)} displayWidth={width} visible={visible} />;
} else {
- children = media.take(4).map((attachment, i) => <Item key={attachment.get('id')} onClick={this.handleClick} attachment={attachment} index={i} size={size} letterbox={letterbox} displayWidth={width} visible={visible || uncached} />);
+ children = media.take(4).map((attachment, i) => <Item key={attachment.get('id')} autoplay={autoplay} onClick={this.handleClick} attachment={attachment} index={i} size={size} letterbox={letterbox} displayWidth={width} visible={visible || uncached} />);
}
if (uncached) {