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

Add zoom buttons to the location view (#7482)

Browse source
This commit is contained in:
Andy Balaam 2022-01-10 09:30:24 +00:00 • committed by GitHub
parent d00483be3e
commit 9cb8ce7c20
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
6 changed files with 102 additions and 8 deletions
Download patch file Download diff file Expand all files Collapse all files

15
src/components/views/location/LocationViewDialog.tsx
View file

@ -33,11 +33,13 @@ interface IState {
@replaceableComponent("views.location.LocationViewDialog")
export default class LocationViewDialog extends React.Component<IProps, IState> {
private coords: GeolocationCoordinates;
private map?: maplibregl.Map;
constructor(props: IProps) {
super(props);
this.coords = parseGeoUri(locationEventGeoUri(this.props.mxEvent));
this.map = null;
this.state = {
error: undefined,
};
@ -48,7 +50,7 @@ export default class LocationViewDialog extends React.Component<IProps, IState>
return;
}
createMap(
this.map = createMap(
this.coords,
true,
this.getBodyId(),
@ -65,6 +67,14 @@ export default class LocationViewDialog extends React.Component<IProps, IState>
return `mx_MLocationViewDialog_marker_${this.props.mxEvent.getId()}`;
};
private onZoomIn = () => {
this.map?.zoomIn();
};
private onZoomOut = () => {
this.map?.zoomOut();
};
render() {
return (
<BaseDialog
@ -77,6 +87,9 @@ export default class LocationViewDialog extends React.Component<IProps, IState>
bodyId={this.getBodyId()}
markerId={this.getMarkerId()}
error={this.state.error}
zoomButtons={true}
onZoomIn={this.onZoomIn}
onZoomOut={this.onZoomOut}
/>
</BaseDialog>
);