From 0e476f3c4fbbcab9b4895b8abff93075dfd2bf0c Mon Sep 17 00:00:00 2001 From: Christian Schmidt Date: Sun, 26 Feb 2023 20:13:27 +0100 Subject: [PATCH] [Glitch] Add `lang` attribute to media and poll options Port d3eefead3014175b264cb56f6f4cb552cbaaeac6 to glitch-soc Signed-off-by: Claire --- app/javascript/flavours/glitch/components/gifv.jsx | 5 ++++- .../glitch/components/media_attachments.jsx | 6 +++++- .../flavours/glitch/components/media_gallery.jsx | 14 +++++++++----- app/javascript/flavours/glitch/components/poll.jsx | 5 ++++- .../flavours/glitch/components/status.jsx | 5 ++++- .../account_gallery/components/media_item.jsx | 3 +++ .../flavours/glitch/features/audio/index.jsx | 4 +++- .../features/status/components/detailed_status.jsx | 5 ++++- .../glitch/features/ui/components/audio_modal.jsx | 7 +++++-- .../ui/components/compare_history_modal.jsx | 11 +++++++---- .../glitch/features/ui/components/image_loader.jsx | 5 ++++- .../glitch/features/ui/components/media_modal.jsx | 13 +++++++++++-- .../glitch/features/ui/components/video_modal.jsx | 12 ++++++++++-- .../features/ui/components/zoomable_image.jsx | 5 ++++- .../flavours/glitch/features/video/index.jsx | 4 +++- 15 files changed, 80 insertions(+), 24 deletions(-) diff --git a/app/javascript/flavours/glitch/components/gifv.jsx b/app/javascript/flavours/glitch/components/gifv.jsx index 1f0f99b464..9ec201c6cc 100644 --- a/app/javascript/flavours/glitch/components/gifv.jsx +++ b/app/javascript/flavours/glitch/components/gifv.jsx @@ -6,6 +6,7 @@ export default class GIFV extends React.PureComponent { static propTypes = { src: PropTypes.string.isRequired, alt: PropTypes.string, + lang: PropTypes.string, width: PropTypes.number, height: PropTypes.number, onClick: PropTypes.func, @@ -35,7 +36,7 @@ export default class GIFV extends React.PureComponent { }; render () { - const { src, width, height, alt } = this.props; + const { src, width, height, alt, lang } = this.props; const { loading } = this.state; return ( @@ -48,6 +49,7 @@ export default class GIFV extends React.PureComponent { tabIndex='0' aria-label={alt} title={alt} + lang={lang} onClick={this.handleClick} /> )} @@ -58,6 +60,7 @@ export default class GIFV extends React.PureComponent { tabIndex='0' aria-label={alt} title={alt} + lang={lang} muted loop autoPlay diff --git a/app/javascript/flavours/glitch/components/media_attachments.jsx b/app/javascript/flavours/glitch/components/media_attachments.jsx index 33f01bb5a0..b11d3526f9 100644 --- a/app/javascript/flavours/glitch/components/media_attachments.jsx +++ b/app/javascript/flavours/glitch/components/media_attachments.jsx @@ -10,6 +10,7 @@ export default class MediaAttachments extends ImmutablePureComponent { static propTypes = { status: ImmutablePropTypes.map.isRequired, + lang: PropTypes.string, height: PropTypes.number, width: PropTypes.number, revealed: PropTypes.bool, @@ -49,7 +50,7 @@ export default class MediaAttachments extends ImmutablePureComponent { }; render () { - const { status, width, height, revealed } = this.props; + const { status, lang, width, height, revealed } = this.props; const mediaAttachments = status.get('media_attachments'); if (mediaAttachments.size === 0) { @@ -65,6 +66,7 @@ export default class MediaAttachments extends ImmutablePureComponent { ( - + @@ -209,6 +211,7 @@ class Item extends React.PureComponent { className={`media-gallery__item-gifv-thumbnail${letterbox ? ' letterbox' : ''}`} aria-label={attachment.get('description')} title={attachment.get('description')} + lang={lang} role='application' src={attachment.get('url')} onClick={this.handleClick} @@ -251,6 +254,7 @@ class MediaGallery extends React.PureComponent { fullwidth: PropTypes.bool, hidden: PropTypes.bool, media: ImmutablePropTypes.list.isRequired, + lang: PropTypes.string, size: PropTypes.object, onOpenMedia: PropTypes.func.isRequired, intl: PropTypes.object.isRequired, @@ -342,7 +346,7 @@ class MediaGallery extends React.PureComponent { } render () { - const { media, intl, sensitive, letterbox, fullwidth, defaultWidth, autoplay } = this.props; + const { media, lang, intl, sensitive, letterbox, fullwidth, defaultWidth, autoplay } = this.props; const { visible } = this.state; const size = media.take(4).size; const uncached = media.every(attachment => attachment.get('type') === 'unknown'); @@ -364,9 +368,9 @@ class MediaGallery extends React.PureComponent { } if (this.isStandaloneEligible()) { - children = ; + children = ; } else { - children = media.take(4).map((attachment, i) => ); + children = media.take(4).map((attachment, i) => ); } if (uncached) { diff --git a/app/javascript/flavours/glitch/components/poll.jsx b/app/javascript/flavours/glitch/components/poll.jsx index 53ece560e7..8b799309bf 100644 --- a/app/javascript/flavours/glitch/components/poll.jsx +++ b/app/javascript/flavours/glitch/components/poll.jsx @@ -40,6 +40,7 @@ class Poll extends ImmutablePureComponent { static propTypes = { poll: ImmutablePropTypes.map, + lang: PropTypes.string, intl: PropTypes.object.isRequired, disabled: PropTypes.bool, refresh: PropTypes.func, @@ -126,7 +127,7 @@ class Poll extends ImmutablePureComponent { }; renderOption (option, optionIndex, showResults) { - const { poll, disabled, intl } = this.props; + const { poll, lang, disabled, intl } = this.props; const pollVotesCount = poll.get('voters_count') || poll.get('votes_count'); const percent = pollVotesCount === 0 ? 0 : (option.get('votes_count') / pollVotesCount) * 100; const leading = poll.get('options').filterNot(other => other.get('title') === option.get('title')).every(other => option.get('votes_count') >= other.get('votes_count')); @@ -159,6 +160,7 @@ class Poll extends ImmutablePureComponent { onKeyPress={this.handleOptionKeyPress} aria-checked={active} aria-label={option.get('title')} + lang={lang} data-index={optionIndex} /> )} @@ -175,6 +177,7 @@ class Poll extends ImmutablePureComponent { diff --git a/app/javascript/flavours/glitch/components/status.jsx b/app/javascript/flavours/glitch/components/status.jsx index 34880efe41..2f919176c4 100644 --- a/app/javascript/flavours/glitch/components/status.jsx +++ b/app/javascript/flavours/glitch/components/status.jsx @@ -630,6 +630,7 @@ class Status extends ImmutablePureComponent { ( ); + contentMedia.push(); contentMediaIcons.push('tasks'); } diff --git a/app/javascript/flavours/glitch/features/account_gallery/components/media_item.jsx b/app/javascript/flavours/glitch/features/account_gallery/components/media_item.jsx index d169875b01..5fd84996b2 100644 --- a/app/javascript/flavours/glitch/features/account_gallery/components/media_item.jsx +++ b/app/javascript/flavours/glitch/features/account_gallery/components/media_item.jsx @@ -76,6 +76,7 @@ export default class MediaItem extends ImmutablePureComponent { {attachment.get('description')} ); @@ -95,6 +96,7 @@ export default class MediaItem extends ImmutablePureComponent { {attachment.get('description')} @@ -105,6 +107,7 @@ export default class MediaItem extends ImmutablePureComponent { className='media-gallery__item-gifv-thumbnail' aria-label={attachment.get('description')} title={attachment.get('description')} + lang={status.get('language')} role='application' src={attachment.get('url')} onMouseEnter={this.handleMouseEnter} diff --git a/app/javascript/flavours/glitch/features/audio/index.jsx b/app/javascript/flavours/glitch/features/audio/index.jsx index c4aa989628..05c3beef96 100644 --- a/app/javascript/flavours/glitch/features/audio/index.jsx +++ b/app/javascript/flavours/glitch/features/audio/index.jsx @@ -28,6 +28,7 @@ class Audio extends React.PureComponent { static propTypes = { src: PropTypes.string.isRequired, alt: PropTypes.string, + lang: PropTypes.string, poster: PropTypes.string, duration: PropTypes.number, width: PropTypes.number, @@ -464,7 +465,7 @@ class Audio extends React.PureComponent { }; render () { - const { src, intl, alt, editable, autoPlay, sensitive, blurhash } = this.props; + const { src, intl, alt, lang, editable, autoPlay, sensitive, blurhash } = this.props; const { paused, muted, volume, currentTime, duration, buffer, dragging, revealed } = this.state; const progress = Math.min((currentTime / duration) * 100, 100); @@ -509,6 +510,7 @@ class Audio extends React.PureComponent { onKeyDown={this.handleAudioKeyDown} title={alt} aria-label={alt} + lang={lang} />
diff --git a/app/javascript/flavours/glitch/features/status/components/detailed_status.jsx b/app/javascript/flavours/glitch/features/status/components/detailed_status.jsx index 644881fa50..a945728551 100644 --- a/app/javascript/flavours/glitch/features/status/components/detailed_status.jsx +++ b/app/javascript/flavours/glitch/features/status/components/detailed_status.jsx @@ -169,6 +169,7 @@ class DetailedStatus extends ImmutablePureComponent {