fix gif autoplay on iOS (#21422)
This commit is contained in:
		
							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
 | 
				
			||||||
          />
 | 
					          />
 | 
				
			||||||
 | 
				
			|||||||
		Loading…
	
	
			
			x
			
			
		
	
		Reference in New Issue
	
	Block a user