From 2012e734219e114db07f2f1b165fc5552c5118b4 Mon Sep 17 00:00:00 2001 From: kkayam Date: Mon, 3 Feb 2025 12:27:49 +0300 Subject: [PATCH] added small time on top --- apps/onewordclock/app.js | 219 ++++++++++++++++++++++----------------- 1 file changed, 125 insertions(+), 94 deletions(-) diff --git a/apps/onewordclock/app.js b/apps/onewordclock/app.js index 54119195e..1d18f4666 100644 --- a/apps/onewordclock/app.js +++ b/apps/onewordclock/app.js @@ -1,98 +1,129 @@ -// timeout used to update every minute -var drawTimeout; +{ + // timeout used to update every minute + var drawTimeout; + require('Font4x5Numeric').add(Graphics); -// https://www.espruino.com/Bangle.js+Locale -// schedule a draw for the next 3 minutes -function queueDraw() { - if (drawTimeout) clearTimeout(drawTimeout); - drawTimeout = setTimeout(function () { - drawTimeout = undefined; - draw(); - }, 180000 - (Date.now() % 180000)); -} - -function wordFromHour(h) { - const HOUR_WORDS = [ - "Midnight", "Early", "Quiet", "Still", "Dawn", "Earlybird", - "Sunrise", "Morning", "Bright", "Active", "Busy", "Pre-noon", - "Noon", "Post-noon", "Afternoon", "Siesta", "Breezy", "Evening", - "Twilight", "Dinner", "Cozy", "Relax", "Quietude", "Night" - ]; - - return HOUR_WORDS[h]; -} - -function wordsFromDayMonth(day) { - const DAY_WORD_ARRAY = ["Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"]; - return DAY_WORD_ARRAY[day]; -} - -function draw() { - var x = g.getWidth() / 2; - var y = g.getHeight() / 2; - g.reset(); - - var d = new Date(); - var h = d.getHours(); - var m = d.getMinutes(); - var s = d.getSeconds(); - var day = d.getDay(); - - var timeStr = wordFromHour(h); - var dateStr = wordsFromDayMonth(day); - - // draw time - g.setBgColor(g.theme.bg); - g.clear(); - g.setFontAlign(-1, 0).setFont("Vector", 36); - - // Calculate exact progress through the hour (0 to 1) - var progress = (m + (s / 60)) / 60; - - // Get total width of the word and starting position - var totalWidth = g.stringWidth(timeStr); - var startX = x - totalWidth / 2; - - // Calculate the exact position where the color should change - var colorChangeX = startX + (totalWidth * progress); - - // First draw the entire text in the uncolored version - g.setColor(g.theme.fg2); - g.drawString(timeStr, startX, y); - - // Then draw the colored portion - if (progress > 0) { - g.setClipRect(startX, 0, colorChangeX, g.getHeight()); - g.setColor(g.theme.bg2); - g.drawString(timeStr, startX, y); - // Reset clip rect to full screen - g.setClipRect(0, 0, g.getWidth(), g.getHeight()); - } - - // draw date at bottom of screen - g.setColor(g.theme.fg2); - g.setFontAlign(0, 0).setFont("Vector", 20); - g.drawString(g.wrapString(dateStr, g.getWidth()).join("\n"), x, g.getHeight() - 30); - - queueDraw(); -} - -// Clear the screen once/, at startup -g.clear(); -// draw immediately at first, queue update -draw(); -// Stop updates when LCD is off, restart when on -Bangle.on('lcdPower', on => { - if (on) { - draw(); // draw immediately, queue redraw - } else { // stop draw timer + // https://www.espruino.com/Bangle.js+Locale + // schedule a draw for the next 3 minutes + function queueDraw() { if (drawTimeout) clearTimeout(drawTimeout); - drawTimeout = undefined; + drawTimeout = setTimeout(function () { + drawTimeout = undefined; + draw(); + }, 180000 - (Date.now() % 180000)); } -}); -// Show launcher when middle button pressed -Bangle.setUI("clock"); -// Load widgets -Bangle.loadWidgets(); -Bangle.drawWidgets(); + function wordFromHour(h) { + const HOUR_WORDS = [ + 'Midnight', + 'Early', + 'Quiet', + 'Still', + 'Dawn', + 'Earlybird', + 'Sunrise', + 'Morning', + 'Bright', + 'Active', + 'Busy', + 'Pre-noon', + 'Noon', + 'Post-noon', + 'Afternoon', + 'Siesta', + 'Breezy', + 'Evening', + 'Twilight', + 'Dinner', + 'Cozy', + 'Relax', + 'Quietude', + 'Night', + ]; + + return HOUR_WORDS[h]; + } + + function wordsFromDayMonth(day) { + const DAY_WORD_ARRAY = ['Sunday', 'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday']; + return DAY_WORD_ARRAY[day]; + } + + function draw() { + var x = g.getWidth() / 2; + var y = g.getHeight() / 2; + g.reset(); + + var d = new Date(); + var h = d.getHours(); + var m = d.getMinutes(); + var s = d.getSeconds(); + var day = d.getDay(); + + var timeStr = wordFromHour(h); + var dateStr = wordsFromDayMonth(day); + + // draw time + g.setBgColor(g.theme.bg); + g.clear(); + + // Draw military time at the top + g.setColor(g.theme.bg2); + g.setFontAlign(0, 0).setFont('4x5Numeric', 2); + var militaryTime = ('0' + h).slice(-2) + ('0' + m).slice(-2); + g.drawString(militaryTime, x, 20); + + g.setFontAlign(-1, 0).setFont('Vector', 36); + + // Calculate exact progress through the hour (0 to 1) + var progress = (m + s / 60) / 60; + + // Get total width of the word and starting position + var totalWidth = g.stringWidth(timeStr); + var startX = x - totalWidth / 2; + + // Calculate the exact position where the color should change + var colorChangeX = startX + totalWidth * progress; + + // First draw the entire text in the uncolored version + g.setColor(g.theme.fg2); + g.drawString(timeStr, startX, y); + + // Then draw the colored portion + if (progress > 0) { + g.setClipRect(startX, 0, colorChangeX, g.getHeight()); + g.setColor(g.theme.bg2); + g.drawString(timeStr, startX, y); + // Reset clip rect to full screen + g.setClipRect(0, 0, g.getWidth(), g.getHeight()); + } + + // draw date at bottom of screen + g.setColor(g.theme.fg2); + g.setFontAlign(0, 0).setFont('Vector', 20); + g.drawString(g.wrapString(dateStr, g.getWidth()).join('\n'), x, g.getHeight() - 30); + + queueDraw(); + } + + // Clear the screen once/, at startup + g.clear(); + // draw immediately at first, queue update + draw(); + // Stop updates when LCD is off, restart when on + Bangle.on('lcdPower', (on) => { + if (on) { + draw(); // draw immediately, queue redraw + } else { + // stop draw timer + if (drawTimeout) clearTimeout(drawTimeout); + drawTimeout = undefined; + } + }); + + // Show launcher when middle button pressed + Bangle.setUI('clock'); + // Load widgets + Bangle.loadWidgets(); + Bangle.drawWidgets(); +}