From 56b871606fb23ac05a0e3acff84dfee9b4b972ba Mon Sep 17 00:00:00 2001 From: b0txec Date: Sat, 22 Aug 2026 21:51:09 +0300 Subject: [PATCH] =?UTF-8?q?Support=20multi-warning=20Br=C4=ABdin=C4=81jumi?= =?UTF-8?q?=20selection=20with=20narrower,=20solid-color=20chips?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- web/src/pages/warnings/Warnings.tsx | 34 +++++++++++++++++++------- web/src/pages/warnings/warningDraw.ts | 13 ++++++++-- web/src/pages/warnings/warnings.css | 35 +++++++++++++++------------ 3 files changed, 55 insertions(+), 27 deletions(-) diff --git a/web/src/pages/warnings/Warnings.tsx b/web/src/pages/warnings/Warnings.tsx index 727ccd2..986ac2b 100644 --- a/web/src/pages/warnings/Warnings.tsx +++ b/web/src/pages/warnings/Warnings.tsx @@ -52,8 +52,13 @@ export function Warnings() { const phenomenonMatches = phenomenon() === 'all' || warning.phenomenon === phenomenon(); return dateMatches && phenomenonMatches; })); - const [selectedId, setSelectedId] = createSignal(); - const selectedWarning = createMemo(() => filteredWarnings().find(item => item.id === selectedId())); + const [selectedIds, setSelectedIds] = createSignal>(new Set()); + const selectedWarnings = createMemo(() => filteredWarnings().filter(item => selectedIds().has(item.id))); + const toggleSelected = (id: string) => setSelectedIds(prev => { + const next = new Set(prev); + if (next.has(id)) next.delete(id); else next.add(id); + return next; + }); const [detailId, setDetailId] = createSignal(); const detailWarning = createMemo(() => filteredWarnings().find(item => item.id === detailId())); const closeDetail = () => setDetailId(undefined); @@ -84,22 +89,30 @@ export function Warnings() { createEffect(() => { output(); loadArtwork(); }); createEffect(() => { const list = filteredWarnings(); - if (!list.some(item => item.id === selectedId())) setSelectedId(list[0]?.id); + const validIds = new Set(list.map(item => item.id)); + setSelectedIds(prev => { + let changed = false; + const next = new Set(); + prev.forEach(id => { if (validIds.has(id)) next.add(id); else changed = true; }); + if (next.size === 0 && list.length > 0) { next.add(list[0].id); changed = true; } + return changed ? next : prev; + }); }); + const primarySelected = createMemo(() => selectedWarnings()[0]); createEffect(() => { - const warning = selectedWarning(); + const warning = primarySelected(); setTitle(warning ? defaultTitle(warning.phenomenon) : ''); }); createEffect(() => { const images = artwork(); const current = template(); - const warning = selectedWarning(); + const warnings = selectedWarnings(); const currentTitle = title(); if (!canvas || !images) return; if (canvas.width !== current.width) canvas.width = current.width; if (canvas.height !== current.height) canvas.height = current.height; void document.fonts.load(`700 ${current.title.fontSize}px Monda`).then(() => - drawWarningMap(canvas.getContext('2d')!, images.background, images.border, current, warning, currentTitle), + drawWarningMap(canvas.getContext('2d')!, images.background, images.border, current, warnings, currentTitle), ); }); @@ -107,7 +120,7 @@ export function Warnings() { return
-
ĒTERA GRAFIKA

Brīdinājumi

Izvēlies vienu LVĢMC brīdinājumu, kas jārāda kartē; virsraksts aizpildās automātiski.

+
ĒTERA GRAFIKA

Brīdinājumi

Atzīmē LVĢMC brīdinājumus, kas jārāda kartē; virsraksts aizpildās automātiski.

{filteredWarnings().length} {filteredWarnings().length === 1 ? 'brīdinājums' : 'brīdinājumi'}
@@ -128,8 +141,11 @@ export function Warnings() {
Izvēlētajam periodam nav aktīvu brīdinājumu. Karti joprojām var priekšskatīt, bet tajā nebūs iekrāsotu teritoriju.
 0}>
{warning => -
- setSelectedId(warning.id)}/> +
+