/* WeatherMate — UI components */
function StatusBar({ time }) {
return (
{time}
{/* cellular */}
{/* wifi */}
{/* battery */}
);
}
function HourSlot({ h, unit, active, animate, onClick, isNow }) {
const cond = WX.conditionOf(h.code);
return (
{isNow ? "Now" : WX.fmtHour(h.time)}
{h.pop != null && h.pop >= 20 ? h.pop + "%" : ""}
{WX.conv.temp(h.temp, unit)}°
);
}
function WeekRow({ d, idx, unit, animate, range }) {
const cond = WX.conditionOf(d.code);
const lo = WX.conv.temp(d.lo, unit), hi = WX.conv.temp(d.hi, unit);
const span = Math.max(1, range.max - range.min);
const left = ((d.lo - range.min) / span) * 100;
const width = ((d.hi - d.lo) / span) * 100;
return (
{WX.fmtDay(d.date, idx)}
{d.pop != null && d.pop >= 20 ? d.pop + "%" : ""}
);
}
/* sun arc graphic for sunrise/sunset widget */
function SunArc({ sunrise, sunset, now }) {
const sr = new Date(sunrise).getTime();
const ss = new Date(sunset).getTime();
const t = Math.min(1, Math.max(0, (now - sr) / (ss - sr)));
const W = 120, H = 56, pad = 8;
const ax = pad + t * (W - pad * 2);
// parabola y
const norm = (ax - W / 2) / (W / 2 - pad);
const ay = H - 8 - (1 - norm * norm) * (H - 18);
return (
);
}
/* wind compass */
function Compass({ dir, speed, unit }) {
const a = (dir || 0) * Math.PI / 180;
const cx = 38, cy = 38, r = 28;
const x2 = cx + Math.sin(a) * r, y2 = cy - Math.cos(a) * r;
const x1 = cx - Math.sin(a) * (r - 6), y1 = cy + Math.cos(a) * (r - 6);
return (
{["N","E","S","W"].map((c, i) => {
const aa = i * Math.PI / 2;
return {c} ;
})}
{speed}
{unit}
);
}
/* generic detail widget */
function DetailWidget({ icon, title, children }) {
return (
);
}
function BottomNav({ view, onHome, onSearch, onList, onRadar, onPrefs }) {
return (
);
}
Object.assign(window, { StatusBar, HourSlot, WeekRow, SunArc, Compass, DetailWidget, BottomNav });