From eff962608fead136d6fdfa3eb3d8c98844780247 Mon Sep 17 00:00:00 2001
From: w <waifuism@tutanota.com>
Date: Wed, 16 Jul 2025 22:32:57 -0300
Subject: [PATCH] Enhance text wrapping in drawCard function to support
 multi-line input

---
 web/templates/card_creator.html | 30 +++++++++++++++++-------------
 1 file changed, 17 insertions(+), 13 deletions(-)

diff --git a/web/templates/card_creator.html b/web/templates/card_creator.html
index 1cbf90c..7c87fc5 100644
--- a/web/templates/card_creator.html
+++ b/web/templates/card_creator.html
@@ -137,21 +137,25 @@ async function drawCardId() {
 
 
 function wrapText(text, x, y, maxWidth, lineHeight) {
-  const words = text.split(" ");
-  let line = "";
-  for (let n = 0; n < words.length; n++) {
-    const testLine = line + words[n] + " ";
-    const metrics = ctx.measureText(testLine);
-    const testWidth = metrics.width;
-    if (testWidth > maxWidth && n > 0) {
-      ctx.fillText(line, x, y);
-      line = words[n] + " ";
-      y += lineHeight;
-    } else {
-      line = testLine;
+  const lines = text.split('\n');
+  for (let i = 0; i < lines.length; i++) {
+    let words = lines[i].split(" ");
+    let line = "";
+    for (let n = 0; n < words.length; n++) {
+      const testLine = line + words[n] + " ";
+      const metrics = ctx.measureText(testLine);
+      const testWidth = metrics.width;
+      if (testWidth > maxWidth && n > 0) {
+        ctx.fillText(line, x, y);
+        line = words[n] + " ";
+        y += lineHeight;
+      } else {
+        line = testLine;
+      }
     }
+    ctx.fillText(line, x, y);
+    y += lineHeight;
   }
-  ctx.fillText(line, x, y);
 }
 
 // Update card live when inputs change