From 3fd94626b6946ddb05b1b86551260a8c08494b99 Mon Sep 17 00:00:00 2001
From: ztimson <zaktimson@gmail.com>
Date: Wed, 24 Jun 2026 01:21:21 -0400
Subject: [PATCH] Client fixes

---
 client/src/components/CurrentWeather.vue |  6 +++---
 client/src/components/MapView.vue        | 19 ++++---------------
 client/src/components/MetricCard.vue     |  1 +
 client/src/services/api.ts               |  1 +
 server/influx.mjs                        |  2 +-
 server/openweather.mjs                   |  6 ------
 6 files changed, 10 insertions(+), 25 deletions(-)

diff --git a/client/src/components/CurrentWeather.vue b/client/src/components/CurrentWeather.vue
index fab2a33..3efb39a 100644
--- a/client/src/components/CurrentWeather.vue
+++ b/client/src/components/CurrentWeather.vue
@@ -60,9 +60,9 @@ onMounted(async () => {
 }
 
 .today-label {
-	font-size: 16px;
+	font-size: 12px;
 	font-weight: 600;
-	color: var(--text);
+	color: var(--text-muted);
 }
 
 .hi-lo {
@@ -125,8 +125,8 @@ onMounted(async () => {
 	<div class="today-card">
 		<div class="flex-r align-items-center justify-between px-3">
 			<div class="flex-c justify-center align-items-center">
+				<img v-if="data.icon" :src="'https://openweathermap.org/img/wn/' + data.icon + '@2x.png'" class="today-icon" alt="weather" />
 				<div class="today-label">{{ data.label }}</div>
-				<img v-if="data.icon" :src="BASE + data.icon" class="today-icon" alt="weather" />
 			</div>
 			<div class="flex-r align-items-center gap-2">
 				<div class="fs-6">
diff --git a/client/src/components/MapView.vue b/client/src/components/MapView.vue
index d3e25cb..f8e049e 100644
--- a/client/src/components/MapView.vue
+++ b/client/src/components/MapView.vue
@@ -1,5 +1,6 @@
 <script setup lang="ts">
 import { AirTrafficLayer } from '@/services/airtraffic.ts'
+import {api} from '@/services/api.ts';
 import { computed, onMounted, onUnmounted, ref, watch } from 'vue'
 import Map from 'ol/Map'
 import View from 'ol/View'
@@ -176,9 +177,10 @@ function buildStationLayer(lat: number, lon: number, dark: boolean): VectorLayer
 
 onMounted(async () => {
 	await fetchRadarFrames()
+	const position = await api.position();
 
-	const lat = (current.value.latitude as number) || 0
-	const lon = (current.value.longitude as number) || 0
+	const lat = position?.latitude || 0
+	const lon = position?.longitude || 0
 
 	stationLayer = buildStationLayer(lat, lon, props.dark)
 
@@ -226,19 +228,6 @@ watch(() => props.dark, dark => {
 	stationLayer = buildStationLayer(lat, lon, dark)
 	map.addLayer(stationLayer)
 })
-
-let positioned = false
-watch(() => current.value, () => {
-	const lat = (current.value.latitude as number) || 0
-	const lon = (current.value.longitude as number) || 0
-	if (!positioned) {
-		positioned = true
-		map.getView().animate({ center: fromLonLat([lon, lat]), duration: 500 })
-		map.removeLayer(stationLayer)
-		stationLayer = buildStationLayer(lat, lon, props.dark)
-		map.addLayer(stationLayer)
-	}
-})
 </script>
 
 <style scoped lang="scss">
diff --git a/client/src/components/MetricCard.vue b/client/src/components/MetricCard.vue
index 8b52692..48b9bc3 100644
--- a/client/src/components/MetricCard.vue
+++ b/client/src/components/MetricCard.vue
@@ -27,6 +27,7 @@ const label = computed(() => props.data[`${props.metricKey.replace(/_[^_]+$/, ''
   cursor: pointer;
   transition: background 0.15s, transform 0.1s;
   user-select: none;
+  overflow: hidden;
 
   &:hover   { background: var(--hover); }
   &:active  { transform: scale(0.97); }
diff --git a/client/src/services/api.ts b/client/src/services/api.ts
index 50eb3e4..eac251d 100644
--- a/client/src/services/api.ts
+++ b/client/src/services/api.ts
@@ -13,6 +13,7 @@ async function get<T>(path: string, params: Record<string, string> = {}): Promis
 }
 
 export const api = {
+  position: (fields?: string) => get<{latitude: number, longitude: number, altitude: number}>('/api/position', fields ? { fields } : {}),
   current:  (fields?: string)                                     => get<DataRow>('/api/current', fields ? { fields } : {}),
   hourly:   (start?: string, end?: string, fields?: string)      => get<DataRow[]>('/api/hourly', { ...(start ? { start } : {}), ...(end ? { end } : {}), ...(fields ? { fields } : {}) }),
   daily:    (start?: string, end?: string, fields?: string)      => get<DataRow[]>('/api/daily',  { ...(start ? { start } : {}), ...(end ? { end } : {}), ...(fields ? { fields } : {}) }),
diff --git a/server/influx.mjs b/server/influx.mjs
index e33a998..9659952 100644
--- a/server/influx.mjs
+++ b/server/influx.mjs
@@ -144,7 +144,7 @@ export async function getCoords() {
   `;
 	const rows = await query(flux);
 	if(rows.length && rows[0].latitude && rows[0].longitude) {
-		return {lat: rows[0].latitude, lon: rows[0].longitude, alt: rows[0].altitude || c.ALTITUDE};
+		return {latitude: rows[0].latitude, longitude: rows[0].longitude, altitude: rows[0].altitude || c.ALTITUDE};
 	}
 	return {latitude: c.LATITUDE, longitude: c.LONGITUDE, altitude: c.ALTITUDE};
 }
diff --git a/server/openweather.mjs b/server/openweather.mjs
index 8caf5c8..8ee5a88 100644
--- a/server/openweather.mjs
+++ b/server/openweather.mjs
@@ -31,12 +31,6 @@ export const WMO = {
   99: { label: 'Thunderstorm w/ Hail',     icon: '11d' },
 }
 
-export function weatherFromCode(code, isDay = true) {
-  const w    = WMO[code] ?? { label: 'Unknown', icon: '01d' }
-  const icon = isDay ? w.icon : w.icon.replace('d', 'n')
-  return { weather_code: code, weather_label: w.label, weather_icon: `/icons/${icon}.png` }
-}
-
 export async function downloadIcons() {
   if (!existsSync(DIR)) mkdirSync(DIR, { recursive: true })
   const icons = new Set(Object.values(WMO).map(w => [w.icon, w.icon.replace('d','n')]).flat())