Merge remote-tracking branch 'parent/main' into upstream-20241001
This commit is contained in:
commit
133a263f79
222 changed files with 1834 additions and 720 deletions
|
@ -10,7 +10,9 @@ import ImmutablePropTypes from 'react-immutable-proptypes';
|
|||
|
||||
import { debounce } from 'lodash';
|
||||
|
||||
import { AltTextBadge } from 'mastodon/components/alt_text_badge';
|
||||
import { Blurhash } from 'mastodon/components/blurhash';
|
||||
import { formatTime } from 'mastodon/features/video';
|
||||
|
||||
import { autoPlayGif, displayMedia, useBlurhash } from '../initial_state';
|
||||
|
||||
|
@ -57,7 +59,7 @@ class Item extends PureComponent {
|
|||
|
||||
hoverToPlay () {
|
||||
const { attachment } = this.props;
|
||||
return !this.getAutoPlay() && attachment.get('type') === 'gifv';
|
||||
return !this.getAutoPlay() && ['gifv', 'video'].includes(attachment.get('type'));
|
||||
}
|
||||
|
||||
handleClick = (e) => {
|
||||
|
@ -112,7 +114,7 @@ class Item extends PureComponent {
|
|||
}
|
||||
|
||||
if (attachment.get('description')?.length > 0) {
|
||||
badges.push(<span key='alt' className='media-gallery__alt__label'>ALT</span>);
|
||||
badges.push(<AltTextBadge key='alt' description={attachment.get('description')} />);
|
||||
}
|
||||
|
||||
const description = attachment.getIn(['translation', 'description']) || attachment.get('description');
|
||||
|
@ -166,10 +168,15 @@ class Item extends PureComponent {
|
|||
/>
|
||||
</a>
|
||||
);
|
||||
} else if (attachment.get('type') === 'gifv') {
|
||||
} else if (['gifv', 'video'].includes(attachment.get('type'))) {
|
||||
const autoPlay = this.getAutoPlay();
|
||||
const duration = attachment.getIn(['meta', 'original', 'duration']);
|
||||
|
||||
badges.push(<span key='gif' className='media-gallery__gifv__label'>GIF</span>);
|
||||
if (attachment.get('type') === 'gifv') {
|
||||
badges.push(<span key='gif' className='media-gallery__alt__label media-gallery__alt__label--non-interactive'>GIF</span>);
|
||||
} else {
|
||||
badges.push(<span key='video' className='media-gallery__alt__label media-gallery__alt__label--non-interactive'>{formatTime(Math.floor(duration))}</span>);
|
||||
}
|
||||
|
||||
thumbnail = (
|
||||
<div className={classNames('media-gallery__gifv', { autoplay: autoPlay })}>
|
||||
|
@ -183,6 +190,7 @@ class Item extends PureComponent {
|
|||
onClick={this.handleClick}
|
||||
onMouseEnter={this.handleMouseEnter}
|
||||
onMouseLeave={this.handleMouseLeave}
|
||||
onLoadedData={this.handleImageLoad}
|
||||
autoPlay={autoPlay}
|
||||
playsInline
|
||||
loop
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue