joeldueckdotcom

Artifact 056e5460571e6493bc8ba9ea8c26c8896591f5bd99a275c9d7feb14189e2bfdd:

• File site/windfinger.js — part of check-in [3a75456e74] at 2021-07-04 03:09:03 on branch trunk — Use retries w/exponential backoff, async/await in weather js (user: joel size: 1734)

async function updateWeatherDiv() {
    const weatherDiv = document.getElementById('weather');
    weatherDiv.innerHTML = 'Getting weather…';
    try {
        const weather = await loadWeather();
        
        // The temperature → hue formula
        let tempHue = 210 - (weather.temp * 2);
        if(tempHue < 0) tempHue = 360 - tempHue;
        
        document.documentElement.style.setProperty('--base-temp', tempHue);
        weatherDiv.innerHTML = `Robbinsdale, MN: ${weather.temp}º F; ${weather.conditions}`;
    } catch (e) {
        weatherDiv.innerHTML = e.message;
    }
}

async function loadWeather() {
    let w = JSON.parse(localStorage.getItem('weather'));
    if(w === null || Date.now() - w.timestamp > 3600000) {
        w = await fetchWeather();
        localStorage.setItem('weather', JSON.stringify(w));
    }
    return w;
}

const delay = (retryCount) => new Promise((res) => setTimeout(res, 10 ** retryCount));

async function fetchWeather(retryCount = 0) {
    console.log('Updating weather data cache…');
    try {
        const response = await fetch('https://api.weather.gov/gridpoints/MPX/105,74/forecast/hourly?units=us');
        if(!response.ok) { throw Error(response.statusText); }
        
        const weatherJson = await response.json()
        const weather = weatherJson.properties.periods[0];
        return { 
            "timestamp" : Date.now(),
            "temp" : weather.temperature,
            "conditions" : weather.shortForecast };
    } catch (e) {
        console.log(`Attempt ${retryCount} failed: ${e.message}`);
        if(retryCount > 4) { throw e; }
        await delay(retryCount + 1);
        return fetchWeather(retryCount + 1);
    }
}

updateWeatherDiv();