fix gif autoplay on iOS (#21422)
parent
e617ee7fd9
commit
c0dcf15d1e
|
@ -4,7 +4,6 @@ import PropTypes from 'prop-types';
|
||||||
import { is } from 'immutable';
|
import { is } from 'immutable';
|
||||||
import IconButton from './icon_button';
|
import IconButton from './icon_button';
|
||||||
import { defineMessages, injectIntl, FormattedMessage } from 'react-intl';
|
import { defineMessages, injectIntl, FormattedMessage } from 'react-intl';
|
||||||
import { isIOS } from '../is_mobile';
|
|
||||||
import classNames from 'classnames';
|
import classNames from 'classnames';
|
||||||
import { autoPlayGif, cropImages, displayMedia, useBlurhash } from '../initial_state';
|
import { autoPlayGif, cropImages, displayMedia, useBlurhash } from '../initial_state';
|
||||||
import { debounce } from 'lodash';
|
import { debounce } from 'lodash';
|
||||||
|
@ -181,7 +180,7 @@ class Item extends React.PureComponent {
|
||||||
</a>
|
</a>
|
||||||
);
|
);
|
||||||
} else if (attachment.get('type') === 'gifv') {
|
} else if (attachment.get('type') === 'gifv') {
|
||||||
const autoPlay = !isIOS() && this.getAutoPlay();
|
const autoPlay = this.getAutoPlay();
|
||||||
|
|
||||||
thumbnail = (
|
thumbnail = (
|
||||||
<div className={classNames('media-gallery__gifv', { autoplay: autoPlay })}>
|
<div className={classNames('media-gallery__gifv', { autoplay: autoPlay })}>
|
||||||
|
@ -195,6 +194,7 @@ class Item extends React.PureComponent {
|
||||||
onMouseEnter={this.handleMouseEnter}
|
onMouseEnter={this.handleMouseEnter}
|
||||||
onMouseLeave={this.handleMouseLeave}
|
onMouseLeave={this.handleMouseLeave}
|
||||||
autoPlay={autoPlay}
|
autoPlay={autoPlay}
|
||||||
|
playsInline
|
||||||
loop
|
loop
|
||||||
muted
|
muted
|
||||||
/>
|
/>
|
||||||
|
|
|
@ -2,7 +2,6 @@ import Blurhash from 'mastodon/components/blurhash';
|
||||||
import classNames from 'classnames';
|
import classNames from 'classnames';
|
||||||
import Icon from 'mastodon/components/icon';
|
import Icon from 'mastodon/components/icon';
|
||||||
import { autoPlayGif, displayMedia, useBlurhash } from 'mastodon/initial_state';
|
import { autoPlayGif, displayMedia, useBlurhash } from 'mastodon/initial_state';
|
||||||
import { isIOS } from 'mastodon/is_mobile';
|
|
||||||
import PropTypes from 'prop-types';
|
import PropTypes from 'prop-types';
|
||||||
import React from 'react';
|
import React from 'react';
|
||||||
import ImmutablePropTypes from 'react-immutable-proptypes';
|
import ImmutablePropTypes from 'react-immutable-proptypes';
|
||||||
|
@ -109,7 +108,8 @@ export default class MediaItem extends ImmutablePureComponent {
|
||||||
src={attachment.get('url')}
|
src={attachment.get('url')}
|
||||||
onMouseEnter={this.handleMouseEnter}
|
onMouseEnter={this.handleMouseEnter}
|
||||||
onMouseLeave={this.handleMouseLeave}
|
onMouseLeave={this.handleMouseLeave}
|
||||||
autoPlay={!isIOS() && autoPlayGif}
|
autoPlay={autoPlayGif}
|
||||||
|
playsInline
|
||||||
loop
|
loop
|
||||||
muted
|
muted
|
||||||
/>
|
/>
|
||||||
|
|
Reference in New Issue