Add dedicated Faktiska map production workflow

2026-08-18 22:31:56 +03:00
parent 67decb330b
commit ffb89024f1
10 changed files with 89 additions and 72 deletions
@@ -1,48 +1,17 @@
-import { Component, Signal } from "solid-js";
-import { weatherIconCities, weatherIcons } from "./iconConsts";
-
+import { Component, createSignal, For, Show, Signal } from "solid-js";
+import { weatherIcons } from "./iconConsts";
 import "../../css/weatherIcons.css";

-export const IconInputs: Component<{ weatherIconsSingal: Signal<{[key: string]: string;}>; }> = ({
-    weatherIconsSingal: [getWeatherIcons, setWeatherIcons]
-}) => {
+export const IconInputs: Component<{cities: string[]; weatherIconsSignal: Signal<Record<string, string>>}> = (props) => {
+    const [icons, setIcons] = props.weatherIconsSignal;
+    const [selected, setSelected] = createSignal(weatherIcons[0]);
+    const assign = (city: string) => setIcons({...icons(), [city]: selected()});
+    const clear = (city: string) => { const next = {...icons()}; delete next[city]; setIcons(next); };
+    const applyAll = () => setIcons(Object.fromEntries(props.cities.map(city => [city, selected()])));

-    function onIconChange(city: string, icon: string) {
-        const weatherIcons = { ...getWeatherIcons() };
-        weatherIcons[city] = icon;
-        if (icon === "") delete weatherIcons[city];
-
-        setWeatherIcons(weatherIcons);
-    }
-
-    return (
-        <>
-            <div>
-                <strong>Weather symbols</strong><p class="fieldHint">Click a symbol to copy it, then paste it into a city field below.</p>
-                { weatherIcons.map(icon =>
-                    <span class="weatherIconButton" onClick={() => copyToClipboard(icon)}>{ icon }</span>)
-                }
-            </div>
-            <div>
-                { weatherIconCities.map(city =>
-                    <div style="float: left;">
-                        {city}:
-                        &nbsp;
-                        <input
-                            type="text"
-                            class="weatherIconInput"
-                            size="1"
-                            maxlength="1"
-                            onInput={e => onIconChange(city, e.target.value)}
-                        />
-                        &nbsp;
-                    </div>)
-                }
-            </div>
-        </>
-    )
-}
-
-function copyToClipboard(icon: string) {
-    navigator.clipboard.writeText(icon);
-}
+    return <section class="symbolEditor">
+        <div class="symbolEditorHeading"><div><strong>Weather symbols</strong><p class="fieldHint">Select a font symbol, apply it to all cities, then change the exceptions.</p></div><button type="button" onClick={applyAll}>Apply selected to all</button></div>
+        <div class="symbolPalette" role="listbox" aria-label="Weather symbols"><For each={weatherIcons}>{icon => <button type="button" class="weatherIconButton" classList={{selected: selected() === icon}} onClick={() => setSelected(icon)}>{icon}</button>}</For></div>
+        <div class="citySymbols"><For each={props.cities}>{city => <div class="citySymbolRow"><span>{city}</span><button type="button" class="assignedSymbol" onClick={() => assign(city)} title="Assign selected symbol"><Show when={icons()[city]} fallback="Assign">{icons()[city]}</Show></button><button type="button" class="clearSymbol" disabled={!icons()[city]} onClick={() => clear(city)}>Clear</button></div>}</For></div>
+    </section>;
+};