mirror of https://github.com/vector-im/riot-web
Show zoom buttons only if zooming is enabled
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>pull/21833/head
parent
9a04f029aa
commit
e820d60cd4
|
@ -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")}
|
||||||
|
|
Loading…
Reference in New Issue