diff options
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 1f0f99b46..9ec201c6c 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 33f01bb5a..b11d3526f 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 { <Component src={audio.get('url')} alt={audio.get('description')} + lang={lang || status.get('language')} width={width} height={height} poster={audio.get('preview_url') || status.getIn(['account', 'avatar_static'])} @@ -88,6 +90,7 @@ export default class MediaAttachments extends ImmutablePureComponent { blurhash={video.get('blurhash')} src={video.get('url')} alt={video.get('description')} + lang={lang || status.get('language')} width={width} height={height} inline @@ -104,6 +107,7 @@ export default class MediaAttachments extends ImmutablePureComponent { {Component => ( <Component media={mediaAttachments} + lang={lang || status.get('language')} sensitive={status.get('sensitive')} defaultWidth={width} revealed={revealed} diff --git a/app/javascript/flavours/glitch/components/media_gallery.jsx b/app/javascript/flavours/glitch/components/media_gallery.jsx index c11ac46c2..6ae510d08 100644 --- a/app/javascript/flavours/glitch/components/media_gallery.jsx +++ b/app/javascript/flavours/glitch/components/media_gallery.jsx @@ -36,6 +36,7 @@ class Item extends React.PureComponent { static propTypes = { attachment: ImmutablePropTypes.map.isRequired, + lang: PropTypes.string, standalone: PropTypes.bool, index: PropTypes.number.isRequired, size: PropTypes.number.isRequired, @@ -98,7 +99,7 @@ class Item extends React.PureComponent { }; render () { - const { attachment, index, size, standalone, letterbox, displayWidth, visible } = this.props; + const { attachment, lang, index, size, standalone, letterbox, displayWidth, visible } = this.props; let width = 50; let height = 100; @@ -154,7 +155,7 @@ class Item extends React.PureComponent { if (attachment.get('type') === 'unknown') { return ( <div className={classNames('media-gallery__item', { standalone })} key={attachment.get('id')} style={{ left: left, top: top, right: right, bottom: bottom, width: `${width}%`, height: `${height}%` }}> - <a className='media-gallery__item-thumbnail' href={attachment.get('remote_url') || attachment.get('url')} style={{ cursor: 'pointer' }} title={attachment.get('description')} target='_blank' rel='noopener noreferrer'> + <a className='media-gallery__item-thumbnail' href={attachment.get('remote_url') || attachment.get('url')} style={{ cursor: 'pointer' }} title={attachment.get('description')} lang={lang} target='_blank' rel='noopener noreferrer'> <Blurhash hash={attachment.get('blurhash')} className='media-gallery__preview' @@ -195,6 +196,7 @@ class Item extends React.PureComponent { sizes={sizes} alt={attachment.get('description')} title={attachment.get('description')} + lang={lang} style={{ objectPosition: letterbox ? null : `${x}% ${y}%` }} onLoad={this.handleImageLoad} /> @@ -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 = <Item standalone autoplay={autoplay} onClick={this.handleClick} attachment={media.get(0)} displayWidth={width} visible={visible} />; + children = <Item standalone autoplay={autoplay} onClick={this.handleClick} attachment={media.get(0)} lang={lang} displayWidth={width} visible={visible} />; } else { - children = media.take(4).map((attachment, i) => <Item key={attachment.get('id')} autoplay={autoplay} onClick={this.handleClick} attachment={attachment} index={i} size={size} letterbox={letterbox} displayWidth={width} visible={visible || uncached} />); + children = media.take(4).map((attachment, i) => <Item key={attachment.get('id')} autoplay={autoplay} onClick={this.handleClick} attachment={attachment} index={i} lang={lang} size={size} letterbox={letterbox} displayWidth={width} visible={visible || uncached} />); } if (uncached) { diff --git a/app/javascript/flavours/glitch/components/poll.jsx b/app/javascript/flavours/glitch/components/poll.jsx index 53ece560e..8b799309b 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 { <span className='poll__option__text translate' + lang={lang} dangerouslySetInnerHTML={{ __html: titleEmojified }} /> diff --git a/app/javascript/flavours/glitch/components/status.jsx b/app/javascript/flavours/glitch/components/status.jsx index 34880efe4..2f919176c 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 { <Component src={attachment.get('url')} alt={attachment.get('description')} + lang={status.get('language')} poster={attachment.get('preview_url') || status.getIn(['account', 'avatar_static'])} backgroundColor={attachment.getIn(['meta', 'colors', 'background'])} foregroundColor={attachment.getIn(['meta', 'colors', 'foreground'])} @@ -659,6 +660,7 @@ class Status extends ImmutablePureComponent { blurhash={attachment.get('blurhash')} src={attachment.get('url')} alt={attachment.get('description')} + lang={status.get('language')} inline sensitive={status.get('sensitive')} letterbox={settings.getIn(['media', 'letterbox'])} @@ -680,6 +682,7 @@ class Status extends ImmutablePureComponent { {Component => ( <Component media={attachments} + lang={status.get('language')} sensitive={status.get('sensitive')} letterbox={settings.getIn(['media', 'letterbox'])} fullwidth={settings.getIn(['media', 'fullwidth'])} @@ -714,7 +717,7 @@ class Status extends ImmutablePureComponent { } if (status.get('poll')) { - contentMedia.push(<PollContainer pollId={status.get('poll')} />); + contentMedia.push(<PollContainer pollId={status.get('poll')} lang={status.get('language')} />); 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 d169875b0..5fd84996b 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 { <img src={attachment.get('preview_url') || attachment.getIn(['account', 'avatar_static'])} alt={attachment.get('description')} + lang={status.get('language')} onLoad={this.handleImageLoad} /> ); @@ -95,6 +96,7 @@ export default class MediaItem extends ImmutablePureComponent { <img src={attachment.get('preview_url')} alt={attachment.get('description')} + lang={status.get('language')} style={{ objectPosition: `${x}% ${y}%` }} onLoad={this.handleImageLoad} /> @@ -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 c4aa98962..05c3beef9 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} /> <div className={classNames('spoiler-button', { 'spoiler-button--hidden': revealed || editable })}> 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 644881fa5..a94572855 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 { <Audio src={attachment.get('url')} alt={attachment.get('description')} + lang={status.get('language')} duration={attachment.getIn(['meta', 'original', 'duration'], 0)} poster={attachment.get('preview_url') || status.getIn(['account', 'avatar_static'])} backgroundColor={attachment.getIn(['meta', 'colors', 'background'])} @@ -191,6 +192,7 @@ class DetailedStatus extends ImmutablePureComponent { blurhash={attachment.get('blurhash')} src={attachment.get('url')} alt={attachment.get('description')} + lang={status.get('language')} inline sensitive={status.get('sensitive')} letterbox={settings.getIn(['media', 'letterbox'])} @@ -209,6 +211,7 @@ class DetailedStatus extends ImmutablePureComponent { standalone sensitive={status.get('sensitive')} media={status.get('media_attachments')} + lang={status.get('language')} letterbox={settings.getIn(['media', 'letterbox'])} fullwidth={settings.getIn(['media', 'fullwidth'])} hidden={!expanded} @@ -225,7 +228,7 @@ class DetailedStatus extends ImmutablePureComponent { } if (status.get('poll')) { - contentMedia.push(<PollContainer pollId={status.get('poll')} />); + contentMedia.push(<PollContainer pollId={status.get('poll')} lang={status.get('language')} />); contentMediaIcons.push('tasks'); } diff --git a/app/javascript/flavours/glitch/features/ui/components/audio_modal.jsx b/app/javascript/flavours/glitch/features/ui/components/audio_modal.jsx index fc98cc6af..ff7687c1e 100644 --- a/app/javascript/flavours/glitch/features/ui/components/audio_modal.jsx +++ b/app/javascript/flavours/glitch/features/ui/components/audio_modal.jsx @@ -7,15 +7,17 @@ import ImmutablePureComponent from 'react-immutable-pure-component'; import Footer from 'flavours/glitch/features/picture_in_picture/components/footer'; const mapStateToProps = (state, { statusId }) => ({ + language: state.getIn(['statuses', statusId, 'language']), accountStaticAvatar: state.getIn(['accounts', state.getIn(['statuses', statusId, 'account']), 'avatar_static']), }); -export default @connect(mapStateToProps) +export default @connect(mapStateToProps, null, null, { forwardRef: true }) class AudioModal extends ImmutablePureComponent { static propTypes = { media: ImmutablePropTypes.map.isRequired, statusId: PropTypes.string.isRequired, + language: PropTypes.string, accountStaticAvatar: PropTypes.string.isRequired, options: PropTypes.shape({ autoPlay: PropTypes.bool, @@ -29,7 +31,7 @@ class AudioModal extends ImmutablePureComponent { }; render () { - const { media, accountStaticAvatar, statusId, onClose } = this.props; + const { media, language, accountStaticAvatar, statusId, onClose } = this.props; const options = this.props.options || {}; return ( @@ -38,6 +40,7 @@ class AudioModal extends ImmutablePureComponent { <Audio src={media.get('url')} alt={media.get('description')} + lang={language} duration={media.getIn(['meta', 'original', 'duration'], 0)} height={150} poster={media.get('preview_url') || accountStaticAvatar} diff --git a/app/javascript/flavours/glitch/features/ui/components/compare_history_modal.jsx b/app/javascript/flavours/glitch/features/ui/components/compare_history_modal.jsx index baf7f25be..4e74feb02 100644 --- a/app/javascript/flavours/glitch/features/ui/components/compare_history_modal.jsx +++ b/app/javascript/flavours/glitch/features/ui/components/compare_history_modal.jsx @@ -12,6 +12,7 @@ import RelativeTimestamp from 'flavours/glitch/components/relative_timestamp'; import MediaAttachments from 'flavours/glitch/components/media_attachments'; const mapStateToProps = (state, { statusId }) => ({ + language: state.getIn(['statuses', statusId, 'language']), versions: state.getIn(['history', statusId, 'items']), }); @@ -30,11 +31,12 @@ class CompareHistoryModal extends React.PureComponent { onClose: PropTypes.func.isRequired, index: PropTypes.number.isRequired, statusId: PropTypes.string.isRequired, + language: PropTypes.string.isRequired, versions: ImmutablePropTypes.list.isRequired, }; render () { - const { index, versions, onClose } = this.props; + const { index, versions, language, onClose } = this.props; const currentVersion = versions.get(index); const emojiMap = currentVersion.get('emojis').reduce((obj, emoji) => { @@ -65,12 +67,12 @@ class CompareHistoryModal extends React.PureComponent { <div className='status__content'> {currentVersion.get('spoiler_text').length > 0 && ( <React.Fragment> - <div className='translate' dangerouslySetInnerHTML={spoilerContent} /> + <div className='translate' dangerouslySetInnerHTML={spoilerContent} lang={language} /> <hr /> </React.Fragment> )} - <div className='status__content__text status__content__text--visible translate' dangerouslySetInnerHTML={content} /> + <div className='status__content__text status__content__text--visible translate' dangerouslySetInnerHTML={content} lang={language} /> {!!currentVersion.get('poll') && ( <div className='poll'> @@ -82,6 +84,7 @@ class CompareHistoryModal extends React.PureComponent { <span className='poll__option__text translate' dangerouslySetInnerHTML={{ __html: emojify(escapeTextContentForBrowser(option.get('title')), emojiMap) }} + lang={language} /> </li> ))} @@ -89,7 +92,7 @@ class CompareHistoryModal extends React.PureComponent { </div> )} - <MediaAttachments status={currentVersion} /> + <MediaAttachments status={currentVersion} lang={language} /> </div> </div> </div> diff --git a/app/javascript/flavours/glitch/features/ui/components/image_loader.jsx b/app/javascript/flavours/glitch/features/ui/components/image_loader.jsx index 92aeef5c4..9093eab28 100644 --- a/app/javascript/flavours/glitch/features/ui/components/image_loader.jsx +++ b/app/javascript/flavours/glitch/features/ui/components/image_loader.jsx @@ -8,6 +8,7 @@ export default class ImageLoader extends PureComponent { static propTypes = { alt: PropTypes.string, + lang: PropTypes.string, src: PropTypes.string.isRequired, previewSrc: PropTypes.string, width: PropTypes.number, @@ -18,6 +19,7 @@ export default class ImageLoader extends PureComponent { static defaultProps = { alt: '', + lang: '', width: null, height: null, }; @@ -129,7 +131,7 @@ export default class ImageLoader extends PureComponent { }; render () { - const { alt, src, width, height, onClick } = this.props; + const { alt, lang, src, width, height, onClick } = this.props; const { loading } = this.state; const className = classNames('image-loader', { @@ -154,6 +156,7 @@ export default class ImageLoader extends PureComponent { ) : ( <ZoomableImage alt={alt} + lang={lang} src={src} onClick={onClick} width={width} diff --git a/app/javascript/flavours/glitch/features/ui/components/media_modal.jsx b/app/javascript/flavours/glitch/features/ui/components/media_modal.jsx index 24559264e..9c67ed808 100644 --- a/app/javascript/flavours/glitch/features/ui/components/media_modal.jsx +++ b/app/javascript/flavours/glitch/features/ui/components/media_modal.jsx @@ -3,6 +3,7 @@ import ReactSwipeableViews from 'react-swipeable-views'; import ImmutablePropTypes from 'react-immutable-proptypes'; import PropTypes from 'prop-types'; import Video from 'flavours/glitch/features/video'; +import { connect } from 'react-redux'; import classNames from 'classnames'; import { defineMessages, injectIntl } from 'react-intl'; import IconButton from 'flavours/glitch/components/icon_button'; @@ -20,7 +21,12 @@ const messages = defineMessages({ next: { id: 'lightbox.next', defaultMessage: 'Next' }, }); -export default @injectIntl +const mapStateToProps = (state, { statusId }) => ({ + language: state.getIn(['statuses', statusId, 'language']), +}); + +export default @connect(mapStateToProps, null, null, { forwardRef: true }) +@injectIntl class MediaModal extends ImmutablePureComponent { static contextTypes = { @@ -131,7 +137,7 @@ class MediaModal extends ImmutablePureComponent { } render () { - const { media, statusId, intl, onClose } = this.props; + const { media, language, statusId, intl, onClose } = this.props; const { navigationHidden } = this.state; const index = this.getIndex(); @@ -151,6 +157,7 @@ class MediaModal extends ImmutablePureComponent { width={width} height={height} alt={image.get('description')} + lang={language} key={image.get('url')} onClick={this.toggleNavigation} zoomButtonHidden={this.state.zoomButtonHidden} @@ -173,6 +180,7 @@ class MediaModal extends ImmutablePureComponent { onCloseVideo={onClose} detailed alt={image.get('description')} + lang={language} key={image.get('url')} /> ); @@ -184,6 +192,7 @@ class MediaModal extends ImmutablePureComponent { height={height} key={image.get('preview_url')} alt={image.get('description')} + lang={language} onClick={this.toggleNavigation} /> ); diff --git a/app/javascript/flavours/glitch/features/ui/components/video_modal.jsx b/app/javascript/flavours/glitch/features/ui/components/video_modal.jsx index 90be11e4b..c1f837717 100644 --- a/app/javascript/flavours/glitch/features/ui/components/video_modal.jsx +++ b/app/javascript/flavours/glitch/features/ui/components/video_modal.jsx @@ -2,11 +2,17 @@ import React from 'react'; import ImmutablePropTypes from 'react-immutable-proptypes'; import PropTypes from 'prop-types'; import Video from 'flavours/glitch/features/video'; +import { connect } from 'react-redux'; import ImmutablePureComponent from 'react-immutable-pure-component'; import Footer from 'flavours/glitch/features/picture_in_picture/components/footer'; import { getAverageFromBlurhash } from 'flavours/glitch/blurhash'; -export default class VideoModal extends ImmutablePureComponent { +const mapStateToProps = (state, { statusId }) => ({ + language: state.getIn(['statuses', statusId, 'language']), +}); + +export default @connect(mapStateToProps, null, null, { forwardRef: true }) +class VideoModal extends ImmutablePureComponent { static contextTypes = { router: PropTypes.object, @@ -15,6 +21,7 @@ export default class VideoModal extends ImmutablePureComponent { static propTypes = { media: ImmutablePropTypes.map.isRequired, statusId: PropTypes.string, + language: PropTypes.string, options: PropTypes.shape({ startTime: PropTypes.number, autoPlay: PropTypes.bool, @@ -35,7 +42,7 @@ export default class VideoModal extends ImmutablePureComponent { } render () { - const { media, statusId, onClose } = this.props; + const { media, statusId, language, onClose } = this.props; const options = this.props.options || {}; return ( @@ -53,6 +60,7 @@ export default class VideoModal extends ImmutablePureComponent { autoFocus detailed alt={media.get('description')} + lang={language} /> </div> diff --git a/app/javascript/flavours/glitch/features/ui/components/zoomable_image.jsx b/app/javascript/flavours/glitch/features/ui/components/zoomable_image.jsx index 50b36b478..82ba6e692 100644 --- a/app/javascript/flavours/glitch/features/ui/components/zoomable_image.jsx +++ b/app/javascript/flavours/glitch/features/ui/components/zoomable_image.jsx @@ -96,6 +96,7 @@ class ZoomableImage extends React.PureComponent { static propTypes = { alt: PropTypes.string, + lang: PropTypes.string, src: PropTypes.string.isRequired, width: PropTypes.number, height: PropTypes.number, @@ -106,6 +107,7 @@ class ZoomableImage extends React.PureComponent { static defaultProps = { alt: '', + lang: '', width: null, height: null, }; @@ -403,7 +405,7 @@ class ZoomableImage extends React.PureComponent { }; render () { - const { alt, src, width, height, intl } = this.props; + const { alt, lang, src, width, height, intl } = this.props; const { scale, lockTranslate } = this.state; const overflow = scale === MIN_SCALE ? 'hidden' : 'scroll'; const zoomButtonShouldHide = this.state.navigationHidden || this.props.zoomButtonHidden || this.state.zoomMatrix.rate <= MIN_SCALE ? 'media-modal__zoom-button--hidden' : ''; @@ -431,6 +433,7 @@ class ZoomableImage extends React.PureComponent { ref={this.setImageRef} alt={alt} title={alt} + lang={lang} src={src} width={width} height={height} diff --git a/app/javascript/flavours/glitch/features/video/index.jsx b/app/javascript/flavours/glitch/features/video/index.jsx index cb923bcf7..9ab56b439 100644 --- a/app/javascript/flavours/glitch/features/video/index.jsx +++ b/app/javascript/flavours/glitch/features/video/index.jsx @@ -101,6 +101,7 @@ class Video extends React.PureComponent { frameRate: PropTypes.string, src: PropTypes.string.isRequired, alt: PropTypes.string, + lang: PropTypes.string, width: PropTypes.number, height: PropTypes.number, sensitive: PropTypes.bool, @@ -538,7 +539,7 @@ class Video extends React.PureComponent { } render () { - const { preview, src, inline, onOpenVideo, onCloseVideo, intl, alt, letterbox, fullwidth, detailed, sensitive, editable, blurhash, autoFocus } = this.props; + const { preview, src, inline, onOpenVideo, onCloseVideo, intl, alt, lang, letterbox, fullwidth, detailed, sensitive, editable, blurhash, autoFocus } = this.props; const { containerWidth, currentTime, duration, volume, buffer, dragging, paused, fullscreen, hovered, muted, revealed } = this.state; const progress = Math.min((currentTime / duration) * 100, 100); const playerStyle = {}; @@ -603,6 +604,7 @@ class Video extends React.PureComponent { tabIndex='0' aria-label={alt} title={alt} + lang={lang} width={width} height={height} volume={volume} |