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",