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

regional forecast/observations in html

Browse Source
This commit is contained in:
Matt Walsh
2022-08-04 16:30:13 -05:00
parent 88a17587b3
commit d34b0ca224
8 changed files with 142 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
server/scripts/modules/navigation.js
View File

@@ -100,7 +100,7 @@ const navigation = (() => {
new LatestObservations(1, 'latest-observations'),
new Hourly(2, 'hourly'),
new TravelForecast(3, 'travelForecast', false), // not active by default
new RegionalForecast(4, 'regionalForecast'),
new RegionalForecast(4, 'regional-forecast'),
new LocalForecast(5, 'local-forecast'),
new ExtendedForecast(6, 'extendedForecast'),
almanac,

27
server/scripts/modules/regionalforecast.js
View File

@@ -359,7 +359,34 @@ class RegionalForecast extends WeatherDisplay {
}
// draw the map
const scale = 640 / (offsetXY.x * 2);
const map = this.elem.querySelector('.map');
map.style.zoom = scale;
map.style.top = `-${sourceXY.y}px`;
map.style.left = `-${sourceXY.x}px`;
this.context.drawImage(await this.baseMap, sourceXY.x, sourceXY.y, (offsetXY.x * 2), (offsetXY.y * 2), 0, mapYOff, 640, 312);
const cities = data.map((city) => {
const fill = {};
const period = city[this.screenIndex];
fill.icon = { type: 'img', src: icons.getWeatherRegionalIconFromIconLink(period.icon, !period.daytime) };
fill.city = period.name;
let { temperature } = period;
if (navigation.units() === UNITS.metric) temperature = Math.round(utils.units.fahrenheitToCelsius(temperature));
fill.temp = temperature;
const elem = this.fillTemplate('location', fill);
elem.style.left = `${period.x}px`;
elem.style.top = `${period.y}px`;
return elem;
});
const locationContainer = this.elem.querySelector('.location-container');
locationContainer.innerHTML = '';
locationContainer.append(...cities);
await Promise.all(data.map(async (city) => {
const period = city[this.screenIndex];
// draw the icon if possible