diff --git a/apps/elapsed_t/README.md b/apps/elapsed_t/README.md index b085cd70f..f0c72a607 100644 --- a/apps/elapsed_t/README.md +++ b/apps/elapsed_t/README.md @@ -1,5 +1,5 @@ # Elapsed Time Clock -A clock that calculates the time difference between now (in blue) and any given target date (in red). +A clock that calculates the time difference between now (in blue/cyan) and any given target date (in red/orange). The results is show in years, months, days, hours, minutes, seconds. To save battery life, the seconds are shown only when the watch is unlocked, or can be disabled entirely. @@ -8,6 +8,7 @@ The time difference is positive if the target date is in the past and negative i ![Screenshot 1](screenshot1.png) ![Screenshot 2](screenshot2.png) ![Screenshot 3](screenshot3.png) +![Screenshot 4](screenshot4.png) # Settings ## Time and date formats: diff --git a/apps/elapsed_t/app.js b/apps/elapsed_t/app.js index 225f20c63..f799c4f4c 100644 --- a/apps/elapsed_t/app.js +++ b/apps/elapsed_t/app.js @@ -1,15 +1,16 @@ const APP_NAME = "elapsed_t"; -const COLOUR_BLACK = 0x0; -const COLOUR_DARK_GREY = 0x4208; // same as: g.setColor(0.25, 0.25, 0.25) +//const COLOUR_BLACK = 0x0; +//const COLOUR_DARK_GREY = 0x4208; // same as: g.setColor(0.25, 0.25, 0.25) const COLOUR_GREY = 0x8410; // same as: g.setColor(0.5, 0.5, 0.5) const COLOUR_LIGHT_GREY = 0xc618; // same as: g.setColor(0.75, 0.75, 0.75) const COLOUR_RED = 0xf800; // same as: g.setColor(1, 0, 0) const COLOUR_BLUE = 0x001f; // same as: g.setColor(0, 0, 1) -const COLOUR_YELLOW = 0xffe0; // same as: g.setColor(1, 1, 0) -const COLOUR_LIGHT_CYAN = 0x87ff; // same as: g.setColor(0.5, 1, 1) -const COLOUR_DARK_YELLOW = 0x8400; // same as: g.setColor(0.5, 0.5, 0) -const COLOUR_DARK_CYAN = 0x0410; // same as: g.setColor(0, 0.5, 0.5) +//const COLOUR_YELLOW = 0xffe0; // same as: g.setColor(1, 1, 0) +//const COLOUR_LIGHT_CYAN = 0x87ff; // same as: g.setColor(0.5, 1, 1) +//const COLOUR_DARK_YELLOW = 0x8400; // same as: g.setColor(0.5, 0.5, 0) +//const COLOUR_DARK_CYAN = 0x0410; // same as: g.setColor(0, 0.5, 0.5) +const COLOUR_CYAN = "#00FFFF"; const COLOUR_ORANGE = 0xfc00; // same as: g.setColor(1, 0.5, 0) const SCREEN_WIDTH = g.getWidth(); @@ -376,53 +377,53 @@ function draw() { let y = 24; //Bangle.getAppRect().y; // draw current date - g.setFont("Vector", SMALL_FONT_SIZE).setFontAlign(-1, -1).setColor(COLOUR_BLUE); + g.setFont("Vector", SMALL_FONT_SIZE).setFontAlign(-1, -1).setColor(g.theme.dark ? COLOUR_CYAN : COLOUR_BLUE); g.drawString(nowFormatted.date, 4, y); y += SMALL_FONT_SIZE; // draw current time - g.setFont("Vector", SMALL_FONT_SIZE).setFontAlign(-1, -1).setColor(COLOUR_BLUE); + g.setFont("Vector", SMALL_FONT_SIZE).setFontAlign(-1, -1).setColor(g.theme.dark ? COLOUR_CYAN : COLOUR_BLUE); g.drawString(nowFormatted.time, 4, y); y += SMALL_FONT_SIZE; // draw arrow - g.setFontCustom(arrowFont, 62, 16, 13).setFontAlign(-1, -1).setColor(COLOUR_RED); + g.setFontCustom(arrowFont, 62, 16, 13).setFontAlign(-1, -1).setColor(g.theme.dark ? COLOUR_ORANGE : COLOUR_RED); g.drawString(">", 4, y + 3); if (data.target.isSet) { // draw target date - g.setFont("Vector", SMALL_FONT_SIZE).setFontAlign(-1, -1).setColor(COLOUR_RED); + g.setFont("Vector", SMALL_FONT_SIZE).setFontAlign(-1, -1).setColor(g.theme.dark ? COLOUR_ORANGE : COLOUR_RED); g.drawString(targetFormatted.date, 4 + 16 + 6, y); y += SMALL_FONT_SIZE; // draw target time - g.setFont("Vector", SMALL_FONT_SIZE).setFontAlign(-1, -1).setColor(COLOUR_RED); + g.setFont("Vector", SMALL_FONT_SIZE).setFontAlign(-1, -1).setColor(g.theme.dark ? COLOUR_ORANGE : COLOUR_RED); g.drawString(targetFormatted.time, 4, y); y += SMALL_FONT_SIZE + 4; } else { // draw NOT SET - g.setFont("Vector", SMALL_FONT_SIZE).setFontAlign(-1, -1).setColor(COLOUR_RED); + g.setFont("Vector", SMALL_FONT_SIZE).setFontAlign(-1, -1).setColor(g.theme.dark ? COLOUR_ORANGE : COLOUR_RED); g.drawString("NOT SET", 4 + 16 + 6, y); y += 2 * SMALL_FONT_SIZE + 4; } // draw separator - g.setColor(COLOUR_BLACK); + g.setColor(g.theme.fg); g.drawLine(0, y - 4, SCREEN_WIDTH, y - 4); // draw diffYMD - g.setFont("Vector", SMALL_FONT_SIZE).setFontAlign(0, -1).setColor(COLOUR_BLACK); + g.setFont("Vector", SMALL_FONT_SIZE).setFontAlign(0, -1).setColor(g.theme.fg); g.drawString(diffYMD, SCREEN_WIDTH / 2, y); y += SMALL_FONT_SIZE; // draw diff_hhmm - g.setFont("Vector", BIG_FONT_SIZE).setFontAlign(0, -1).setColor(COLOUR_BLACK); + g.setFont("Vector", BIG_FONT_SIZE).setFontAlign(0, -1).setColor(g.theme.fg); g.drawString(diff_hhmm, SCREEN_WIDTH / 2, y); // draw diff_ss if (temp_displaySeconds) { - g.setFont("Vector", SMALL_FONT_SIZE).setFontAlign(-1, -1).setColor(COLOUR_GREY); + g.setFont("Vector", SMALL_FONT_SIZE).setFontAlign(-1, -1).setColor(g.theme.dark ? COLOUR_LIGHT_GREY : COLOUR_GREY); g.drawString(diff.ss, SCREEN_WIDTH / 2 + 52, y + 13); } diff --git a/apps/elapsed_t/metadata.json b/apps/elapsed_t/metadata.json index 0431ce1d3..fe9af630f 100644 --- a/apps/elapsed_t/metadata.json +++ b/apps/elapsed_t/metadata.json @@ -15,6 +15,6 @@ "data": [{"name":"elapsed_t.data.json"}], "icon": "app.png", "readme": "README.md", - "screenshots": [{ "url": "screenshot1.png" }, { "url": "screenshot2.png" }, { "url": "screenshot3.png" }], + "screenshots": [{ "url": "screenshot1.png" }, { "url": "screenshot2.png" }, { "url": "screenshot3.png" }, { "url": "screenshot4.png" }], "allow_emulator":true } diff --git a/apps/elapsed_t/screenshot2.png b/apps/elapsed_t/screenshot2.png index e2a10ab62..67dd4f186 100644 Binary files a/apps/elapsed_t/screenshot2.png and b/apps/elapsed_t/screenshot2.png differ diff --git a/apps/elapsed_t/screenshot4.png b/apps/elapsed_t/screenshot4.png new file mode 100644 index 000000000..e2a10ab62 Binary files /dev/null and b/apps/elapsed_t/screenshot4.png differ