Fix GIF avatars not autoplaying (fixes #287, tootsuite pr #6000)

master
cwm 7 years ago
parent 7347bc7334
commit 832a93e67c
  1. 5
      app/javascript/flavours/glitch/components/avatar.js
  2. 13
      app/javascript/flavours/glitch/components/avatar_overlay.js

@ -1,6 +1,7 @@
import React from 'react'; import React from 'react';
import PropTypes from 'prop-types'; import PropTypes from 'prop-types';
import ImmutablePropTypes from 'react-immutable-proptypes'; import ImmutablePropTypes from 'react-immutable-proptypes';
import { autoPlayGif } from 'flavours/glitch/util/initial_state';
export default class Avatar extends React.PureComponent { export default class Avatar extends React.PureComponent {
@ -8,12 +9,12 @@ export default class Avatar extends React.PureComponent {
account: ImmutablePropTypes.map.isRequired, account: ImmutablePropTypes.map.isRequired,
size: PropTypes.number.isRequired, size: PropTypes.number.isRequired,
style: PropTypes.object, style: PropTypes.object,
animate: PropTypes.bool,
inline: PropTypes.bool, inline: PropTypes.bool,
animate: PropTypes.bool,
}; };
static defaultProps = { static defaultProps = {
animate: false, animate: autoPlayGif,
size: 20, size: 20,
inline: false, inline: false,
}; };

@ -1,22 +1,29 @@
import React from 'react'; import React from 'react';
import PropTypes from 'prop-types';
import ImmutablePropTypes from 'react-immutable-proptypes'; import ImmutablePropTypes from 'react-immutable-proptypes';
import { autoPlayGif } from 'flavours/glitch/util/initial_state';
export default class AvatarOverlay extends React.PureComponent { export default class AvatarOverlay extends React.PureComponent {
static propTypes = { static propTypes = {
account: ImmutablePropTypes.map.isRequired, account: ImmutablePropTypes.map.isRequired,
friend: ImmutablePropTypes.map.isRequired, friend: ImmutablePropTypes.map.isRequired,
animate: PropTypes.bool,
};
static defaultProps = {
animate: autoPlayGif,
}; };
render() { render() {
const { account, friend } = this.props; const { account, friend, animate } = this.props;
const baseStyle = { const baseStyle = {
backgroundImage: `url(${account.get('avatar_static')})`, backgroundImage: `url(${account.get(animate ? 'avatar' : 'avatar_static')})`,
}; };
const overlayStyle = { const overlayStyle = {
backgroundImage: `url(${friend.get('avatar_static')})`, backgroundImage: `url(${friend.get(animate ? 'avatar' : 'avatar_static')})`,
}; };
return ( return (

Loading…
Cancel
Save