From ce8cf1d54217a136f7927388324cf18589d2eb5e Mon Sep 17 00:00:00 2001
From: Randy Heydon <randy.heydon@clockworklab.net>
Date: Sun, 18 May 2025 15:51:33 -0400
Subject: [PATCH] bwclklite: Adjust clkinfo positions for long text.

This copies changes from bwclk into bwclklite.  For reference, see
PR #3845 and commits 83bedcd and 04f3475.

Previously, all text in a clock info entry was centered.  This caused
long lines to spill off both sides of the screen, and entries with
more than two lines to cover the time.  With this change, clock info
text is arranged so it only ever spills off the right and bottom.
This allows the start of any text to always be visible, and the time
to never be covered, regardless of the amount of text.  To achieve
this, multiple lines are now left-aligned instead of center-aligned,
and single lines are wrapped.
---
 apps/bwclklite/ChangeLog     |  1 +
 apps/bwclklite/app.js        | 24 +++++++++++++++++-------
 apps/bwclklite/metadata.json |  2 +-
 3 files changed, 19 insertions(+), 8 deletions(-)

diff --git a/apps/bwclklite/ChangeLog b/apps/bwclklite/ChangeLog
index bba66928b..59020f86c 100644
--- a/apps/bwclklite/ChangeLog
+++ b/apps/bwclklite/ChangeLog
@@ -37,3 +37,4 @@ clkinfo.addInteractive that would cause ReferenceError.
 0.33: Make the border of the clock_info box extend all the way to the right of the screen.
 0.34: Fix issue rendering ClockInfos with for fg+bg color set to the same (#2749)
 0.35: Support 12-hour time format
+0.36: Adjust clock info positions to better fit long text
diff --git a/apps/bwclklite/app.js b/apps/bwclklite/app.js
index 794b39aa9..e6d6b9a9c 100644
--- a/apps/bwclklite/app.js
+++ b/apps/bwclklite/app.js
@@ -101,7 +101,7 @@ let clockInfoMenu = clock_info.addInteractive(clockInfoItems, {
     let hideClkInfo = info.text == null;
 
     g.reset().setBgColor(g.theme.fg).clearRect(options.x, options.y, options.x+options.w, options.y+options.h);
-    g.setFontAlign(0,0).setColor(g.theme.bg);
+    g.setFontAlign(-1,-1).setColor(g.theme.bg);
 
     if (options.focus){
       let y = hideClkInfo ? options.y+20 : options.y+2;
@@ -117,26 +117,36 @@ let clockInfoMenu = clock_info.addInteractive(clockInfoItems, {
       return;
     }
 
-    // Set text and font
+    // Set text and font, compute sizes.
     let image = info.img;
+    let imgWidth = image == null ? 0 : 24;
+    let imgWidthClear = parseInt(imgWidth*1.3);
     let text = String(info.text);
+    let strWidth;
     if(text.split('\n').length > 1){
       g.setFont("6x8"); //g.setMiniFont();
+      strWidth = g.stringWidth(text);
     } else {
       g.setFont("6x8:3"); //g.setSmallFont();
+      strWidth = g.stringWidth(text);
+      if (strWidth+imgWidthClear > options.w) {
+        g.setFont("6x8"); //g.setMiniFont();
+        text = g.wrapString(text, options.w-imgWidthClear).join("\n");
+        strWidth = g.stringWidth(text);
+      }
     }
 
-    // Compute sizes
-    let strWidth = g.stringWidth(text);
-    let imgWidth = image == null ? 0 : 24;
+    // Compute positions
     let midx = options.x+options.w/2;
+    let imgPosX = Math.max(midx-Math.floor(imgWidthClear/2)-parseInt(strWidth/2), 0);
+    let strPosX = imgPosX+imgWidthClear;
 
     // Draw
     if (image) {
       let scale = imgWidth / image.width;
-      g.drawImage(image, midx-parseInt(imgWidth*1.3/2)-parseInt(strWidth/2), options.y+6, {scale: scale});
+      g.drawImage(image, imgPosX, options.y+6, {scale: scale});
     }
-    g.drawString(text, midx+parseInt(imgWidth*1.3/2), options.y+20);
+    g.drawString(text, strPosX, options.y+6);
 
     // In case we are in focus and the focus box changes (fullscreen yes/no)
     // we draw the time again. Otherwise it could happen that a while line is
diff --git a/apps/bwclklite/metadata.json b/apps/bwclklite/metadata.json
index 14af7131c..ef51f72fe 100644
--- a/apps/bwclklite/metadata.json
+++ b/apps/bwclklite/metadata.json
@@ -1,7 +1,7 @@
 {
   "id": "bwclklite",
   "name": "BW Clock Lite",
-  "version": "0.35",
+  "version": "0.36",
   "description": "A very minimalistic clock. This version of BW Clock is quicker at the cost of the custom font.",
   "readme": "README.md",
   "icon": "app.png",