diff --git a/desktop/src/app/mount/mount.component.html b/desktop/src/app/mount/mount.component.html index 8504245dc..a163ad837 100644 --- a/desktop/src/app/mount/mount.component.html +++ b/desktop/src/app/mount/mount.component.html @@ -24,6 +24,11 @@ (action)="showRemoteControlDialog()" icon="mdi mdi-remote-tv" tooltip="Remote Control" /> + + +
+
+ @if (site.showDialog) { + + } +
+
+ + + + + () @@ -337,6 +338,12 @@ export class MountComponent implements AfterContentInit, OnDestroy, Tickable { this.remoteControl.showDialog = true } + protected showSiteDialog() { + const { longitude, latitude, elevation } = this.mount + this.site.location = { ...this.site.location, longitude, latitude, elevation } + this.site.showDialog = true + } + protected showTimeDialog() { const now = new Date() this.time.offsetInMinutes = this.mount.offsetInMinutes @@ -353,6 +360,10 @@ export class MountComponent implements AfterContentInit, OnDestroy, Tickable { return this.api.mountTime(this.mount, this.time.dateTime, this.time.offsetInMinutes) } + protected siteApply() { + return this.api.mountCoordinates(this.mount, this.site.location) + } + protected async startRemoteControl() { await this.api.mountRemoteControlStart(this.mount, this.remoteControl.protocol, this.remoteControl.host, this.remoteControl.port) this.remoteControl.controls = await this.api.mountRemoteControlList(this.mount) diff --git a/desktop/src/shared/components/location.component.ts b/desktop/src/shared/components/location.component.ts index 59ed85b7a..99002dead 100644 --- a/desktop/src/shared/components/location.component.ts +++ b/desktop/src/shared/components/location.component.ts @@ -8,40 +8,42 @@ import { MapComponent } from './map.component' @let mLocation = location();
-
- -
-
- -
-
+ @if (showNameAndOffset()) { +
+ +
+
+ +
+ } +
-
+
-
+
() + readonly showNameAndOffset = input(true) readonly update = output() readonly map = viewChild.required('map') ngAfterViewInit() { + this.refreshMap() + } + + refreshMap() { this.map().refresh() } diff --git a/desktop/src/shared/components/map.component.ts b/desktop/src/shared/components/map.component.ts index e22396888..3d9615271 100644 --- a/desktop/src/shared/components/map.component.ts +++ b/desktop/src/shared/components/map.component.ts @@ -1,4 +1,4 @@ -import { AfterViewInit, Component, ElementRef, OnChanges, ViewEncapsulation, model, viewChild } from '@angular/core' +import { AfterViewInit, Component, ElementRef, OnChanges, OnDestroy, ViewEncapsulation, model, viewChild } from '@angular/core' import * as L from 'leaflet' @Component({ @@ -17,11 +17,12 @@ import * as L from 'leaflet' `, encapsulation: ViewEncapsulation.None, }) -export class MapComponent implements AfterViewInit, OnChanges { +export class MapComponent implements AfterViewInit, OnDestroy, OnChanges { readonly latitude = model(0) readonly longitude = model(0) private readonly mapRef = viewChild.required>('map') + private resizeObserver?: ResizeObserver private map?: L.Map private marker?: L.Marker @@ -36,7 +37,9 @@ export class MapComponent implements AfterViewInit, OnChanges { }) ngAfterViewInit() { - this.map = L.map(this.mapRef().nativeElement, { + const hostElement = this.mapRef().nativeElement + + this.map = L.map(hostElement, { center: { lat: this.latitude(), lng: this.longitude() }, zoom: 5, doubleClickZoom: false, @@ -57,6 +60,17 @@ export class MapComponent implements AfterViewInit, OnChanges { }) tiles.addTo(this.map) + + this.resizeObserver = new ResizeObserver(() => { + this.refresh() + }) + + this.resizeObserver.observe(hostElement) + } + + ngOnDestroy() { + this.resizeObserver?.disconnect() + this.resizeObserver = undefined } ngOnChanges() { diff --git a/desktop/src/shared/services/api.service.ts b/desktop/src/shared/services/api.service.ts index 77ab337e6..939426c4a 100644 --- a/desktop/src/shared/services/api.service.ts +++ b/desktop/src/shared/services/api.service.ts @@ -1,7 +1,7 @@ import { Injectable, inject } from '@angular/core' import { DARVStart, TPPAStart } from '../types/alignment.types' import { extractDate, extractDateTime } from '../types/angular.types' -import { Angle, BodyPosition, CloseApproach, ComputedLocation, DeepSkyObject, EarthSeasonDateTime, Location, MinorPlanet, MoonPhases, Satellite, SatelliteGroupType, SkyObjectSearchFilter, SkyObjectType, Twilight } from '../types/atlas.types' +import { Angle, BodyPosition, CloseApproach, ComputedLocation, DeepSkyObject, EarthSeasonDateTime, GeographicCoordinate, Location, MinorPlanet, MoonPhases, Satellite, SatelliteGroupType, SkyObjectSearchFilter, SkyObjectType, Twilight } from '../types/atlas.types' import { AutoFocusRequest } from '../types/autofocus.type' import { CalibrationFrame } from '../types/calibration.types' import { Camera, CameraStartCapture } from '../types/camera.types' @@ -186,6 +186,11 @@ export class ApiService { return this.http.put(`mounts/${mount.id}/datetime?${query}`) } + mountCoordinates(mount: Mount, coordinate: GeographicCoordinate) { + const query = this.http.query({ ...coordinate }) + return this.http.put(`mounts/${mount.id}/coordinates?${query}`) + } + mountRemoteControlStart(mount: Mount, protocol: MountRemoteControlProtocol, host: string, port: number) { const query = this.http.query({ protocol, host, port }) return this.http.put(`mounts/${mount.id}/remote-control/start?${query}`) diff --git a/desktop/src/shared/services/browser-window.service.ts b/desktop/src/shared/services/browser-window.service.ts index cf6b0cdcb..4e966ba0a 100644 --- a/desktop/src/shared/services/browser-window.service.ts +++ b/desktop/src/shared/services/browser-window.service.ts @@ -133,7 +133,7 @@ export class BrowserWindowService { } openSettings(preference: WindowPreference = {}) { - Object.assign(preference, { icon: 'settings', width: 320, height: 397, minHeight: 350 }) + Object.assign(preference, { icon: 'settings', width: 320, height: 355, minHeight: 350 }) return this.openWindow({ preference, id: 'settings', path: 'settings' }) } diff --git a/desktop/src/shared/types/mount.types.ts b/desktop/src/shared/types/mount.types.ts index bad049f2f..f3efc3bbb 100644 --- a/desktop/src/shared/types/mount.types.ts +++ b/desktop/src/shared/types/mount.types.ts @@ -1,5 +1,5 @@ import type { DropdownItem } from '../components/dropdown.component' -import type { Angle, EquatorialCoordinate, GeographicCoordinate } from './atlas.types' +import { DEFAULT_LOCATION, type Angle, type EquatorialCoordinate, type Location } from './atlas.types' import type { Device } from './device.types' import type { GPS } from './gps.types' import type { GuideOutput } from './guider.types' @@ -67,8 +67,9 @@ export interface MountRemoteControlDialog { controls: MountRemoteControl[] } -export interface MountCoordinateDialog extends GeographicCoordinate { +export interface MountSiteDialog { showDialog: boolean + location: Location } export interface MountTimeDialog { @@ -133,6 +134,11 @@ export const DEFAULT_MOUNT_TIME_DIALOG: MountTimeDialog = { offsetInMinutes: 0, } +export const DEFAULT_MOUNT_SITE_DIALOG: MountSiteDialog = { + showDialog: false, + location: DEFAULT_LOCATION, +} + export const DEFAULT_MOUNT_PREFERENCE: MountPreference = { targetCoordinateType: 'JNOW', targetRightAscension: '00h00m00s',