diff --git a/index.html b/index.html index d98b614..6b8ce24 100644 --- a/index.html +++ b/index.html @@ -320,6 +320,64 @@ return { sky: palette[0].sky, cloud: palette[0].cloud, light: palette[0].light, bg: palette[0].bg, cloudShadow: palette[0].cloudShadow, sun: palette[0].sun, sunGlare: palette[0].sunGlare, sunLight: palette[0].sunLight, sunVis: 0 }; } + function adjustColor(color, factor) { + var r = Math.min(255, Math.floor(((color >> 16) & 255) * factor)); + var g = Math.min(255, Math.floor(((color >> 8) & 255) * factor)); + var b = Math.min(255, Math.floor((color & 255) * factor)); + return (r << 16) | (g << 8) | b; + } + + function shiftColor(color, delta) { + var r = Math.max(0, Math.min(255, ((color >> 16) & 255) + delta)); + var g = Math.max(0, Math.min(255, ((color >> 8) & 255) + delta)); + var b = Math.max(0, Math.min(255, (color & 255) + delta)); + return (r << 16) | (g << 8) | b; + } + + function getWeatherModifiers(code) { + // Returns {cloudDark: factor, cloudLight: factor, skyShift: shift, bgShift: shift} + // code is WMO weather code from open-meteo + if (code === 0) { + // Clear sky - lighter clouds, brighter sky + return { cloudDark: 0.7, cloudLight: 1.3, skyShift: 15, bgShift: 15 }; + } else if (code >= 1 && code <= 3) { + // Mainly clear to overcast - neutral + return { cloudDark: 0.95, cloudLight: 1.0, skyShift: 0, bgShift: -5 }; + } else if (code === 45 || code === 48) { + // Fog - cool, washed out + return { cloudDark: 1.1, cloudLight: 0.85, skyShift: 10, bgShift: 10 }; + } else if ((code >= 51 && code <= 57) || (code >= 61 && code <= 67)) { + // Drizzle / Rain - darker, slightly cooler + return { cloudDark: 1.3, cloudLight: 0.7, skyShift: -15, bgShift: -20 }; + } else if ((code >= 71 && code <= 77) || (code >= 85 && code <= 86)) { + // Snow - brighter (light reflection) + return { cloudDark: 0.7, cloudLight: 1.5, skyShift: 25, bgShift: 25 }; + } else if (code >= 80 && code <= 82) { + // Rain showers - darker + return { cloudDark: 1.4, cloudLight: 0.6, skyShift: -20, bgShift: -25 }; + } else if (code >= 95) { + // Thunderstorm - very dark, dramatic + return { cloudDark: 1.6, cloudLight: 0.4, skyShift: -30, bgShift: -35 }; + } + return { cloudDark: 1.0, cloudLight: 1.0, skyShift: 0, bgShift: 0 }; + } + + var currentWeatherCode = -1; + + function applyWeatherModifiers(c, code) { + var m = getWeatherModifiers(code); + return { + sky: c.sky, + cloud: adjustColor(c.cloud, m.cloudLight), + cloudShadow: adjustColor(c.cloudShadow, m.cloudDark), + sun: adjustColor(c.sun, m.cloudLight), + sunGlare: adjustColor(c.sunGlare, m.cloudLight), + sunLight: adjustColor(c.sunLight, m.cloudLight), + bg: shiftColor(c.bg, m.bgShift), + sunVis: c.sunVis + }; + } + // ============ Clock & Sun/Moon Calculations ============ var PASSAU_LAT = 48.5667; var PASSAU_LON = 13.4319; @@ -681,6 +739,9 @@ var elapsed = (Date.now() - startTime) % CYCLE; var t = elapsed / CYCLE; var c = getColor(t); + if (currentWeatherCode >= 0) { + c = applyWeatherModifiers(c, currentWeatherCode); + } effect.setOptions({ skyColor: c.sky, cloudColor: c.cloud, @@ -790,6 +851,7 @@ .then(function(response) { return response.json(); }) .then(function(data) { weatherData = data; + currentWeatherCode = data.current.weather_code; updateWeatherDisplay(); }) .catch(function(err) {