Refine broadcast map labels and overlays

web/src/components/map/MapView.tsx

@@ -15,6 +15,8 @@ export const MapView: Component<{ type: MapResolution, data: () => ResultKeyVal[
     const [getImg, setImg] = createSignal(new Image());
     const weatherIconsSingal = createSignal<{[key: string]: string;}>({});
     const [getWeatherIcons] = weatherIconsSingal;
+    const [getTitle, setTitle] = createSignal("");
+    const [getSource, setSource] = createSignal("");
     
     let lastCoords: CityData[] = [];
     const props = resolutionProps[type];
@@ -49,6 +51,7 @@ export const MapView: Component<{ type: MapResolution, data: () => ResultKeyVal[
                 [img, arrowImg],
                 lastCoords,
                 getWindData(),
+                [getTitle(), getSource()],
                 props,
             );
         };
@@ -71,6 +74,7 @@ export const MapView: Component<{ type: MapResolution, data: () => ResultKeyVal[
             [getImg(), arrowImg],
             coordsAndData,
             getWindData(),
+            [getTitle(), getSource()],
             props,
         );
     });
@@ -89,6 +93,10 @@ export const MapView: Component<{ type: MapResolution, data: () => ResultKeyVal[
             <details class="broadcastControls">
                 <summary><span><strong>Broadcast overlay controls</strong><small>Optional manual wind and weather-symbol overrides</small></span></summary>
                 <p class="controlHelp">These settings do not change the queried city values. Use them only when preparing a finished broadcast graphic.</p>
+            <div class="overlayFields">
+                <label><span>Title</span><input type="text" placeholder="19. APRĪĻA GAISA TEMPERATŪRAS REKORDI" value={getTitle()} onInput={e => setTitle(e.target.value)} /></label>
+                <label><span>Source</span><input type="text" placeholder="LVĢMC" value={getSource()} onInput={e => setSource(e.target.value)} /></label>
+            </div>
             <div class="grid-1-2">
                 <div>
                     <div>