From 832a93e67c94ad479c8c8cff2372350b65fb77fc Mon Sep 17 00:00:00 2001 From: cwm Date: Thu, 28 Dec 2017 08:30:51 -0600 Subject: [PATCH] Fix GIF avatars not autoplaying (fixes #287, tootsuite pr #6000) --- app/javascript/flavours/glitch/components/avatar.js | 5 +++-- .../flavours/glitch/components/avatar_overlay.js | 13 ++++++++++--- 2 files changed, 13 insertions(+), 5 deletions(-) diff --git a/app/javascript/flavours/glitch/components/avatar.js b/app/javascript/flavours/glitch/components/avatar.js index dd155f05906..82ab0f45a06 100644 --- a/app/javascript/flavours/glitch/components/avatar.js +++ b/app/javascript/flavours/glitch/components/avatar.js @@ -1,6 +1,7 @@ import React from 'react'; import PropTypes from 'prop-types'; import ImmutablePropTypes from 'react-immutable-proptypes'; +import { autoPlayGif } from 'flavours/glitch/util/initial_state'; export default class Avatar extends React.PureComponent { @@ -8,12 +9,12 @@ export default class Avatar extends React.PureComponent { account: ImmutablePropTypes.map.isRequired, size: PropTypes.number.isRequired, style: PropTypes.object, - animate: PropTypes.bool, inline: PropTypes.bool, + animate: PropTypes.bool, }; static defaultProps = { - animate: false, + animate: autoPlayGif, size: 20, inline: false, }; diff --git a/app/javascript/flavours/glitch/components/avatar_overlay.js b/app/javascript/flavours/glitch/components/avatar_overlay.js index 2ecf9fa448b..23db5182bc8 100644 --- a/app/javascript/flavours/glitch/components/avatar_overlay.js +++ b/app/javascript/flavours/glitch/components/avatar_overlay.js @@ -1,22 +1,29 @@ import React from 'react'; +import PropTypes from 'prop-types'; import ImmutablePropTypes from 'react-immutable-proptypes'; +import { autoPlayGif } from 'flavours/glitch/util/initial_state'; export default class AvatarOverlay extends React.PureComponent { static propTypes = { account: ImmutablePropTypes.map.isRequired, friend: ImmutablePropTypes.map.isRequired, + animate: PropTypes.bool, + }; + + static defaultProps = { + animate: autoPlayGif, }; render() { - const { account, friend } = this.props; + const { account, friend, animate } = this.props; const baseStyle = { - backgroundImage: `url(${account.get('avatar_static')})`, + backgroundImage: `url(${account.get(animate ? 'avatar' : 'avatar_static')})`, }; const overlayStyle = { - backgroundImage: `url(${friend.get('avatar_static')})`, + backgroundImage: `url(${friend.get(animate ? 'avatar' : 'avatar_static')})`, }; return (