Merge /conditions into the app as a Station tab

- New Station tab (top tabs, bottom nav, swipe order) carrying the old /conditions look:
  radar-ring hero, condition pill, wind compass, atmosphere/precip/solar cards, indoor
- Scoped sl-* styles and station-live.js; units follow the app's metric/imperial setting
- Empty/error states when no station is connected
- /conditions now 301-redirects to /?tab=station; removed conditions.html,
  /api/conditions/public and the old My Station drawer
- /api/ambient-config also returns the station name
- Dashboard and settings links updated; SW cache v8; manifest shortcut for Station
- Drops an indoor-temp block in applyStationOverlay that referenced an out-of-scope helper

Co-Authored-By: Claude Sonnet 5.5 <noreply@anthropic.com>
This commit is contained in:
Nate EmmertandClaude Sonnet 5.5 committed 2026-10-15 12:45:47 -04:00
1 parent 7dea2734ea
commit 1830fb2e2b
11 files changed
+361 -917

No files matched your search

+16 -64
View File
@@ -13,7 +13,11 @@
<meta name="apple-mobile-web-app-title" content="NeCloud Weather">
<meta name="mobile-web-app-capable" content="yes">
<link rel="stylesheet" href="https://unpkg.com/maplibre-gl@4.7.1/dist/maplibre-gl.css">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@700;800&family=Barlow:wght@400;500;600&display=swap" rel="stylesheet">
<link rel="stylesheet" href="style.css">
<link rel="stylesheet" href="station-live.css">
</head>
<body>
<div id="offline-banner" class="offline-banner hidden">No internet connection — showing cached data</div>
@@ -24,6 +28,7 @@
<h1>NeCloud Weather</h1>
<nav class="tabs">
<button class="tab active" data-tab="conditions">Conditions</button>
<button class="tab" data-tab="station">Station</button>
<button class="tab" data-tab="unified-map">Map</button>
<button class="tab" data-tab="alerts">Alerts<span class="alert-badge hidden" id="alert-badge-nav"></span></button>
<button class="tab" data-tab="learn">Learn</button>
@@ -31,7 +36,6 @@
</nav>
<span class="tagline">Open-Meteo · RainViewer</span>
<nav class="station-links">
<a href="/conditions" class="station-link">Station</a>
<a href="/dashboard" class="station-link">Dashboard</a>
</nav>
</header>
@@ -242,68 +246,6 @@
</div>
</details>
<!-- ── MY STATION (Ambient Weather) ── -->
<details class="details-drawer station-drawer" id="station-drawer" open>
<summary class="drawer-summary">
My Station
<span class="station-drawer-peek" id="station-drawer-peek"></span>
<span class="drawer-chevron">›</span>
</summary>
<div class="drawer-body" id="station-body">
<div class="station-loading" id="station-loading">Loading station data…</div>
<div id="station-content" class="hidden">
<div class="station-name-row">
<span class="station-name" id="station-name"></span>
<span class="station-updated" id="station-updated"></span>
</div>
<div class="card-group drawer-card-group">
<div class="stat-card">
<div class="stat-label">Outdoor Temp</div>
<div class="stat-val"><span id="st-temp">--</span>°<span id="st-temp-unit">F</span></div>
<div class="stat-sub" id="st-feels"></div>
</div>
<div class="stat-card">
<div class="stat-label">Humidity</div>
<div class="stat-val"><span id="st-hum">--</span><span class="stat-unit">%</span></div>
<div class="stat-sub" id="st-dew"></div>
</div>
<div class="stat-card">
<div class="stat-label">Wind</div>
<div class="stat-val"><span id="st-wind">--</span> <span class="stat-unit" id="st-wind-unit">mph</span></div>
<div class="stat-sub" id="st-wind-dir"></div>
</div>
<div class="stat-card">
<div class="stat-label">Gusts</div>
<div class="stat-val"><span id="st-gust">--</span> <span class="stat-unit" id="st-gust-unit">mph</span></div>
</div>
<div class="stat-card">
<div class="stat-label">Rain Today</div>
<div class="stat-val"><span id="st-rain-day">--</span> <span class="stat-unit" id="st-rain-unit">in</span></div>
<div class="stat-sub" id="st-rain-rate"></div>
</div>
<div class="stat-card">
<div class="stat-label">Pressure</div>
<div class="stat-val"><span id="st-pressure">--</span> <span class="stat-unit">inHg</span></div>
</div>
<div class="stat-card" id="st-uv-card">
<div class="stat-label">UV Index</div>
<div class="stat-val"><span id="st-uv">--</span></div>
</div>
<div class="stat-card" id="st-solar-card">
<div class="stat-label">Solar Rad.</div>
<div class="stat-val"><span id="st-solar">--</span> <span class="stat-unit">W/m²</span></div>
</div>
<div class="stat-card hidden" id="st-indoor-card">
<div class="stat-label">Indoor Temp</div>
<div class="stat-val"><span id="st-tempin">--</span>°<span id="st-tempin-unit">F</span></div>
<div class="stat-sub" id="st-humin"></div>
</div>
</div>
</div>
<div id="station-error" class="station-error hidden"></div>
</div>
</details>
<div class="footer-note">
Weather: <a href="https://open-meteo.com" target="_blank">Open-Meteo</a> ·
Radar: <a href="https://www.rainviewer.com" target="_blank">RainViewer</a> ·
@@ -313,6 +255,11 @@
</div>
<!-- ── TAB: UNIFIED MAP ── -->
<!-- ── TAB: STATION (live personal weather station) ── -->
<div id="tab-station" class="tab-panel hidden">
<div id="station-live" class="sl"></div>
</div>
<div id="tab-unified-map" class="tab-panel hidden">
<div class="unified-map-wrap">
<!-- Map Controls -->
@@ -492,7 +439,7 @@
<div class="settings-section-label">Station</div>
<div class="settings-nav-links">
<a href="/conditions" class="settings-nav-link">Live Conditions</a>
<a href="/?tab=station" class="settings-nav-link">Live Station</a>
<a href="/dashboard" class="settings-nav-link">Dashboard</a>
</div>
@@ -1336,6 +1283,10 @@
<span class="bottom-icon">⛅</span>
<span class="bottom-label">Now</span>
</button>
<button class="bottom-tab" data-tab="station" type="button">
<span class="bottom-icon">📡</span>
<span class="bottom-label">Station</span>
</button>
<button class="bottom-tab" data-tab="unified-map" type="button">
<span class="bottom-icon">🗺️</span>
<span class="bottom-label">Map</span>
@@ -1357,6 +1308,7 @@
<script src="https://unpkg.com/maplibre-gl@4.7.1/dist/maplibre-gl.js"></script>
<script src="app.js"></script>
<script src="station-live.js"></script>
<script>
if ('serviceWorker' in navigator) {
navigator.serviceWorker.register('/sw.js');