eric/WeatherStar4000
1
0
Fork 0
mirror of https://github.com/netbymatt/ws4kp.git synced 2026-04-14 07:39:29 -07:00
Code Issues Packages Projects Releases Wiki Activity

regional map enhanced #188 #193 #196

Browse Source
This commit is contained in:
Matt Walsh
2026-04-06 00:35:24 -05:00
parent b2a424a64f
commit 5fffc495ae
3 changed files with 29 additions and 9 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
server/scripts/modules/regionalforecast-utils.mjs
View File

@@ -209,7 +209,7 @@ const getMinMaxLatitudeLongitudeHI = (X, Y, OffsetX, OffsetY) => {
}; };
}; };
const getXYForCity = (City, MaxLatitude, MinLongitude, state) => { const getXYForCity = (City, MaxLatitude, MinLongitude, state, maxX = 580) => {
if (state === 'AK') getXYForCityAK(City, MaxLatitude, MinLongitude); if (state === 'AK') getXYForCityAK(City, MaxLatitude, MinLongitude);
if (state === 'HI') getXYForCityHI(City, MaxLatitude, MinLongitude); if (state === 'HI') getXYForCityHI(City, MaxLatitude, MinLongitude);
let x = (City.lon - MinLongitude) * 57; let x = (City.lon - MinLongitude) * 57;
@@ -219,7 +219,7 @@ const getXYForCity = (City, MaxLatitude, MinLongitude, state) => {
if (y > 282) y = 282; if (y > 282) y = 282;
if (x < 40) x = 40; if (x < 40) x = 40;
if (x > 580) x = 580; if (x > maxX) x = maxX;
return { x, y }; return { x, y };
}; };

32
server/scripts/modules/regionalforecast.mjs
View File

@@ -14,11 +14,29 @@ import * as utils from './regionalforecast-utils.mjs';
import { getPoint } from './utils/weather.mjs'; import { getPoint } from './utils/weather.mjs';
import { debugFlag } from './utils/debug.mjs'; import { debugFlag } from './utils/debug.mjs';
import filterExpiredPeriods from './utils/forecast-utils.mjs'; import filterExpiredPeriods from './utils/forecast-utils.mjs';
import settings from './settings.mjs';
// map offset // set up spacing and scales
const mapOffsetXY = { const scaling = () => {
x: 240, // available space
y: 117, const available = {
x: 640,
};
// map offset
const mapOffsetXY = {
x: 240,
y: 117,
};
if (settings.wide?.value && settings.enhancedScreens?.value) {
mapOffsetXY.x = 320;
available.x = 854;
}
return {
mapOffsetXY,
available,
};
}; };
class RegionalForecast extends WeatherDisplay { class RegionalForecast extends WeatherDisplay {
@@ -45,6 +63,7 @@ class RegionalForecast extends WeatherDisplay {
this.elem.querySelector('.map img').src = baseMap; this.elem.querySelector('.map img').src = baseMap;
// get user's location in x/y // get user's location in x/y
const { available, mapOffsetXY } = scaling();
const sourceXY = utils.getXYFromLatitudeLongitude(this.weatherParameters.latitude, this.weatherParameters.longitude, mapOffsetXY.x, mapOffsetXY.y, weatherParameters.state); const sourceXY = utils.getXYFromLatitudeLongitude(this.weatherParameters.latitude, this.weatherParameters.longitude, mapOffsetXY.x, mapOffsetXY.y, weatherParameters.state);
// get latitude and longitude limits // get latitude and longitude limits
@@ -102,7 +121,7 @@ class RegionalForecast extends WeatherDisplay {
} }
// get XY on map for city // get XY on map for city
const cityXY = utils.getXYForCity(city, minMaxLatLon.maxLat, minMaxLatLon.minLon, this.weatherParameters.state); const cityXY = utils.getXYForCity(city, minMaxLatLon.maxLat, minMaxLatLon.minLon, this.weatherParameters.state, available - 60);
// wait for the regional observation if it's not done yet // wait for the regional observation if it's not done yet
const observation = await observationPromise; const observation = await observationPromise;
@@ -188,7 +207,8 @@ class RegionalForecast extends WeatherDisplay {
} }
// draw the map // draw the map
const scale = 640 / (mapOffsetXY.x * 2); const { available, mapOffsetXY } = scaling();
const scale = available.x / (mapOffsetXY.x * 2);
const map = this.elem.querySelector('.map'); const map = this.elem.querySelector('.map');
map.style.transform = `scale(${scale}) translate(-${sourceXY.x}px, -${sourceXY.y}px)`; map.style.transform = `scale(${scale}) translate(-${sourceXY.x}px, -${sourceXY.y}px)`;

2
views/partials/regional-forecast.ejs
View File

@@ -1,5 +1,5 @@
<%- include('header.ejs', {titleDual:{ top: 'Regional' , bottom: 'Observations' }, hasTime: true }) %> <%- include('header.ejs', {titleDual:{ top: 'Regional' , bottom: 'Observations' }, hasTime: true }) %>
<div class="main has-scroll regional-forecast"> <div class="main has-scroll regional-forecast can-enhance">
<div class="map"><img src="images/maps/basemap.webp" /></div> <div class="map"><img src="images/maps/basemap.webp" /></div>
<div class="location-container"> <div class="location-container">
<div class="location template"> <div class="location template">