rich/kids-dashboard
1
0 Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Scene sky follows the daytime hours; bigger backpacks

Browse Source 
Open-Meteo's daily weather code reflects the worst hour, even after
school (tomorrow: clear 7am-5pm, cloudy at 6pm -> daily code 3), so the
scene and tomorrow's description said Cloudy. The sky now comes from the
average cloudiness of the same 7am-6pm hours the outfit uses, and
rain/snow/storm still take priority. Backpacks are drawn about a third
of the kid's height, upright by their feet.
This commit is contained in:
rich committed 2026-10-22 22:04:37 -04:00
1 parent df43905d0d
commit b5b4d22fed
1 file changed
+13 -6
Download Patch File Download Diff File Expand all files Collapse all files
dashboard/index.html
+13 -6
View File
@@ -237,10 +237,12 @@ body.cold .cheek{opacity:.95}
<!-- school-day backpack, sitting on the ground by the left foot -->
<g class="o o-backpack">
<path d="M78,396 Q78,384 90,384 L108,384 Q120,384 120,396" stroke="var(--pack-dk,#23604a)" stroke-width="5" fill="none"/>
<rect x="66" y="390" width="58" height="38" rx="10" fill="var(--pack,#2E7D5B)"/>
<rect x="74" y="406" width="42" height="18" rx="6" fill="var(--pack-pocket,#3f9b74)"/>
<path d="M80,410 L110,410" stroke="var(--pack-dk,#23604a)" stroke-width="2.5" stroke-linecap="round"/>
<path d="M74,346 Q74,330 88,330 Q102,330 102,346" stroke="var(--pack-dk,#23604a)" stroke-width="6" fill="none"/>
<rect x="50" y="340" width="76" height="88" rx="18" fill="var(--pack,#2E7D5B)"/>
<path d="M52,366 Q88,356 124,366" stroke="var(--pack-dk,#23604a)" stroke-width="3" fill="none"/>
<rect x="60" y="384" width="56" height="34" rx="9" fill="var(--pack-pocket,#3f9b74)"/>
<path d="M66,392 L110,392" stroke="var(--pack-dk,#23604a)" stroke-width="3" stroke-linecap="round"/>
<circle cx="104" cy="392" r="3.5" fill="#FFD23F"/>
</g>
<!-- umbrella handle (behind the head; the canopy is drawn on top later) -->
@@ -497,6 +499,11 @@ function summarize(d, dateStr, fromHour){
s.wet = !s.snowy && (s.rainProb >= 50 || s.precip >= 0.05);
s.sunny = codes.filter(c => c <= 2).length >= codes.length / 2;
s.foggy = codes.filter(c => c === 45 || c === 48).length >= 2;
// the day's sky = what most of the daytime hours look like (0 clear, 1 partly, 2 cloudy)
const cloudiness = codes.map(c => ({ sun: 0, partly: 1 })[kindOf(c)] ?? 2);
const avg = cloudiness.length ? sum(cloudiness) / cloudiness.length : 1;
s.sky = codes.filter(c => c === 45 || c === 48).length > codes.length / 2 ? "fog"
: avg < 0.5 ? "sun" : avg < 1.4 ? "partly" : "cloud";
return s;
}
@@ -652,7 +659,7 @@ function render(){
if (plan.o.backpack) plan.chips.push(["Backpack", "#2E7D5B"]);
// the "scene" weather kind for the day
const dayKind = s.storm ? "storm" : s.snowy ? "snow" : s.wet ? "rain" : kindOf(D.weather_code[di]) === "rain" ? "cloud" : kindOf(D.weather_code[di]);
const dayKind = s.storm ? "storm" : s.snowy ? "snow" : s.wet ? "rain" : s.sky;
dressKid(plan.o, dayKind, QS.get("season") || seasonOf(target), s);
document.body.classList.toggle("cold", s.coldFeel < 40);
@@ -672,7 +679,7 @@ function render(){
$("pill").textContent = tomorrow ? "High · " + fw : fw; $("pill").style.background = fc;
let desc = DESC[bigCode] || "";
if (!isDay && bigCode <= 1) desc = "Clear night";
if (tomorrow) desc = { storm: "Thunderstorms", snow: "Snowy", rain: "Rainy" }[dayKind] || DESC[D.weather_code[di]] || "";
if (tomorrow) desc = { storm: "Thunderstorms", snow: "Snowy", rain: "Rainy", sun: "Sunny", partly: "Partly cloudy", cloud: "Cloudy", fog: "Foggy" }[dayKind];
$("desc").textContent = desc;
$("hilo").innerHTML = `High <b>${r(D.temperature_2m_max[di])}°</b> &nbsp;Low <b>${r(D.temperature_2m_min[di])}°</b>`;