cybrespace
/
mastodon
4
3
Fork 3
Code Issues 7 Pull Requests Releases Activity

Fix audio modals not using blurhash and poster (#14199)

This commit is contained in:
Eugen Rochko 2020-07-02 16:27:35 +02:00 committed by GitHub
parent 7f1143a40d
commit 162adf61f2
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 9 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
app/javascript/mastodon/features/ui/components/audio_modal.js
View File

@ -59,8 +59,9 @@ export default class AudioModal extends ImmutablePureComponent {
src={media.get('url')} src={media.get('url')}
alt={media.get('description')} alt={media.get('description')}
duration={media.getIn(['meta', 'original', 'duration'], 0)} duration={media.getIn(['meta', 'original', 'duration'], 0)}
height={135} height={150}
preload poster={media.get('preview_url') || status.getIn(['account', 'avatar_static'])}
blurhash={media.get('blurhash')}
/> />
</div> </div>

8
app/javascript/mastodon/features/ui/components/focal_point_modal.js
View File

@ -17,6 +17,7 @@ import CharacterCounter from 'mastodon/features/compose/components/character_cou
import { length } from 'stringz'; import { length } from 'stringz';
import { Tesseract as fetchTesseract } from 'mastodon/features/ui/util/async-components'; import { Tesseract as fetchTesseract } from 'mastodon/features/ui/util/async-components';
import GIFV from 'mastodon/components/gifv'; import GIFV from 'mastodon/components/gifv';
import { me } from 'mastodon/initial_state';
const messages = defineMessages({ const messages = defineMessages({
close: { id: 'lightbox.close', defaultMessage: 'Close' }, close: { id: 'lightbox.close', defaultMessage: 'Close' },
@ -26,6 +27,7 @@ const messages = defineMessages({
const mapStateToProps = (state, { id }) => ({ const mapStateToProps = (state, { id }) => ({
media: state.getIn(['compose', 'media_attachments']).find(item => item.get('id') === id), media: state.getIn(['compose', 'media_attachments']).find(item => item.get('id') === id),
account: state.getIn(['accounts', me]),
}); });
const mapDispatchToProps = (dispatch, { id }) => ({ const mapDispatchToProps = (dispatch, { id }) => ({
@ -78,6 +80,7 @@ class FocalPointModal extends ImmutablePureComponent {
static propTypes = { static propTypes = {
media: ImmutablePropTypes.map.isRequired, media: ImmutablePropTypes.map.isRequired,
account: ImmutablePropTypes.map.isRequired,
onClose: PropTypes.func.isRequired, onClose: PropTypes.func.isRequired,
intl: PropTypes.object.isRequired, intl: PropTypes.object.isRequired,
}; };
@ -233,7 +236,7 @@ class FocalPointModal extends ImmutablePureComponent {
} }
render () { render () {
const { media, intl, onClose } = this.props; const { media, intl, account, onClose } = this.props;
const { x, y, dragging, description, dirty, detecting, progress } = this.state; const { x, y, dragging, description, dirty, detecting, progress } = this.state;
const width = media.getIn(['meta', 'original', 'width']) || null; const width = media.getIn(['meta', 'original', 'width']) || null;
@ -325,7 +328,8 @@ class FocalPointModal extends ImmutablePureComponent {
src={media.get('url')} src={media.get('url')}
duration={media.getIn(['meta', 'original', 'duration'], 0)} duration={media.getIn(['meta', 'original', 'duration'], 0)}
height={150} height={150}
preload poster={media.get('preview_url') || account.get('avatar_static')}
blurhash={media.get('blurhash')}
editable editable
/> />
)} )}