Unfloyded/Legamunt
0
0
Fork 0
Code Activity

Change media modals look in web UI (#15217)

Browse source 
- Change overlay background to match color of viewed image
- Add interactive reply/boost/favourite buttons to footer of modal
- Change ugly "View context" link to button among the action bar
This commit is contained in:
Eugen Rochko 2020-11-27 03:24:11 +01:00 • committed by GitHub
parent cb7bd8ee03
commit 1e89e2ed98
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
14 changed files with 339 additions and 146 deletions
Download patch file Download diff file Expand all files Collapse all files

18
app/javascript/mastodon/components/status.js
View file

@ -193,22 +193,24 @@ class Status extends ImmutablePureComponent {
}
handleOpenVideo = (media, options) => {
this.props.onOpenVideo(media, options);
this.props.onOpenVideo(this._properStatus().get('id'), media, options);
}
handleOpenMedia = (media, index) => {
this.props.onOpenMedia(this._properStatus().get('id'), media, index);
}
handleHotkeyOpenMedia = e => {
const { onOpenMedia, onOpenVideo } = this.props;
const status = this._properStatus();
const statusId = this._properStatus().get('id');
e.preventDefault();
if (status.get('media_attachments').size > 0) {
if (status.getIn(['media_attachments', 0, 'type']) === 'audio') {
// TODO: toggle play/paused?
} else if (status.getIn(['media_attachments', 0, 'type']) === 'video') {
onOpenVideo(status.getIn(['media_attachments', 0]), { startTime: 0 });
if (status.getIn(['media_attachments', 0, 'type']) === 'video') {
onOpenVideo(statusId, status.getIn(['media_attachments', 0]), { startTime: 0 });
} else {
onOpenMedia(status.get('media_attachments'), 0);
onOpenMedia(statusId, status.get('media_attachments'), 0);
}
}
}
@ -416,7 +418,7 @@ class Status extends ImmutablePureComponent {
media={status.get('media_attachments')}
sensitive={status.get('sensitive')}
height={110}
onOpenMedia={this.props.onOpenMedia}
onOpenMedia={this.handleOpenMedia}
cacheWidth={this.props.cacheMediaWidth}
defaultWidth={this.props.cachedMediaWidth}
visible={this.state.showMedia}