diff --git a/static/js/map-utils.js b/static/js/map-utils.js index d781abe..cca37a5 100644 --- a/static/js/map-utils.js +++ b/static/js/map-utils.js @@ -231,7 +231,7 @@ const MapUtils = { const meters = dist * metersPerUnit; L.circle(center, { radius: meters, - color: '#4aa3ff', + color: getComputedStyle(document.documentElement).getPropertyValue('--accent-cyan').trim() || '#4aa3ff', fillColor: 'transparent', fillOpacity: 0, weight: 1, @@ -265,11 +265,11 @@ const MapUtils = { const icon = L.divIcon({ className: 'map-reticle', html: ` - - - - - + + + + + `, iconSize: [28, 28], iconAnchor: [14, 14], diff --git a/static/js/modes/drone.js b/static/js/modes/drone.js index ea0ccc0..3eabc3a 100644 --- a/static/js/modes/drone.js +++ b/static/js/modes/drone.js @@ -137,7 +137,7 @@ var DroneMode = (function () { _trails[contact.id].setLatLngs(trailPoints); } else if (trailPoints.length > 1) { _trails[contact.id] = L.polyline(trailPoints, { - color: contact.risk_level === 'high' ? '#ff4444' : '#00ccff', + color: contact.risk_level === 'high' ? '#ff4444' : (getComputedStyle(document.documentElement).getPropertyValue('--accent-cyan').trim() || '#00ccff'), weight: 1.5, opacity: 0.6, }).addTo(_map); diff --git a/static/js/modes/space-weather.js b/static/js/modes/space-weather.js index 6a7554b..69963fe 100644 --- a/static/js/modes/space-weather.js +++ b/static/js/modes/space-weather.js @@ -16,13 +16,13 @@ const SpaceWeather = (function () { let _xrayChart = null; // Current image selections - let _solarImageKey = 'sdo_193'; - let _drapFreq = 'drap_global'; - const SOLAR_IMAGE_FALLBACKS = { - sdo_193: 'https://sdo.gsfc.nasa.gov/assets/img/latest/latest_512_0193.jpg', - sdo_304: 'https://sdo.gsfc.nasa.gov/assets/img/latest/latest_512_0304.jpg', - sdo_magnetogram: 'https://sdo.gsfc.nasa.gov/assets/img/latest/latest_512_HMIBC.jpg', - }; + let _solarImageKey = 'sdo_193'; + let _drapFreq = 'drap_global'; + const SOLAR_IMAGE_FALLBACKS = { + sdo_193: 'https://sdo.gsfc.nasa.gov/assets/img/latest/latest_512_0193.jpg', + sdo_304: 'https://sdo.gsfc.nasa.gov/assets/img/latest/latest_512_0304.jpg', + sdo_magnetogram: 'https://sdo.gsfc.nasa.gov/assets/img/latest/latest_512_HMIBC.jpg', + }; /** Stable cache-bust key that rotates every 5 minutes (matches backend max-age). */ function _cacheBust() { @@ -53,35 +53,35 @@ const SpaceWeather = (function () { _fetchData(); } - function selectSolarImage(key) { - _solarImageKey = key; - _updateSolarImageTabs(); - const frame = document.getElementById('swSolarImageFrame'); - if (frame) { - frame.innerHTML = '
Loading
'; - _loadImageWithFallback( - frame, - ['/space-weather/image/' + key + '?' + _cacheBust(), _directImageUrlForKey(key)], - key, - '
NASA SDO image is temporarily unavailable
' - ); - } - } + function selectSolarImage(key) { + _solarImageKey = key; + _updateSolarImageTabs(); + const frame = document.getElementById('swSolarImageFrame'); + if (frame) { + frame.innerHTML = '
Loading
'; + _loadImageWithFallback( + frame, + ['/space-weather/image/' + key + '?' + _cacheBust(), _directImageUrlForKey(key)], + key, + '
NASA SDO image is temporarily unavailable
' + ); + } + } - function selectDrapFreq(key) { - _drapFreq = key; - _updateDrapTabs(); - const frame = document.getElementById('swDrapImageFrame'); - if (frame) { - frame.innerHTML = '
Loading
'; - _loadImageWithFallback( - frame, - ['/space-weather/image/' + key + '?' + _cacheBust()], - key, - '
Failed to load image
' - ); - } - } + function selectDrapFreq(key) { + _drapFreq = key; + _updateDrapTabs(); + const frame = document.getElementById('swDrapImageFrame'); + if (frame) { + frame.innerHTML = '
Loading
'; + _loadImageWithFallback( + frame, + ['/space-weather/image/' + key + '?' + _cacheBust()], + key, + '
Failed to load image
' + ); + } + } function toggleAutoRefresh() { const cb = document.getElementById('swAutoRefresh'); @@ -101,41 +101,41 @@ const SpaceWeather = (function () { } } - function _stopAutoRefresh() { - if (_pollTimer) { clearInterval(_pollTimer); _pollTimer = null; } - } - - function _directImageUrlForKey(key) { - const base = SOLAR_IMAGE_FALLBACKS[key]; - if (!base) return null; - return base + '?' + _cacheBust(); - } - - function _loadImageWithFallback(frame, urls, alt, failureHtml) { - const candidates = (urls || []).filter(Boolean); - if (!frame || candidates.length === 0) { - if (frame) frame.innerHTML = failureHtml; - return; - } - - let index = 0; - const img = new Image(); - img.alt = alt; - img.referrerPolicy = 'no-referrer'; - img.onload = function () { - frame.innerHTML = ''; - frame.appendChild(img); - }; - img.onerror = function () { - index += 1; - if (index < candidates.length) { - img.src = candidates[index]; - return; - } - frame.innerHTML = failureHtml; - }; - img.src = candidates[index]; - } + function _stopAutoRefresh() { + if (_pollTimer) { clearInterval(_pollTimer); _pollTimer = null; } + } + + function _directImageUrlForKey(key) { + const base = SOLAR_IMAGE_FALLBACKS[key]; + if (!base) return null; + return base + '?' + _cacheBust(); + } + + function _loadImageWithFallback(frame, urls, alt, failureHtml) { + const candidates = (urls || []).filter(Boolean); + if (!frame || candidates.length === 0) { + if (frame) frame.innerHTML = failureHtml; + return; + } + + let index = 0; + const img = new Image(); + img.alt = alt; + img.referrerPolicy = 'no-referrer'; + img.onload = function () { + frame.innerHTML = ''; + frame.appendChild(img); + }; + img.onerror = function () { + index += 1; + if (index < candidates.length) { + img.src = candidates[index]; + return; + } + frame.innerHTML = failureHtml; + }; + img.src = candidates[index]; + } function _fetchData() { fetch('/space-weather/data') @@ -387,6 +387,7 @@ const SpaceWeather = (function () { } if (_windChart) { _windChart.destroy(); _windChart = null; } + const _accentCyan = getComputedStyle(document.documentElement).getPropertyValue('--accent-cyan').trim() || '#00ccff'; _windChart = new Chart(canvas, { type: 'line', data: { @@ -395,8 +396,8 @@ const SpaceWeather = (function () { { label: 'Speed (km/s)', data: speedData, - borderColor: '#00ccff', - backgroundColor: '#00ccff22', + borderColor: _accentCyan, + backgroundColor: _accentCyan + '22', borderWidth: 1.5, pointRadius: 0, fill: true, @@ -423,7 +424,7 @@ const SpaceWeather = (function () { }, scales: { x: { display: true, ticks: { color: '#555', font: { size: 9 }, maxTicksLimit: 8 }, grid: { color: '#ffffff08' } }, - y: { display: true, position: 'left', ticks: { color: '#00ccff', font: { size: 9 } }, grid: { color: '#ffffff08' }, title: { display: false } }, + y: { display: true, position: 'left', ticks: { color: _accentCyan, font: { size: 9 } }, grid: { color: '#ffffff08' }, title: { display: false } }, y1: { display: true, position: 'right', ticks: { color: '#ff8800', font: { size: 9 } }, grid: { drawOnChartArea: false } } }, interaction: { mode: 'index', intersect: false } diff --git a/static/js/modes/weather-satellite.js b/static/js/modes/weather-satellite.js index c450bce..71afc87 100644 --- a/static/js/modes/weather-satellite.js +++ b/static/js/modes/weather-satellite.js @@ -982,7 +982,7 @@ const WeatherSat = (function() { const trajectory = pass?.trajectory; if (!trajectory || trajectory.length === 0) return; - const color = pass.mode === 'LRPT' ? '#00ff88' : '#00d4ff'; + const color = pass.mode === 'LRPT' ? '#00ff88' : (getComputedStyle(document.documentElement).getPropertyValue('--accent-cyan').trim() || '#00d4ff'); ctx.beginPath(); ctx.strokeStyle = color;