Added GIF hover-to-play support

master
kibigo! 7 years ago
parent 003bfd094e
commit 227dbb6adb
  1. 20
      app/javascript/glitch/components/status/gallery/item.js

@ -17,6 +17,24 @@ export default class StatusGalleryItem extends React.PureComponent {
autoPlayGif: PropTypes.bool.isRequired,
};
handleMouseEnter = (e) => {
if (this.hoverToPlay()) {
e.target.play();
}
}
handleMouseLeave = (e) => {
if (this.hoverToPlay()) {
e.target.pause();
e.target.currentTime = 0;
}
}
hoverToPlay () {
const { attachment, autoPlayGif } = this.props;
return !autoPlayGif && attachment.get('type') === 'gifv';
}
handleClick = (e) => {
const { index, onClick } = this.props;
@ -112,6 +130,8 @@ export default class StatusGalleryItem extends React.PureComponent {
role='application'
src={attachment.get('url')}
onClick={this.handleClick}
onMouseEnter={this.handleMouseEnter}
onMouseLeave={this.handleMouseLeave}
autoPlay={autoPlay}
loop
muted

Loading…
Cancel
Save