diff options
author | Christian Schmidt <github@chsc.dk> | 2023-08-03 15:41:51 +0200 |
---|---|---|
committer | GitHub <noreply@github.com> | 2023-08-03 15:41:51 +0200 |
commit | 8da99ffb0dcf5012179e4142799ff473910f5a66 (patch) | |
tree | 447800b4e111ef7392f0599c608bfa3ef07bf4ff /app | |
parent | ca19ea30d4325e30e016d5fe957e7de99adc72f0 (diff) |
Add alt text for preview card thumbnails (#26184)
Diffstat (limited to 'app')
-rw-r--r-- | app/javascript/mastodon/features/explore/components/story.jsx | 5 | ||||
-rw-r--r-- | app/javascript/mastodon/features/explore/links.jsx | 1 | ||||
-rw-r--r-- | app/javascript/mastodon/features/status/components/card.jsx | 3 | ||||
-rw-r--r-- | app/lib/link_details_extractor.rb | 5 | ||||
-rw-r--r-- | app/models/preview_card.rb | 1 | ||||
-rw-r--r-- | app/serializers/rest/preview_card_serializer.rb | 2 |
6 files changed, 13 insertions, 4 deletions
diff --git a/app/javascript/mastodon/features/explore/components/story.jsx b/app/javascript/mastodon/features/explore/components/story.jsx index 92eb41cff81..80dd5200fc7 100644 --- a/app/javascript/mastodon/features/explore/components/story.jsx +++ b/app/javascript/mastodon/features/explore/components/story.jsx @@ -22,6 +22,7 @@ export default class Story extends PureComponent { author: PropTypes.string, sharedTimes: PropTypes.number, thumbnail: PropTypes.string, + thumbnailDescription: PropTypes.string, blurhash: PropTypes.string, expanded: PropTypes.bool, }; @@ -33,7 +34,7 @@ export default class Story extends PureComponent { handleImageLoad = () => this.setState({ thumbnailLoaded: true }); render () { - const { expanded, url, title, lang, publisher, author, publishedAt, sharedTimes, thumbnail, blurhash } = this.props; + const { expanded, url, title, lang, publisher, author, publishedAt, sharedTimes, thumbnail, thumbnailDescription, blurhash } = this.props; const { thumbnailLoaded } = this.state; @@ -49,7 +50,7 @@ export default class Story extends PureComponent { {thumbnail ? ( <> <div className={classNames('story__thumbnail__preview', { 'story__thumbnail__preview--hidden': thumbnailLoaded })}><Blurhash hash={blurhash} /></div> - <img src={thumbnail} onLoad={this.handleImageLoad} alt='' role='presentation' /> + <img src={thumbnail} onLoad={this.handleImageLoad} alt={thumbnailDescription} title={thumbnailDescription} lang={lang} /> </> ) : <Skeleton />} </div> diff --git a/app/javascript/mastodon/features/explore/links.jsx b/app/javascript/mastodon/features/explore/links.jsx index 489ab6dd616..663aa6d80f5 100644 --- a/app/javascript/mastodon/features/explore/links.jsx +++ b/app/javascript/mastodon/features/explore/links.jsx @@ -67,6 +67,7 @@ class Links extends PureComponent { author={link.get('author_name')} sharedTimes={link.getIn(['history', 0, 'accounts']) * 1 + link.getIn(['history', 1, 'accounts']) * 1} thumbnail={link.get('image')} + thumbnailDescription={link.get('image_description')} blurhash={link.get('blurhash')} /> ))} diff --git a/app/javascript/mastodon/features/status/components/card.jsx b/app/javascript/mastodon/features/status/components/card.jsx index 6ac3c1d0f29..07fb1db9e2e 100644 --- a/app/javascript/mastodon/features/status/components/card.jsx +++ b/app/javascript/mastodon/features/status/components/card.jsx @@ -167,7 +167,8 @@ export default class Card extends PureComponent { /> ); - let thumbnail = <img src={card.get('image')} alt='' style={thumbnailStyle} onLoad={this.handleImageLoad} className='status-card__image-image' />; + const thumbnailDescription = card.get('image_description'); + const thumbnail = <img src={card.get('image')} alt={thumbnailDescription} title={thumbnailDescription} lang={language} style={thumbnailStyle} onLoad={this.handleImageLoad} className='status-card__image-image' />; let spoilerButton = ( <button type='button' onClick={this.handleReveal} className='spoiler-button__overlay'> diff --git a/app/lib/link_details_extractor.rb b/app/lib/link_details_extractor.rb index 4ee07acdc07..b95ec805190 100644 --- a/app/lib/link_details_extractor.rb +++ b/app/lib/link_details_extractor.rb @@ -113,6 +113,7 @@ class LinkDetailsExtractor title: title || '', description: description || '', image_remote_url: image, + image_description: image_alt || '', type: type, link_type: link_type, width: width || 0, @@ -168,6 +169,10 @@ class LinkDetailsExtractor valid_url_or_nil(opengraph_tag('og:image')) end + def image_alt + opengraph_tag('og:image:alt') + end + def canonical_url valid_url_or_nil(link_tag('canonical') || opengraph_tag('og:url'), same_origin_only: true) || @original_url.to_s end diff --git a/app/models/preview_card.rb b/app/models/preview_card.rb index d9ddd3ba0d1..3e2b5bf992f 100644 --- a/app/models/preview_card.rb +++ b/app/models/preview_card.rb @@ -31,6 +31,7 @@ # trendable :boolean # link_type :integer # published_at :datetime +# image_description :string default(""), not null # class PreviewCard < ApplicationRecord diff --git a/app/serializers/rest/preview_card_serializer.rb b/app/serializers/rest/preview_card_serializer.rb index cf700ff24e1..3e1c4bde3c4 100644 --- a/app/serializers/rest/preview_card_serializer.rb +++ b/app/serializers/rest/preview_card_serializer.rb @@ -6,7 +6,7 @@ class REST::PreviewCardSerializer < ActiveModel::Serializer attributes :url, :title, :description, :language, :type, :author_name, :author_url, :provider_name, :provider_url, :html, :width, :height, - :image, :embed_url, :blurhash, :published_at + :image, :image_description, :embed_url, :blurhash, :published_at def image object.image? ? full_asset_url(object.image.url(:original)) : nil |