Starting to build display

src/weather.ts

@@ -15,122 +15,135 @@ export default class Weather {
         this.options = new WeatherOptions(latitude ?? 47.61002138071677, longitude ?? -122.17906310779568)
 
         const me = this
-        me.getWeather().then(() => {
+        setInterval(() => me.getWeather().then(() => me.setDisplay()), 60 * 1000)
-        })
+        me.getWeather().then(() => me.setDisplay())
     }
 
     async getWeather(): Promise<void> {
         const me = this
         const parameters: any = { ...me.options }
+        let getData = false
 
         if (!me.lastFetched) {
             parameters["daily"] = me.dailyVariables
             parameters["hourly"] = me.hourlyVariables
             parameters["current"] = me.currentVariables
             me.lastFetched = new LastFetched()
+            getData = true
         } else {
             // Reasonable-ish timers?
             if (me.lastFetched.minutesSinceCurrent() > 15) {
                 parameters["current"] = me.currentVariables
                 me.lastFetched.current = new Date()
+                getData = true
             }
 
             if (me.lastFetched.hoursSinceHourly() > 3) {
                 parameters["hourly"] = me.hourlyVariables
                 me.lastFetched.hourly = new Date()
+                getData = true
             }
 
             if (me.lastFetched.hoursSinceDaily() > 8) {
                 parameters["daily"] = me.dailyVariables
                 me.lastFetched.daily = new Date()
+                getData = true
             }
         }
 
+        if (!getData) return
+
         const responses = await fetchWeatherApi(me.apiUrl, parameters)
-
         for (const response of responses) {
-            // Attributes for timezone and location
             const utcOffsetSeconds = response.utcOffsetSeconds()
-            const timezone = response.timezone()
+            const current = response.current()
-            const timezoneAbbreviation = response.timezoneAbbreviation()
+            const hourly = response.hourly()
-            const latitude = response.latitude()
+            const daily = response.daily()
-            const longitude = response.longitude()
 
-            const current = response.current()!
+            if (current != null) {
-            const hourly = response.hourly()!
+                me.current = {
-            const daily = response.daily()!
-
-            const sunrise = daily.variables(2)!
-            const sunset = daily.variables(3)!
-
-            // Note: The order of weather variables in the URL query and the indices below need to match!
-            const weatherData = {
-                current: {
                     time: new Date((Number(current.time()) + utcOffsetSeconds) * 1000),
-                    temperature2m: current.variables(0)!.value(),
+                    temperature: current.variables(0)!.value(),
-                    relativeHumidity2m: current.variables(1)!.value(),
+                    humidity: current.variables(1)!.value(),
-                    apparentTemperature: current.variables(2)!.value(),
+                    feelsLike: current.variables(2)!.value(),
                     precipitation: current.variables(3)!.value(),
-                    windSpeed10m: current.variables(4)!.value(),
+                    windSpeed: current.variables(4)!.value(),
-                    windGusts10m: current.variables(5)!.value(),
+                    windGusts: current.variables(5)!.value(),
-                    windDirection10m: current.variables(6)!.value(),
+                    windDirection: current.variables(6)!.value()
-                },
+                }
-                hourly: {
-                    time: [...Array((Number(hourly.timeEnd()) - Number(hourly.time())) / hourly.interval())].map(
-                        (_, i) => new Date((Number(hourly.time()) + i * hourly.interval() + utcOffsetSeconds) * 1000)
-                    ),
-                    temperature2m: hourly.variables(0)!.valuesArray()!,
-                    precipitation: hourly.variables(1)!.valuesArray()!,
-                    precipitationProbability: hourly.variables(2)!.valuesArray()!,
-                },
-                daily: {
-                    time: [...Array((Number(daily.timeEnd()) - Number(daily.time())) / daily.interval())].map(
-                        (_, i) => new Date((Number(daily.time()) + i * daily.interval() + utcOffsetSeconds) * 1000)
-                    ),
-                    temperature2mMax: daily.variables(0)!.valuesArray()!,
-                    temperature2mMin: daily.variables(1)!.valuesArray()!,
-                    sunrise: [...Array(sunrise.valuesInt64Length())].map(
-                        (_, i) => new Date((Number(sunrise.valuesInt64(i)) + utcOffsetSeconds) * 1000)
-                    ),
-                    sunset: [...Array(sunset.valuesInt64Length())].map(
-                        (_, i) => new Date((Number(sunset.valuesInt64(i)) + utcOffsetSeconds) * 1000)
-                    ),
-                    uvIndexMax: daily.variables(4)!.valuesArray()!,
-                    precipitationSum: daily.variables(5)!.valuesArray()!,
-                    precipitationHours: daily.variables(6)!.valuesArray()!,
-                    windSpeed10mMax: daily.variables(7)!.valuesArray()!,
-                    windGusts10mMax: daily.variables(8)!.valuesArray()!,
-                    windDirection10mDominant: daily.variables(9)!.valuesArray()!,
-                },
             }
 
-            console.log(weatherData)
+            if (hourly != null) {
+                const length = Number(hourly.timeEnd() - hourly.time()) / hourly.interval()
+                const temperatures = hourly.variables(0)!.valuesArray()
+                const precipitationTotals = hourly.variables(1)!.valuesArray()
+                const precipitationProbabilities = hourly.variables(2)!.valuesArray()
+                me.hourly.length = 0
 
-            // `weatherData` now contains a simple structure with arrays for datetime and weather data
+                for (let i = 0; i < length; i++) {
-            for (let i = 0; i < weatherData.hourly.time.length; i++) {
+                    me.hourly.push({
-                console.log(
+                        time: new Date((Number(hourly.time()) + i * hourly.interval() + utcOffsetSeconds) * 1000),
-                    weatherData.hourly.time[i].toISOString(),
+                        temperature: temperatures[i],
-                    weatherData.hourly.temperature2m[i],
+                        precipitation: precipitationTotals[i],
-                    weatherData.hourly.precipitation[i],
+                        precipitationProbability: precipitationProbabilities[i]
-                    weatherData.hourly.precipitationProbability[i]
+                    })
-                )
-            }
-            for (let i = 0; i < weatherData.daily.time.length; i++) {
-                console.log(
-                    weatherData.daily.time[i].toISOString(),
-                    weatherData.daily.temperature2mMax[i],
-                    weatherData.daily.temperature2mMin[i],
-                    weatherData.daily.sunrise[i].toISOString(),
-                    weatherData.daily.sunset[i].toISOString(),
-                    weatherData.daily.uvIndexMax[i],
-                    weatherData.daily.precipitationSum[i],
-                    weatherData.daily.precipitationHours[i],
-                    weatherData.daily.windSpeed10mMax[i],
-                    weatherData.daily.windGusts10mMax[i],
-                    weatherData.daily.windDirection10mDominant[i]
-                )
                 }
             }
+
+            if (daily != null) {
+                const length = Number(daily.timeEnd() - daily.time()) / daily.interval()
+                const maxTemperatures = daily.variables(0)!.valuesArray()
+                const minTemperatures = daily.variables(1)!.valuesArray()
+                const sunrise = daily.variables(2)
+                const sunset = daily.variables(3)
+                const maxUVs = daily.variables(4)!.valuesArray()
+                const precipitationTotals = daily.variables(5)!.valuesArray()
+                const precipitationHours = daily.variables(6)!.valuesArray()
+                const maxWindSpeeds = daily.variables(7)!.valuesArray()
+                const maxWindGusts = daily.variables(8)!.valuesArray()
+                const prominentWindDirections = daily.variables(9)!.valuesArray()
+
+                me.daily.length = 0
+
+                for (let i = 0; i < length; i++) {
+                    me.daily.push({
+                        time: new Date((Number(daily.time()) + i * daily.interval() + utcOffsetSeconds) * 1000),
+                        maxTemperature: maxTemperatures[i],
+                        minTemperature: minTemperatures[i],
+                        sunrise: new Date((Number(sunrise.valuesInt64(i)) + utcOffsetSeconds) * 1000),
+                        sunset: new Date((Number(sunset.valuesInt64(i)) + utcOffsetSeconds) * 1000),
+                        maxUV: maxUVs[i],
+                        totalPrecipitation: precipitationTotals[i],
+                        hoursOfPrecipitation: precipitationHours[i],
+                        maxWindSpeed: maxWindSpeeds[i],
+                        maxWindGusts: maxWindGusts[i],
+                        prominentWindDirection: prominentWindDirections[i]
+                    })
+                }
+            }
+
+            console.log(me)
+        }
+    }
+
+    private setDisplay() {
+        let panel = document.getElementById("weather-panel")
+        if (!panel) {
+            panel = document.createElement("main")
+            panel.id = "weather-panel"
+            document.body.appendChild(panel)
+        }
+
+        while (panel.firstChild) panel.removeChild(panel.firstChild)
+
+        const currentSection = document.createElement("section")
+        currentSection.id = "current-section"
+        panel.appendChild(currentSection)
+        this.setDisplayCurrent(currentSection)
+    }
+
+    private setDisplayCurrent(section: HTMLElement) {
+
     }
 }
 
@@ -149,7 +162,7 @@ class WeatherOptions {
     }
 }
 
-class CurrentWeather {
+interface CurrentWeather {
     time: Date
     temperature: number
     humidity: number
@@ -160,7 +173,8 @@ class CurrentWeather {
     windDirection: number
 }
 
-class DailyWeather {
+interface DailyWeather {
+    time: Date
     hoursOfPrecipitation: number
     totalPrecipitation: number
     sunrise: Date
@@ -171,10 +185,9 @@ class DailyWeather {
     prominentWindDirection: number
     maxWindGusts: number
     maxWindSpeed: number
-    asOf: Date
 }
 
-class HourlyWeather {
+interface HourlyWeather {
     time: Date
     precipitation: number
     precipitationProbability: number
@@ -182,26 +195,19 @@ class HourlyWeather {
 }
 
 class LastFetched {
-    current: Date
+    current: Date = new Date()
-    hourly: Date
+    hourly: Date = new Date()
-    daily: Date
+    daily: Date = new Date()
-
-    constructor() {
-        const now = new Date()
-        this.current = now
-        this.hourly = now
-        this.daily = now
-    }
 
     minutesSinceCurrent(): number {
-        return 0
+        return (new Date().getTime() - this.current.getTime()) / 60000
     }
 
     hoursSinceHourly(): number {
-        return 0
+        return (new Date().getTime() - this.hourly.getTime()) / 3600000
     }
 
     hoursSinceDaily(): number {
-        return 0
+        return (new Date().getTime() - this.daily.getTime()) / 3600000
     }
 }

www/index.html

@@ -6,7 +6,6 @@
     <link rel="stylesheet" href="styles.css" />
 </head>
 <body>
-    <div id="weather-panel"></div>
     <script src="main.js"></script>
 </body>
 </html>

www/main.js

@@ -2309,91 +2309,122 @@ var __generator = (undefined && undefined.__generator) || function (thisArg, bod
         if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
     }
 };
-var __spreadArray = (undefined && undefined.__spreadArray) || function (to, from, pack) {
-    if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
-        if (ar || !(i in from)) {
-            if (!ar) ar = Array.prototype.slice.call(from, 0, i);
-            ar[i] = from[i];
-        }
-    }
-    return to.concat(ar || Array.prototype.slice.call(from));
-};
 
 var Weather = /** @class */ (function () {
     function Weather(latitude, longitude) {
-        latitude !== null && latitude !== void 0 ? latitude : (latitude = 47.61002138071677);
+        this.apiUrl = "https://api.open-meteo.com/v1/forecast";
-        longitude !== null && longitude !== void 0 ? longitude : (longitude = -122.17906310779568);
+        this.dailyVariables = ["temperature_2m_max", "temperature_2m_min", "sunrise", "sunset", "uv_index_max", "precipitation_sum", "precipitation_hours", "wind_speed_10m_max", "wind_gusts_10m_max", "wind_direction_10m_dominant"];
-        this.options = new WeatherOptions();
+        this.hourlyVariables = ["temperature_2m", "precipitation", "precipitation_probability"];
-        this.options = __assign(__assign({}, this.options), { latitude: latitude, longitude: longitude });
+        this.currentVariables = ["temperature_2m", "relative_humidity_2m", "apparent_temperature", "precipitation", "wind_speed_10m", "wind_gusts_10m", "wind_direction_10m"];
-        this.getWeather().then(function () {
+        this.hourly = [];
-        });
+        this.daily = [];
+        this.options = new WeatherOptions(latitude !== null && latitude !== void 0 ? latitude : 47.61002138071677, longitude !== null && longitude !== void 0 ? longitude : -122.17906310779568);
+        var me = this;
+        setInterval(function () { return me.getWeather(); }, 60 * 1000);
+        me.getWeather();
     }
     Weather.prototype.getWeather = function () {
         return __awaiter(this, void 0, void 0, function () {
-            var url, responses, _loop_1, _i, responses_1, response;
+            var me, parameters, getData, responses, _i, responses_1, response, utcOffsetSeconds, current, hourly, daily, length_1, temperatures, precipitationTotals, precipitationProbabilities, i, length_2, maxTemperatures, minTemperatures, sunrise, sunset, maxUVs, precipitationTotals, precipitationHours, maxWindSpeeds, maxWindGusts, prominentWindDirections, i;
             return __generator(this, function (_a) {
                 switch (_a.label) {
                     case 0:
-                        url = "https://api.open-meteo.com/v1/forecast";
+                        me = this;
-                        return [4 /*yield*/, (0,openmeteo__WEBPACK_IMPORTED_MODULE_0__.fetchWeatherApi)(url, this.options)];
+                        parameters = __assign({}, me.options);
+                        getData = false;
+                        if (!me.lastFetched) {
+                            parameters["daily"] = me.dailyVariables;
+                            parameters["hourly"] = me.hourlyVariables;
+                            parameters["current"] = me.currentVariables;
+                            me.lastFetched = new LastFetched();
+                            getData = true;
+                        }
+                        else {
+                            // Reasonable-ish timers?
+                            if (me.lastFetched.minutesSinceCurrent() > 15) {
+                                parameters["current"] = me.currentVariables;
+                                me.lastFetched.current = new Date();
+                                getData = true;
+                            }
+                            if (me.lastFetched.hoursSinceHourly() > 3) {
+                                parameters["hourly"] = me.hourlyVariables;
+                                me.lastFetched.hourly = new Date();
+                                getData = true;
+                            }
+                            if (me.lastFetched.hoursSinceDaily() > 8) {
+                                parameters["daily"] = me.dailyVariables;
+                                me.lastFetched.daily = new Date();
+                                getData = true;
+                            }
+                        }
+                        if (!getData)
+                            return [2 /*return*/];
+                        return [4 /*yield*/, (0,openmeteo__WEBPACK_IMPORTED_MODULE_0__.fetchWeatherApi)(me.apiUrl, parameters)];
                     case 1:
                         responses = _a.sent();
-                        _loop_1 = function (response) {
-                            // Attributes for timezone and location
-                            var utcOffsetSeconds = response.utcOffsetSeconds();
-                            var timezone = response.timezone();
-                            var timezoneAbbreviation = response.timezoneAbbreviation();
-                            var latitude = response.latitude();
-                            var longitude = response.longitude();
-                            var current = response.current();
-                            var hourly = response.hourly();
-                            var daily = response.daily();
-                            var sunrise = daily.variables(2);
-                            var sunset = daily.variables(3);
-                            // Note: The order of weather variables in the URL query and the indices below need to match!
-                            var weatherData = {
-                                current: {
-                                    time: new Date((Number(current.time()) + utcOffsetSeconds) * 1000),
-                                    temperature2m: current.variables(0).value(),
-                                    relativeHumidity2m: current.variables(1).value(),
-                                    apparentTemperature: current.variables(2).value(),
-                                    precipitation: current.variables(3).value(),
-                                    windSpeed10m: current.variables(4).value(),
-                                    windGusts10m: current.variables(5).value(),
-                                    windDirection10m: current.variables(6).value(),
-                                },
-                                hourly: {
-                                    time: __spreadArray([], Array((Number(hourly.timeEnd()) - Number(hourly.time())) / hourly.interval()), true).map(function (_, i) { return new Date((Number(hourly.time()) + i * hourly.interval() + utcOffsetSeconds) * 1000); }),
-                                    temperature2m: hourly.variables(0).valuesArray(),
-                                    precipitation: hourly.variables(1).valuesArray(),
-                                    precipitationProbability: hourly.variables(2).valuesArray(),
-                                },
-                                daily: {
-                                    time: __spreadArray([], Array((Number(daily.timeEnd()) - Number(daily.time())) / daily.interval()), true).map(function (_, i) { return new Date((Number(daily.time()) + i * daily.interval() + utcOffsetSeconds) * 1000); }),
-                                    temperature2mMax: daily.variables(0).valuesArray(),
-                                    temperature2mMin: daily.variables(1).valuesArray(),
-                                    sunrise: __spreadArray([], Array(sunrise.valuesInt64Length()), true).map(function (_, i) { return new Date((Number(sunrise.valuesInt64(i)) + utcOffsetSeconds) * 1000); }),
-                                    sunset: __spreadArray([], Array(sunset.valuesInt64Length()), true).map(function (_, i) { return new Date((Number(sunset.valuesInt64(i)) + utcOffsetSeconds) * 1000); }),
-                                    uvIndexMax: daily.variables(4).valuesArray(),
-                                    precipitationSum: daily.variables(5).valuesArray(),
-                                    precipitationHours: daily.variables(6).valuesArray(),
-                                    windSpeed10mMax: daily.variables(7).valuesArray(),
-                                    windGusts10mMax: daily.variables(8).valuesArray(),
-                                    windDirection10mDominant: daily.variables(9).valuesArray(),
-                                },
-                            };
-                            console.log(weatherData);
-                            // `weatherData` now contains a simple structure with arrays for datetime and weather data
-                            for (var i = 0; i < weatherData.hourly.time.length; i++) {
-                                console.log(weatherData.hourly.time[i].toISOString(), weatherData.hourly.temperature2m[i], weatherData.hourly.precipitation[i], weatherData.hourly.precipitationProbability[i]);
-                            }
-                            for (var i = 0; i < weatherData.daily.time.length; i++) {
-                                console.log(weatherData.daily.time[i].toISOString(), weatherData.daily.temperature2mMax[i], weatherData.daily.temperature2mMin[i], weatherData.daily.sunrise[i].toISOString(), weatherData.daily.sunset[i].toISOString(), weatherData.daily.uvIndexMax[i], weatherData.daily.precipitationSum[i], weatherData.daily.precipitationHours[i], weatherData.daily.windSpeed10mMax[i], weatherData.daily.windGusts10mMax[i], weatherData.daily.windDirection10mDominant[i]);
-                            }
-                        };
                         for (_i = 0, responses_1 = responses; _i < responses_1.length; _i++) {
                             response = responses_1[_i];
-                            _loop_1(response);
+                            utcOffsetSeconds = response.utcOffsetSeconds();
+                            current = response.current();
+                            hourly = response.hourly();
+                            daily = response.daily();
+                            if (current != null) {
+                                me.current = {
+                                    time: new Date((Number(current.time()) + utcOffsetSeconds) * 1000),
+                                    temperature: current.variables(0).value(),
+                                    humidity: current.variables(1).value(),
+                                    feelsLike: current.variables(2).value(),
+                                    precipitation: current.variables(3).value(),
+                                    windSpeed: current.variables(4).value(),
+                                    windGusts: current.variables(5).value(),
+                                    windDirection: current.variables(6).value()
+                                };
+                            }
+                            if (hourly != null) {
+                                length_1 = Number(hourly.timeEnd() - hourly.time()) / hourly.interval();
+                                temperatures = hourly.variables(0).valuesArray();
+                                precipitationTotals = hourly.variables(1).valuesArray();
+                                precipitationProbabilities = hourly.variables(2).valuesArray();
+                                me.hourly.length = 0;
+                                for (i = 0; i < length_1; i++) {
+                                    me.hourly.push({
+                                        time: new Date((Number(hourly.time()) + i * hourly.interval() + utcOffsetSeconds) * 1000),
+                                        temperature: temperatures[i],
+                                        precipitation: precipitationTotals[i],
+                                        precipitationProbability: precipitationProbabilities[i]
+                                    });
+                                }
+                            }
+                            if (daily != null) {
+                                length_2 = Number(daily.timeEnd() - daily.time()) / daily.interval();
+                                maxTemperatures = daily.variables(0).valuesArray();
+                                minTemperatures = daily.variables(1).valuesArray();
+                                sunrise = daily.variables(2);
+                                sunset = daily.variables(3);
+                                maxUVs = daily.variables(4).valuesArray();
+                                precipitationTotals = daily.variables(5).valuesArray();
+                                precipitationHours = daily.variables(6).valuesArray();
+                                maxWindSpeeds = daily.variables(7).valuesArray();
+                                maxWindGusts = daily.variables(8).valuesArray();
+                                prominentWindDirections = daily.variables(9).valuesArray();
+                                me.daily.length = 0;
+                                for (i = 0; i < length_2; i++) {
+                                    me.daily.push({
+                                        time: new Date((Number(daily.time()) + i * daily.interval() + utcOffsetSeconds) * 1000),
+                                        maxTemperature: maxTemperatures[i],
+                                        minTemperature: minTemperatures[i],
+                                        sunrise: new Date((Number(sunrise.valuesInt64(i)) + utcOffsetSeconds) * 1000),
+                                        sunset: new Date((Number(sunset.valuesInt64(i)) + utcOffsetSeconds) * 1000),
+                                        maxUV: maxUVs[i],
+                                        totalPrecipitation: precipitationTotals[i],
+                                        hoursOfPrecipitation: precipitationHours[i],
+                                        maxWindSpeed: maxWindSpeeds[i],
+                                        maxWindGusts: maxWindGusts[i],
+                                        prominentWindDirection: prominentWindDirections[i]
+                                    });
+                                }
+                            }
+                            console.log(me);
                         }
                         return [2 /*return*/];
                 }
@@ -2404,26 +2435,34 @@ var Weather = /** @class */ (function () {
 }());
 /* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (Weather);
 var WeatherOptions = /** @class */ (function () {
-    function WeatherOptions() {
+    function WeatherOptions(latitude, longitude, timezone) {
-        this.daily = ["temperature_2m_max", "temperature_2m_min", "sunrise", "sunset", "uv_index_max", "precipitation_sum", "precipitation_hours", "wind_speed_10m_max", "wind_gusts_10m_max", "wind_direction_10m_dominant"];
+        if (timezone === void 0) { timezone = "America/Los_Angeles"; }
-        this.hourly = ["temperature_2m", "precipitation", "precipitation_probability"];
-        this.current = ["temperature_2m", "relative_humidity_2m", "apparent_temperature", "precipitation", "wind_speed_10m", "wind_gusts_10m", "wind_direction_10m"];
         this.timezone = "America/Los_Angeles";
         this["wind_speed_unit"] = "mph";
         this["temperature_unit"] = "fahrenheit";
         this["precipitation_unit"] = "inch";
+        this.latitude = latitude;
+        this.longitude = longitude;
+        this.timezone = timezone;
     }
     return WeatherOptions;
 }());
-var WeatherData = /** @class */ (function () {
+var LastFetched = /** @class */ (function () {
-    function WeatherData() {
+    function LastFetched() {
+        this.current = new Date();
+        this.hourly = new Date();
+        this.daily = new Date();
     }
-    return WeatherData;
+    LastFetched.prototype.minutesSinceCurrent = function () {
-}());
+        return (new Date().getTime() - this.current.getTime()) / 60000;
-var CurrentWeather = /** @class */ (function () {
+    };
-    function CurrentWeather() {
+    LastFetched.prototype.hoursSinceHourly = function () {
-    }
+        return (new Date().getTime() - this.hourly.getTime()) / 3600000;
-    return CurrentWeather;
+    };
+    LastFetched.prototype.hoursSinceDaily = function () {
+        return (new Date().getTime() - this.daily.getTime()) / 3600000;
+    };
+    return LastFetched;
 }());