Show zoom buttons only if zooming is enabled

Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
pull/21833/head
Šimon Brandner 2021-04-26 15:47:58 +02:00
parent 53e8b5e6af
commit 1fcad1a634
No known key found for this signature in database
GPG Key ID: 9760693FDD98A790
1 changed files with 23 additions and 11 deletions

View File

@ -316,11 +316,12 @@ export default class ImageView extends React.Component<IProps, IState> {
render() { render() {
const showEventMeta = !!this.props.mxEvent; const showEventMeta = !!this.props.mxEvent;
const zoomingDisabled = this.state.maxZoom === this.state.minZoom;
let cursor; let cursor;
if (this.state.moving) { if (this.state.moving) {
cursor= "grabbing"; cursor= "grabbing";
} else if (this.state.maxZoom === this.state.minZoom) { } else if (zoomingDisabled) {
cursor = "default"; cursor = "default";
} else if (this.state.zoom === this.state.minZoom) { } else if (this.state.zoom === this.state.minZoom) {
cursor = "zoom-in"; cursor = "zoom-in";
@ -412,6 +413,25 @@ export default class ImageView extends React.Component<IProps, IState> {
); );
} }
let zoomOutButton;
let zoomInButton;
if (!zoomingDisabled) {
zoomOutButton = (
<AccessibleTooltipButton
className="mx_ImageView_button mx_ImageView_button_zoomOut"
title={_t("Zoom out")}
onClick={this.onZoomOutClick}>
</AccessibleTooltipButton>
);
zoomInButton = (
<AccessibleTooltipButton
className="mx_ImageView_button mx_ImageView_button_zoomIn"
title={_t("Zoom in")}
onClick={ this.onZoomInClick }>
</AccessibleTooltipButton>
);
}
return ( return (
<FocusLock <FocusLock
returnFocus={true} returnFocus={true}
@ -435,16 +455,8 @@ export default class ImageView extends React.Component<IProps, IState> {
title={_t("Rotate Left")} title={_t("Rotate Left")}
onClick={ this.onRotateCounterClockwiseClick }> onClick={ this.onRotateCounterClockwiseClick }>
</AccessibleTooltipButton> </AccessibleTooltipButton>
<AccessibleTooltipButton {zoomOutButton}
className="mx_ImageView_button mx_ImageView_button_zoomOut" {zoomInButton}
title={_t("Zoom out")}
onClick={ this.onZoomOutClick }>
</AccessibleTooltipButton>
<AccessibleTooltipButton
className="mx_ImageView_button mx_ImageView_button_zoomIn"
title={_t("Zoom in")}
onClick={ this.onZoomInClick }>
</AccessibleTooltipButton>
<AccessibleTooltipButton <AccessibleTooltipButton
className="mx_ImageView_button mx_ImageView_button_download" className="mx_ImageView_button mx_ImageView_button_download"
title={_t("Download")} title={_t("Download")}