From 8d626dc9c1b4eaa409cdfb058acc9bab4f004ee5 Mon Sep 17 00:00:00 2001 From: Corwin Kerr Date: Sun, 1 Dec 2024 15:13:21 -0500 Subject: [PATCH 01/12] clock_info: Expose internal blur function as force_blur ...so an external action like hiding widgets with widclkinfo can unfocus the clock info. This always decrements Bangle.CLKINFO_FOCUS, so in the future we should only call force_blur if we know the Clock Info is focused. We could provide a different function ensure_blur. --- apps/clock_info/lib.js | 3 +++ 1 file changed, 3 insertions(+) diff --git a/apps/clock_info/lib.js b/apps/clock_info/lib.js index 0e20ab8555..9225d7803e 100644 --- a/apps/clock_info/lib.js +++ b/apps/clock_info/lib.js @@ -299,12 +299,15 @@ exports.addInteractive = function(menu, options) { const blur = () => { options.focus=false; Bangle.CLKINFO_FOCUS--; + // if (Bangle.CLKINFO_FOCUS < 0) Bangle.CLKINFO_FOCUS = 0; const itm = menu[options.menuA].items[options.menuB]; let redraw = true; if (itm.blur && itm.blur(options) === false) redraw = false; if (redraw) options.redraw(); }; + // better to only call blur when we know it's focused. Maybe we can rename force_blur to ensure_blur. + options.force_blur = blur; const focus = () => { let redraw = true; Bangle.CLKINFO_FOCUS = (0 | Bangle.CLKINFO_FOCUS) + 1; From 0d4d1b8fe44cdba9b5220eea9830be01d61eb676 Mon Sep 17 00:00:00 2001 From: Corwin Kerr Date: Sun, 1 Dec 2024 15:13:42 -0500 Subject: [PATCH 02/12] widget_utils: Add shown and hidden events This can help widgets, such as widclkinfo, know when they are on screen. --- modules/widget_utils.js | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/modules/widget_utils.js b/modules/widget_utils.js index 4f9b858358..c64c9df2ad 100644 --- a/modules/widget_utils.js +++ b/modules/widget_utils.js @@ -132,9 +132,11 @@ exports.swipeOn = function(autohide) { if (dir>0 && exports.offset>=0) { // fully down stop = true; exports.offset = 0; + exports.emit("shown"); } else if (dir<0 && exports.offset<-23) { // fully up stop = true; exports.offset = -24; + exports.emit("hidden"); } if (stop) { clearInterval(exports.animInterval); @@ -161,4 +163,4 @@ exports.swipeOn = function(autohide) { }; Bangle.on("swipe", exports.swipeHandler); Bangle.drawWidgets(); -}; \ No newline at end of file +}; From a90607524a44b248e57068c09b998fa9151ea961 Mon Sep 17 00:00:00 2001 From: Corwin Kerr Date: Sun, 1 Dec 2024 15:14:25 -0500 Subject: [PATCH 03/12] widclkinfo: work in progress: Be aware of widget_utils.swipeOn TODO: disable these changes when widget_utils are not being used. Use new (prototype) widget_utils events to blur and set offscreen the clock info when the widgets are hidden. This prevents activating or further interacting with the widclkinfo. --- apps/widclkinfo/widget.js | 49 ++++++++++++++++++++++++++++++--------- 1 file changed, 38 insertions(+), 11 deletions(-) diff --git a/apps/widclkinfo/widget.js b/apps/widclkinfo/widget.js index d51f0563fb..ff0d233e7c 100644 --- a/apps/widclkinfo/widget.js +++ b/apps/widclkinfo/widget.js @@ -1,20 +1,30 @@ if (!require("clock_info").loadCount) { // don't load if a clock_info was already loaded // Load the clock infos - let clockInfoItems = require("clock_info").load(); - // Add the - let clockInfoMenu = require("clock_info").addInteractive(clockInfoItems, { - app : "widclkinfo", + let clockInfoItems = clock_info.load(); + + // TODO only do checks if widget_utils.swipeOn is being used + let wuo = widget_utils.offset; + + let clockInfoMenu = clock_info.addInteractive(clockInfoItems, { + app: "widclkinfo", // Add the dimensions we're rendering to here - these are used to detect taps on the clock info area - x : 0, y: 0, w: 72, h:24, + x: 0, + y: 0, // maybe set offset to initial offset + w: 72, + h: 24, // You can add other information here you want to be passed into 'options' in 'draw' // This function draws the info - draw : (itm, info, options) => { + draw: (itm, info, options) => { // itm: the item containing name/hasRange/etc // info: data returned from itm.get() containing text/img/etc // options: options passed into addInteractive clockInfoInfo = info; - if (WIDGETS["clkinfo"]) + wuo = 0 | widget_utils.offset; + clockInfoMenu.y = options.y + wuo; + if (WIDGETS["clkinfo"]) { WIDGETS["clkinfo"].draw(WIDGETS["clkinfo"]); + console.log("Clock Info was updated, thus drawing widget."); + } } }); let clockInfoInfo; // when clockInfoMenu.draw is called we set this up @@ -25,12 +35,12 @@ if (!require("clock_info").loadCount) { // don't load if a clock_info was alread width: clockInfoMenu.w, draw:function(e) { clockInfoMenu.x = e.x; - clockInfoMenu.y = e.y; + wuo = 0 | widget_utils.offset; + clockInfoMenu.y = e.y + wuo; var o = clockInfoMenu; // Clear the background g.reset(); - // indicate focus - make background reddish - //if (clockInfoMenu.focus) g.setBgColor(g.blendColor(g.theme.bg, "#f00", 0.25)); + // indicate focus if (clockInfoMenu.focus) g.setColor("#f00"); g.clearRect(o.x, o.y, o.x+o.w-1, o.y+o.h-1); if (clockInfoInfo) { @@ -47,4 +57,21 @@ if (!require("clock_info").loadCount) { // don't load if a clock_info was alread } } }; -} \ No newline at end of file + + widget_utils.on("hidden", () => { + console.log("hidden"); + clockInfoMenu.y = -24; + clockInfoMenu.force_blur(); // needs to be here so it doesn't stay the focused color + if (clockInfoMenu.focus) { + //clockInfoMenu.force_blur(); + console.log("Forced blur bc hidden"); + } + }); + + widget_utils.on("shown", () => { + clockInfoMenu.y = 0; + console.log("shown"); + if (WIDGETS["clkinfo"]) { + WIDGETS["clkinfo"].draw(WIDGETS["clkinfo"]); + } + }); From 9ec6acc25e91c4a2d2739bf536a6ba58a85e75c6 Mon Sep 17 00:00:00 2001 From: Corwin Kerr Date: Sun, 1 Dec 2024 18:47:03 -0500 Subject: [PATCH 04/12] Suggestions from review: emit events from Bangle and moving force_blur calls --- apps/widclkinfo/widget.js | 3 +-- modules/widget_utils.js | 15 +++++++++++---- 2 files changed, 12 insertions(+), 6 deletions(-) diff --git a/apps/widclkinfo/widget.js b/apps/widclkinfo/widget.js index ff0d233e7c..7771617c48 100644 --- a/apps/widclkinfo/widget.js +++ b/apps/widclkinfo/widget.js @@ -61,9 +61,8 @@ if (!require("clock_info").loadCount) { // don't load if a clock_info was alread widget_utils.on("hidden", () => { console.log("hidden"); clockInfoMenu.y = -24; - clockInfoMenu.force_blur(); // needs to be here so it doesn't stay the focused color if (clockInfoMenu.focus) { - //clockInfoMenu.force_blur(); + clockInfoMenu.force_blur(); console.log("Forced blur bc hidden"); } }); diff --git a/modules/widget_utils.js b/modules/widget_utils.js index c64c9df2ad..2070d23c77 100644 --- a/modules/widget_utils.js +++ b/modules/widget_utils.js @@ -11,6 +11,7 @@ exports.hide = function() { w.area = ""; if (w.x!=undefined) g.clearRect(w.x,w.y,w.x+w.width-1,w.y+23); } + // TODO: do we need to emit event here too? }; /// Show any hidden widgets @@ -132,11 +133,11 @@ exports.swipeOn = function(autohide) { if (dir>0 && exports.offset>=0) { // fully down stop = true; exports.offset = 0; - exports.emit("shown"); + Bangle.emit("widgets-shown"); } else if (dir<0 && exports.offset<-23) { // fully up stop = true; exports.offset = -24; - exports.emit("hidden"); + Bangle.emit("widgets-hidden"); } if (stop) { clearInterval(exports.animInterval); @@ -158,8 +159,14 @@ exports.swipeOn = function(autohide) { anim(-4); }, exports.autohide); }; - if (ud>0 && exports.offset<0) anim(4, cb); - if (ud<0 && exports.offset>-24) anim(-4); + if (ud>0 && exports.offset<0) { + Bangle.emit("widgets-start-show"); + anim(4, cb); + } + if (ud<0 && exports.offset>-24) { + Bangle.emit("widgets-start-hide"); + anim(-4); + } }; Bangle.on("swipe", exports.swipeHandler); Bangle.drawWidgets(); From 73cf05318b54d74a65e4d9a294f706aba6424825 Mon Sep 17 00:00:00 2001 From: Corwin Kerr Date: Sun, 1 Dec 2024 23:23:49 -0500 Subject: [PATCH 05/12] Also emit event when autohiding --- modules/widget_utils.js | 1 + 1 file changed, 1 insertion(+) diff --git a/modules/widget_utils.js b/modules/widget_utils.js index 2070d23c77..ae3bdb0479 100644 --- a/modules/widget_utils.js +++ b/modules/widget_utils.js @@ -156,6 +156,7 @@ exports.swipeOn = function(autohide) { let cb; if (exports.autohide > 0) cb = function() { exports.hideTimeout = setTimeout(function() { + Bangle.emit("widgets-start-hide"); anim(-4); }, exports.autohide); }; From 6cf3393edc176bebc236242e1c58c7ef28266d2d Mon Sep 17 00:00:00 2001 From: Corwin Kerr Date: Sun, 1 Dec 2024 23:37:12 -0500 Subject: [PATCH 06/12] Listen for widget events from Bangle --- apps/widclkinfo/widget.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/apps/widclkinfo/widget.js b/apps/widclkinfo/widget.js index 7771617c48..0d025d21ed 100644 --- a/apps/widclkinfo/widget.js +++ b/apps/widclkinfo/widget.js @@ -58,7 +58,7 @@ if (!require("clock_info").loadCount) { // don't load if a clock_info was alread } }; - widget_utils.on("hidden", () => { + Bangle.on("hidden", () => { console.log("hidden"); clockInfoMenu.y = -24; if (clockInfoMenu.focus) { @@ -67,7 +67,7 @@ if (!require("clock_info").loadCount) { // don't load if a clock_info was alread } }); - widget_utils.on("shown", () => { + Bangle.on("shown", () => { clockInfoMenu.y = 0; console.log("shown"); if (WIDGETS["clkinfo"]) { From 8ddfeaba715c6ef5875195c8b64cb1f9525c7dc4 Mon Sep 17 00:00:00 2001 From: Corwin Kerr Date: Fri, 13 Dec 2024 00:18:32 -0500 Subject: [PATCH 07/12] widget_utils: Emit shown and hidden events on show and hide functions --- modules/widget_utils.js | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/modules/widget_utils.js b/modules/widget_utils.js index ae3bdb0479..2aede66758 100644 --- a/modules/widget_utils.js +++ b/modules/widget_utils.js @@ -11,7 +11,7 @@ exports.hide = function() { w.area = ""; if (w.x!=undefined) g.clearRect(w.x,w.y,w.x+w.width-1,w.y+23); } - // TODO: do we need to emit event here too? + Bangle.emit("widgets-hidden"); }; /// Show any hidden widgets @@ -26,6 +26,7 @@ exports.show = function() { delete w._area; w.draw(w); } + Bangle.emit("widgets-shown"); }; /// Remove anything not needed if the overlay was removed From 37cc547e4d213ec83ca147ca66a3a02028f30b54 Mon Sep 17 00:00:00 2001 From: Corwin Kerr Date: Fri, 13 Dec 2024 00:20:22 -0500 Subject: [PATCH 08/12] widclkinfo: Remove references to widget_utils --- apps/widclkinfo/widget.js | 9 ++------- 1 file changed, 2 insertions(+), 7 deletions(-) diff --git a/apps/widclkinfo/widget.js b/apps/widclkinfo/widget.js index 0d025d21ed..25323a3d84 100644 --- a/apps/widclkinfo/widget.js +++ b/apps/widclkinfo/widget.js @@ -2,9 +2,6 @@ if (!require("clock_info").loadCount) { // don't load if a clock_info was alread // Load the clock infos let clockInfoItems = clock_info.load(); - // TODO only do checks if widget_utils.swipeOn is being used - let wuo = widget_utils.offset; - let clockInfoMenu = clock_info.addInteractive(clockInfoItems, { app: "widclkinfo", // Add the dimensions we're rendering to here - these are used to detect taps on the clock info area @@ -19,9 +16,8 @@ if (!require("clock_info").loadCount) { // don't load if a clock_info was alread // info: data returned from itm.get() containing text/img/etc // options: options passed into addInteractive clockInfoInfo = info; - wuo = 0 | widget_utils.offset; - clockInfoMenu.y = options.y + wuo; if (WIDGETS["clkinfo"]) { + clockInfoMenu.y = options.y; WIDGETS["clkinfo"].draw(WIDGETS["clkinfo"]); console.log("Clock Info was updated, thus drawing widget."); } @@ -35,8 +31,7 @@ if (!require("clock_info").loadCount) { // don't load if a clock_info was alread width: clockInfoMenu.w, draw:function(e) { clockInfoMenu.x = e.x; - wuo = 0 | widget_utils.offset; - clockInfoMenu.y = e.y + wuo; + clockInfoMenu.y = e.y; var o = clockInfoMenu; // Clear the background g.reset(); From adfd5c857b20decb236a00463e5896e435ba62f9 Mon Sep 17 00:00:00 2001 From: Corwin Kerr Date: Fri, 13 Dec 2024 00:24:23 -0500 Subject: [PATCH 09/12] widclkinfo: cleanup event listeners --- apps/widclkinfo/widget.js | 32 +++++++++++++++++++++++++------- 1 file changed, 25 insertions(+), 7 deletions(-) diff --git a/apps/widclkinfo/widget.js b/apps/widclkinfo/widget.js index 25323a3d84..299e598f2d 100644 --- a/apps/widclkinfo/widget.js +++ b/apps/widclkinfo/widget.js @@ -53,19 +53,37 @@ if (!require("clock_info").loadCount) { // don't load if a clock_info was alread } }; - Bangle.on("hidden", () => { - console.log("hidden"); + Bangle.on("widgets-start-show", () => { + clockInfoMenu.y = 0; + if (WIDGETS["clkinfo"]) { + WIDGETS["clkinfo"].draw(WIDGETS["clkinfo"]); + } + }) + + Bangle.on("widgets-shown", () => { + clockInfoMenu.y = 0; + if (WIDGETS["clkinfo"]) { + WIDGETS["clkinfo"].draw(WIDGETS["clkinfo"]); + } + }); + + Bangle.on("widgets-start-hide", () => { clockInfoMenu.y = -24; + if (WIDGETS["clkinfo"]) { + WIDGETS["clkinfo"].draw(WIDGETS["clkinfo"]); + } if (clockInfoMenu.focus) { - clockInfoMenu.force_blur(); - console.log("Forced blur bc hidden"); + clockInfoMenu.blur(); } }); - Bangle.on("shown", () => { - clockInfoMenu.y = 0; - console.log("shown"); + Bangle.on("widgets-hidden", () => { + clockInfoMenu.y = -24; if (WIDGETS["clkinfo"]) { WIDGETS["clkinfo"].draw(WIDGETS["clkinfo"]); } + // check here too in case widget_utils.hide() is called + if (clockInfoMenu.focus) { + clockInfoMenu.blur(); + } }); From 6aa44dc3b396dff986595eb11f871b26f26f5d0e Mon Sep 17 00:00:00 2001 From: Corwin Kerr Date: Fri, 13 Dec 2024 00:25:03 -0500 Subject: [PATCH 10/12] widclkinfo: move draw function definition. Key change to function: not setting `clockInfoMenu.y = e.y` --- apps/widclkinfo/widget.js | 49 +++++++++++++++++++++------------------ 1 file changed, 26 insertions(+), 23 deletions(-) diff --git a/apps/widclkinfo/widget.js b/apps/widclkinfo/widget.js index 299e598f2d..6c05212d33 100644 --- a/apps/widclkinfo/widget.js +++ b/apps/widclkinfo/widget.js @@ -24,33 +24,36 @@ if (!require("clock_info").loadCount) { // don't load if a clock_info was alread } }); let clockInfoInfo; // when clockInfoMenu.draw is called we set this up + let draw = function(e) { + clockInfoMenu.x = e.x; + var o = clockInfoMenu; + // Clear the background + g.reset(); + // indicate focus + if (clockInfoMenu.focus) { + g.setColor("#f00"); + } + g.clearRect(o.x, o.y, o.x + o.w - 1, o.y + o.h - 1); + + if (clockInfoInfo) { + var x = o.x; + if (clockInfoInfo.img) { + g.drawImage(clockInfoInfo.img, x, o.y); // draw the image + x += 24; + } + var availableWidth = o.x + clockInfoMenu.w - (x + 2); + g.setFont("6x8:2").setFontAlign(-1, 0); + if (g.stringWidth(clockInfoInfo.text) > availableWidth) + g.setFont("6x8:1x2"); + g.drawString(clockInfoInfo.text, x + 2, o.y + 12); // draw the text + } + }; // The actual widget we're displaying WIDGETS["clkinfo"] = { - area:"tl", + area: "tl", width: clockInfoMenu.w, - draw:function(e) { - clockInfoMenu.x = e.x; - clockInfoMenu.y = e.y; - var o = clockInfoMenu; - // Clear the background - g.reset(); - // indicate focus - if (clockInfoMenu.focus) g.setColor("#f00"); - g.clearRect(o.x, o.y, o.x+o.w-1, o.y+o.h-1); - if (clockInfoInfo) { - var x = o.x; - if (clockInfoInfo.img) { - g.drawImage(clockInfoInfo.img, x,o.y); // draw the image - x+=24; - } - var availableWidth = o.x+clockInfoMenu.w - (x+2); - g.setFont("6x8:2").setFontAlign(-1,0); - if (g.stringWidth(clockInfoInfo.text) > availableWidth) - g.setFont("6x8:1x2"); - g.drawString(clockInfoInfo.text, x+2,o.y+12); // draw the text - } - } + draw: draw }; Bangle.on("widgets-start-show", () => { From 8e0d06088178884feb6dc0e6d6d6d5c72281250e Mon Sep 17 00:00:00 2001 From: Corwin Kerr Date: Fri, 13 Dec 2024 00:28:05 -0500 Subject: [PATCH 11/12] widclkinfo: Don't redraw widget if its clock_info is off screen I think it's okay to not update the clock_info in this case because they are designed to be on screen. --- apps/widclkinfo/widget.js | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/apps/widclkinfo/widget.js b/apps/widclkinfo/widget.js index 6c05212d33..ece03aa91b 100644 --- a/apps/widclkinfo/widget.js +++ b/apps/widclkinfo/widget.js @@ -6,7 +6,7 @@ if (!require("clock_info").loadCount) { // don't load if a clock_info was alread app: "widclkinfo", // Add the dimensions we're rendering to here - these are used to detect taps on the clock info area x: 0, - y: 0, // maybe set offset to initial offset + y: -24, // TODO how know if offscreen to start? w: 72, h: 24, // You can add other information here you want to be passed into 'options' in 'draw' @@ -16,13 +16,13 @@ if (!require("clock_info").loadCount) { // don't load if a clock_info was alread // info: data returned from itm.get() containing text/img/etc // options: options passed into addInteractive clockInfoInfo = info; - if (WIDGETS["clkinfo"]) { clockInfoMenu.y = options.y; + if (WIDGETS["clkinfo"] && clockInfoMenu.y > -24) { WIDGETS["clkinfo"].draw(WIDGETS["clkinfo"]); - console.log("Clock Info was updated, thus drawing widget."); } } }); + let clockInfoInfo; // when clockInfoMenu.draw is called we set this up let draw = function(e) { clockInfoMenu.x = e.x; From 0d4234dee8564170c6459b894c32591e338823fa Mon Sep 17 00:00:00 2001 From: Corwin Kerr Date: Fri, 13 Dec 2024 00:32:09 -0500 Subject: [PATCH 12/12] widclkinfo: balance brackets --- apps/widclkinfo/widget.js | 1 + 1 file changed, 1 insertion(+) diff --git a/apps/widclkinfo/widget.js b/apps/widclkinfo/widget.js index ece03aa91b..23d73783e3 100644 --- a/apps/widclkinfo/widget.js +++ b/apps/widclkinfo/widget.js @@ -90,3 +90,4 @@ if (!require("clock_info").loadCount) { // don't load if a clock_info was alread clockInfoMenu.blur(); } }); +}