From 4cc2bb9a87862907e8e76765ccfdc87aca744caa Mon Sep 17 00:00:00 2001
From: Guntis Smaukstelis <gsmaukstelis@evolution.com>
Date: Mon, 12 Feb 2024 15:57:16 +0200
Subject: [PATCH] Bigger wind font for higher resolution map

---
 web/src/cities/map/canvasDraw.ts |  4 ++--
 web/src/cities/map/mapConsts.ts  | 11 ++++++-----
 2 files changed, 8 insertions(+), 7 deletions(-)

diff --git a/web/src/cities/map/canvasDraw.ts b/web/src/cities/map/canvasDraw.ts
index 02e9f3d..9210912 100644
--- a/web/src/cities/map/canvasDraw.ts
+++ b/web/src/cities/map/canvasDraw.ts
@@ -54,7 +54,7 @@ export function drawOnMap(
     if (!props.showWind) return;
 
     // wind values
-    ctx.font = "bold 45px Rubik";
+    ctx.font = `bold ${props.windFontSize}px Rubik`;
     ctx.textAlign = "left";
     ctx.textBaseline = "top";
     ctx.fillStyle = "#FFFFFF";
@@ -70,7 +70,7 @@ export function drawOnMap(
     ctx.font = "bold 25px Rubik";
     ctx.fillText("M/S", windProp.offsetX + boxMiddleX + speedWidth / 2 - 22, (windProp.offsetY + 590)*windProp.scaleY);
 
-    ctx.font = "bold 45px Rubik";
+    ctx.font = `bold ${props.windFontSize}px Rubik`;
     const gustsWidth = ctx.measureText(windGusts).width;
     ctx.fillText(windGusts, windProp.offsetX + boxMiddleX - gustsWidth / 2 - 30, (windProp.offsetY + 790)*windProp.scaleY);
     ctx.font = "bold 25px Rubik";
diff --git a/web/src/cities/map/mapConsts.ts b/web/src/cities/map/mapConsts.ts
index c824e07..5dc8c3e 100644
--- a/web/src/cities/map/mapConsts.ts
+++ b/web/src/cities/map/mapConsts.ts
@@ -15,13 +15,14 @@ export type ResolutionPropsValue = {
     map: string;
     fontSize: number;
     boxSize: number;
+    windFontSize: number;
 };
 
 export const resolutionProps: Record<string, ResolutionPropsValue> = {
-    "map_1920x1080":        { offsetX: 290, offsetY: 120, width: 1920, height: 1080, scale: 1.35, fontSize: 30, boxSize: 80, showWind: false, map: map_1920x1080 },
-    "map_1920x1080_wind":   { offsetX: 90, offsetY: 120, width: 1920, height: 1080, scale: 1.35, fontSize: 30, boxSize: 80, showWind: true, map: map_1920x1080_wind },
-    "map_3840x1440":        { offsetX: 800, offsetY: 120, width: 3840, height: 1440, scale: 2.2, fontSize: 68, boxSize: 140, showWind: false, map: map_3840x1440 },
-    "map_3840x1440_wind":   { offsetX: 800, offsetY: 120, width: 3840, height: 1440, scale: 2.2, fontSize: 68, boxSize: 140, showWind: true, map: map_3840x1440_wind },
+    "map_1920x1080":        { offsetX: 290, offsetY: 120, width: 1920, height: 1080, scale: 1.35, fontSize: 30, boxSize: 80, showWind: false, map: map_1920x1080, windFontSize: 45, },
+    "map_1920x1080_wind":   { offsetX: 90, offsetY: 120, width: 1920, height: 1080, scale: 1.35, fontSize: 30, boxSize: 80, showWind: true, map: map_1920x1080_wind, windFontSize: 45, },
+    "map_3840x1440":        { offsetX: 800, offsetY: 120, width: 3840, height: 1440, scale: 2.2, fontSize: 68, boxSize: 140, showWind: false, map: map_3840x1440, windFontSize: 60, },
+    "map_3840x1440_wind":   { offsetX: 800, offsetY: 120, width: 3840, height: 1440, scale: 2.2, fontSize: 68, boxSize: 140, showWind: true, map: map_3840x1440_wind, windFontSize: 60, },
 }
 
 export type WindProps = {
@@ -32,5 +33,5 @@ export type WindProps = {
 
 export const windProps: Record<string, WindProps> = {
     "map_1920x1080_wind": { offsetX: 0, offsetY: 0, scaleY: 1, },
-    "map_3840x1440_wind": { offsetX: 1610, offsetY: 80, scaleY: 1.24, },
+    "map_3840x1440_wind": { offsetX: 1610, offsetY: 75, scaleY: 1.24, },
 }