imterah/element-portable
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Merge pull request #5637 from williamkray/wreck/clean-thumbnail-changes

Browse source 
Improve URL preview formatting and image upload thumbnail size
This commit is contained in:
J. Ryan Stinnett 2021-02-17 11:37:37 +00:00 • committed by GitHub
commit 5c1b38a48c
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
4 changed files with 12 additions and 7 deletions
Download patch file Download diff file Expand all files Collapse all files

2
src/components/views/messages/MImageBody.js
View file

@ -362,7 +362,7 @@ export default class MImageBody extends React.Component {
}
// The maximum height of the thumbnail as it is rendered as an <img>
const maxHeight = Math.min(this.props.maxImageHeight || 600, infoHeight);
const maxHeight = Math.min(this.props.maxImageHeight || 240, infoHeight);
// The maximum width of the thumbnail, as dictated by its natural
// maximum height.
const maxWidth = infoWidth * maxHeight / infoHeight;

10
src/components/views/rooms/LinkPreviewWidget.js
View file

@ -107,7 +107,7 @@ export default class LinkPreviewWidget extends React.Component {
if (!SettingsStore.getValue("showImages")) {
image = null; // Don't render a button to show the image, just hide it outright
}
const imageMaxWidth = 100; const imageMaxHeight = 100;
const imageMaxWidth = 320; const imageMaxHeight = 240;
if (image && image.startsWith("mxc://")) {
image = MatrixClientPeg.get().mxcUrlToHttp(image, imageMaxWidth, imageMaxHeight);
}
@ -134,6 +134,10 @@ export default class LinkPreviewWidget extends React.Component {
const AccessibleButton = sdk.getComponent('elements.AccessibleButton');
return (
<div className="mx_LinkPreviewWidget">
<AccessibleButton className="mx_LinkPreviewWidget_cancel" onClick={this.props.onCancelClick} aria-label={_t("Close preview")}>
<img className="mx_filterFlipColor" alt="" role="presentation"
src={require("../../../../res/img/cancel.svg")} width="18" height="18" />
</AccessibleButton>
{ img }
<div className="mx_LinkPreviewWidget_caption">
<div className="mx_LinkPreviewWidget_title"><a href={this.props.link} target="_blank" rel="noreferrer noopener">{ p["og:title"] }</a></div>
@ -142,10 +146,6 @@ export default class LinkPreviewWidget extends React.Component {
{ description }
</div>
</div>
<AccessibleButton className="mx_LinkPreviewWidget_cancel" onClick={this.props.onCancelClick} aria-label={_t("Close preview")}>
<img className="mx_filterFlipColor" alt="" role="presentation"
src={require("../../../../res/img/cancel.svg")} width="18" height="18" />
</AccessibleButton>
</div>
);
}