diff --git a/public/views/cards/weather.js b/public/views/cards/weather.js index 94a13e5..c5aba38 100644 --- a/public/views/cards/weather.js +++ b/public/views/cards/weather.js @@ -1,2 +1,25 @@ -// temporary stub — filled in Task 7 -export default { id: 'weather', title: 'Weather', size: 's', mount() {}, start() {}, stop() {} }; +// public/views/cards/weather.js +import { el, mount } from '../../dom.js'; +import { api } from '../../api.js'; + +let body, timer; +async function load() { + if (!body) return; + try { + const w = await api.get('/api/weather'); + mount(body, + el('div', { class: 'sv-row', style: { fontSize: '22px' } }, + el('span', { style: { fontFamily: 'var(--font-mono)' } }, `${Math.round(w.temp)}°C`), + el('span', { class: 'k' }, w.label)), + el('div', { class: 'sv-row' }, el('span', { class: 'k' }, 'Feels like'), el('span', {}, `${Math.round(w.feels_like)}°C`)), + el('div', { class: 'sv-row' }, el('span', { class: 'k' }, 'Humidity'), el('span', {}, `${w.humidity}%`)), + el('div', { class: 'sv-row' }, el('span', { class: 'k' }, 'Wind'), el('span', {}, `${Math.round(w.wind)} km/h`)) + ); + } catch { mount(body, el('span', { class: 'muted' }, 'Weather unavailable')); } +} +export default { + id: 'weather', title: 'Weather · Melbourne', size: 's', + mount(el_) { body = el_; load(); }, + start() { timer = setInterval(load, 15 * 60 * 1000); }, + stop() { clearInterval(timer); body = null; } +};