From 8903215f3b0071a9ca48f06d0797bcbb69fbe894 Mon Sep 17 00:00:00 2001 From: michele Date: Fri, 1 Nov 2024 15:38:01 +0100 Subject: [PATCH 1/7] tinyhead: change widget bg and fg colour so that widgets blend in with the rest of the face --- apps/tinyheads/app.js | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/apps/tinyheads/app.js b/apps/tinyheads/app.js index a3f79c081..492929f10 100644 --- a/apps/tinyheads/app.js +++ b/apps/tinyheads/app.js @@ -214,6 +214,8 @@ }; let init = function init() { + g.setTheme({bg:lib.settings.hairColour,fg:lib.settings.faceColour,dark:true}).clear(); + Bangle.on('lock', lockHandler); Bangle.on('charging', chargingHandler); if (lib.settings.btStatusEyes) { @@ -227,7 +229,7 @@ activeEyesNum = disconnectedEyes; } - Bangle.setUI({ + Bangle.setUI("clock", { mode:"custom", clock: true, touch: (button, xy) => { From 71f3f6930469d81d27699b5bec3d4feb9963b223 Mon Sep 17 00:00:00 2001 From: michele Date: Fri, 1 Nov 2024 17:06:33 +0100 Subject: [PATCH 2/7] tinyhead: change the side screen's colour, so it blends in with the rest of the face --- apps/tinyheads/lib.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/apps/tinyheads/lib.js b/apps/tinyheads/lib.js index cbb139d8c..1c4ee42a5 100644 --- a/apps/tinyheads/lib.js +++ b/apps/tinyheads/lib.js @@ -135,7 +135,7 @@ exports.drawFace = function(scale, eyesNum, mouthNum, peek, offset) { // Draw face let xOffset = (g.getWidth() - (exports.faceW * scale)) / 2; let yOffset = (offset ? offset : 0) + ((g.getHeight() - (exports.faceH * scale)) / 2); - g.setBgColor(0, 0, 0); + g.setBgColor(settings.hairColour); g.clearRect(Bangle.appRect); g.setClipRect(Bangle.appRect.x, Bangle.appRect.y, Bangle.appRect.x2, Bangle.appRect.y2); From 9306de32eb1afb1f8c989d9615477529b9c422d1 Mon Sep 17 00:00:00 2001 From: michele Date: Fri, 1 Nov 2024 17:51:37 +0100 Subject: [PATCH 3/7] tinyhead: fix the touch handler --- apps/tinyheads/app.js | 7 +++++-- 1 file changed, 5 insertions(+), 2 deletions(-) diff --git a/apps/tinyheads/app.js b/apps/tinyheads/app.js index 492929f10..c38ac2421 100644 --- a/apps/tinyheads/app.js +++ b/apps/tinyheads/app.js @@ -22,7 +22,8 @@ let helpShown = false; let tapCount = 0; let centerX, centerY, minuteHandLength, hourHandLength, handOutline; - + let originalTheme = Object.assign({}, g.theme); + // Open the eyes and schedule the next blink let blinkOpen = function blinkOpen() { if (blinkTimeout) clearTimeout(blinkTimeout); @@ -229,13 +230,14 @@ activeEyesNum = disconnectedEyes; } - Bangle.setUI("clock", { + Bangle.setUI({ mode:"custom", clock: true, touch: (button, xy) => { // Go direct to feature select in settings on long screen press if (xy.type == 2) { eval(require("Storage").read("tinyheads.settings.js"))(()=> { + g.setTheme(originalTheme); E.showMenu(); init(); }, true, helpShown); @@ -253,6 +255,7 @@ } }, remove: function() { + g.setTheme(originalTheme); // Clear timeouts and listeners for fast loading if (drawTimeout) clearTimeout(drawTimeout); if (blinkTimeout) clearTimeout(blinkTimeout); From 4faaf29f830e3b93058420fc148337ce3e8890e3 Mon Sep 17 00:00:00 2001 From: michele Date: Fri, 1 Nov 2024 17:53:01 +0100 Subject: [PATCH 4/7] tinyhead: fix variable reference --- apps/tinyheads/lib.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/apps/tinyheads/lib.js b/apps/tinyheads/lib.js index 1c4ee42a5..a80f1059a 100644 --- a/apps/tinyheads/lib.js +++ b/apps/tinyheads/lib.js @@ -135,7 +135,7 @@ exports.drawFace = function(scale, eyesNum, mouthNum, peek, offset) { // Draw face let xOffset = (g.getWidth() - (exports.faceW * scale)) / 2; let yOffset = (offset ? offset : 0) + ((g.getHeight() - (exports.faceH * scale)) / 2); - g.setBgColor(settings.hairColour); + g.setBgColor(exports.settings.hairColour); g.clearRect(Bangle.appRect); g.setClipRect(Bangle.appRect.x, Bangle.appRect.y, Bangle.appRect.x2, Bangle.appRect.y2); From 97113d14be0b2ad672262c23e87f6be16788fcfe Mon Sep 17 00:00:00 2001 From: michele Date: Sun, 3 Nov 2024 14:32:01 +0100 Subject: [PATCH 5/7] tinyeads: show the side bands of the same color of the hair only when the widgets are showing --- apps/tinyheads/lib.js | 8 +++++++- 1 file changed, 7 insertions(+), 1 deletion(-) diff --git a/apps/tinyheads/lib.js b/apps/tinyheads/lib.js index a80f1059a..d772e208d 100644 --- a/apps/tinyheads/lib.js +++ b/apps/tinyheads/lib.js @@ -135,7 +135,13 @@ exports.drawFace = function(scale, eyesNum, mouthNum, peek, offset) { // Draw face let xOffset = (g.getWidth() - (exports.faceW * scale)) / 2; let yOffset = (offset ? offset : 0) + ((g.getHeight() - (exports.faceH * scale)) / 2); - g.setBgColor(exports.settings.hairColour); + + if (exports.settings.showWidgets == 'on' || (exports.settings.showWidgets == 'unlock' && !Bangle.isLocked())) { + g.setBgColor(exports.settings.hairColour); + } else { + g.setBgColor(0,0,0); + } + g.clearRect(Bangle.appRect); g.setClipRect(Bangle.appRect.x, Bangle.appRect.y, Bangle.appRect.x2, Bangle.appRect.y2); From c094d33ef47977cc75742ef232b4432731d05b1e Mon Sep 17 00:00:00 2001 From: michele Date: Mon, 4 Nov 2024 23:10:58 +0100 Subject: [PATCH 6/7] tinyhead: fix background colour on the settings screen --- apps/tinyheads/app.js | 4 ++-- apps/tinyheads/lib.js | 13 +++++++++++-- apps/tinyheads/settings.js | 2 +- 3 files changed, 14 insertions(+), 5 deletions(-) diff --git a/apps/tinyheads/app.js b/apps/tinyheads/app.js index c38ac2421..fb5c1a9cb 100644 --- a/apps/tinyheads/app.js +++ b/apps/tinyheads/app.js @@ -5,8 +5,7 @@ // Read 12/24 from system settings const is12Hour=(require("Storage").readJSON("setting.json",1)||{})["12hour"] || false; - // Tinyhead features are stored at a resolution of 18x21, this scales them to the best fit for the Banglejs2 screen - const scale=9; + const scale=lib.appScale; const closedEyes = 25; const scaredEyes = 26; @@ -215,6 +214,7 @@ }; let init = function init() { + // change the system theme, so that the widget bar blends in with the clock face g.setTheme({bg:lib.settings.hairColour,fg:lib.settings.faceColour,dark:true}).clear(); Bangle.on('lock', lockHandler); diff --git a/apps/tinyheads/lib.js b/apps/tinyheads/lib.js index d772e208d..6ed42f2f4 100644 --- a/apps/tinyheads/lib.js +++ b/apps/tinyheads/lib.js @@ -5,6 +5,14 @@ exports.maxEyes = 25; exports.faceW = 18; exports.faceH = 21; +// Scale used when showing the main clock screen. +// Tinyhead features are stored at a resolution of 18x21, this scales them to the best fit for the Banglejs2 screen +exports.appScale=9; + +// Scale used when showing the face on the settings page. +// It's smaller than on the clock itself, so that selection arrows can be shown down the sides +exports.settingsScale=6; + exports.settingsFile = 'tinyheads.json'; let faceCanvas; @@ -136,10 +144,11 @@ exports.drawFace = function(scale, eyesNum, mouthNum, peek, offset) { let xOffset = (g.getWidth() - (exports.faceW * scale)) / 2; let yOffset = (offset ? offset : 0) + ((g.getHeight() - (exports.faceH * scale)) / 2); - if (exports.settings.showWidgets == 'on' || (exports.settings.showWidgets == 'unlock' && !Bangle.isLocked())) { + // On the main screen, if the widgets are displayed, the background color matches the color of the hair and widget bar + if (scale == exports.appScale && (exports.settings.showWidgets == 'on' || (exports.settings.showWidgets == 'unlock' && !Bangle.isLocked()))) { g.setBgColor(exports.settings.hairColour); } else { - g.setBgColor(0,0,0); + g.setBgColor(0, 0, 0); } g.clearRect(Bangle.appRect); diff --git a/apps/tinyheads/settings.js b/apps/tinyheads/settings.js index 38558bbc2..e9f8bdb2f 100644 --- a/apps/tinyheads/settings.js +++ b/apps/tinyheads/settings.js @@ -6,7 +6,7 @@ let featureColour = 'faceColour'; let colourSelectTimeout; - let scale = 6; // Smaller scale than on the clock itself, so that selection arrows can be shown down the sides + const scale = lib.settingsScale; // 27 colours let colours = [ From c605da645b892572f9f904fd4b896deac06b8ec1 Mon Sep 17 00:00:00 2001 From: michele Date: Tue, 5 Nov 2024 17:32:55 +0100 Subject: [PATCH 7/7] tinyheads: changelog, bump version --- apps/tinyheads/ChangeLog | 1 + apps/tinyheads/metadata.json | 2 +- 2 files changed, 2 insertions(+), 1 deletion(-) diff --git a/apps/tinyheads/ChangeLog b/apps/tinyheads/ChangeLog index 1a3bc1757..581b18b40 100644 --- a/apps/tinyheads/ChangeLog +++ b/apps/tinyheads/ChangeLog @@ -1 +1,2 @@ 0.01: New app! +0.02: Make the widget bar the same colour as the hair. \ No newline at end of file diff --git a/apps/tinyheads/metadata.json b/apps/tinyheads/metadata.json index 3f0e7abf9..6ab060416 100644 --- a/apps/tinyheads/metadata.json +++ b/apps/tinyheads/metadata.json @@ -4,7 +4,7 @@ "shortName":"Tinyheads", "icon": "app.png", "screenshots" : [ { "url":"tinyhead1.png" }, {"url":"tinyhead2.png"}, {"url":"tinyhead3.png"}, {"url":"tinyhead4.png"}, {"url":"editing.png"} ], - "version":"0.01", + "version":"0.02", "description": "Choose from a variety of hairstyles, eyes, noses, and mouths to customize your pixel art style Tinyhead.", "readme":"README.md", "type": "clock",