Sat updates

client/src/components/MapView.vue

@@ -3,6 +3,7 @@ import { AirTrafficLayer } from '@/services/adsb.ts'
 import { AISLayer } from '@/services/ais.ts'
 import { api } from '@/services/api.ts'
 import { RangeLayer } from '@/services/range.ts'
+import {SatsLayer} from '@/services/sats.ts';
 import VectorTileLayer from 'ol/layer/VectorTile'
 import { onMounted, onUnmounted, ref, watch } from 'vue'
 import Map from 'ol/Map'
@@ -24,7 +25,6 @@ const current = ref({ latitude: 0, longitude: 0 })
 const props = defineProps<{ dark: boolean }>()
 const mapEl = ref<HTMLDivElement>()
 const showOverlays = ref(false)
-const atActive = ref(true)
 
 const NM = 1852
 
@@ -38,7 +38,7 @@ const OVERLAYS = [
 	{ id: 'wind', label: 'Wind', icon: '💨' },
 ]
 
-const activeOverlays = ref<Set<string>>(new Set(['traffic', 'rain']))
+const activeOverlays = ref<Set<string>>(new Set(['traffic', 'sats', 'rain']))
 const overlayLayers: { [key: string]: any } = {}
 
 let map: Map
@@ -47,6 +47,7 @@ let radarInterval: ReturnType<typeof setInterval>
 let airTraffic: AirTrafficLayer
 let aisLayer: AISLayer
 let range: RangeLayer
+let sats: SatsLayer
 
 function buildWindSrc(lat: number, lon: number, zoom: number) {
 	return `https://embed.windy.com/embed2.html?lat=${lat.toFixed(4)}&lon=${lon.toFixed(4)}&detailLat=${lat.toFixed(4)}&detailLon=${lon.toFixed(4)}&zoom=${Math.round(zoom)}&level=surface&overlay=wind&product=ecmwf&menu=&message=&marker=&calendar=now&pressure=&type=map&location=coordinates&detail=&metricWind=kt&metricTemp=%C2%B0C&radarRange=-1`
@@ -123,9 +124,15 @@ function toggleOverlay(id: string) {
 			airTraffic.show()
 			range.show()
 		}
-	}
-
-	if (id === 'wind') {
+	} else if (id === 'sats') {
+		if (activeOverlays.value.has('sats')) {
+			activeOverlays.value.delete('sats')
+			sats.hide()
+		} else {
+			activeOverlays.value.add('sats')
+			sats.show()
+		}
+	} else if (id === 'wind') {
 		if (activeOverlays.value.has('wind')) {
 			activeOverlays.value.delete('wind')
 			hideWindOverlay()
@@ -133,10 +140,7 @@ function toggleOverlay(id: string) {
 			activeOverlays.value.add('wind')
 			showWindOverlay()
 		}
-		return
-	}
-
-	if (id === 'rain') {
+	} else if (id === 'rain') {
 		if (activeOverlays.value.has('rain')) {
 			activeOverlays.value.delete('rain')
 			if (overlayLayers['rain']) { map.removeLayer(overlayLayers['rain']); delete overlayLayers['rain'] }
@@ -144,7 +148,6 @@ function toggleOverlay(id: string) {
 			activeOverlays.value.add('rain')
 			refreshRain()
 		}
-		return
 	}
 }
 
@@ -202,6 +205,8 @@ onMounted(async () => {
 	aisLayer.show()
 	airTraffic = new AirTrafficLayer(map)
 	airTraffic.show()
+	sats = new SatsLayer(map)
+	sats.show();
 	range = new RangeLayer(map)
 	range.show()