From ea361c6a787cf13e4038ddc207e72d9da1b249d9 Mon Sep 17 00:00:00 2001 From: Mark Hoekstra Date: Fri, 11 Dec 2020 09:27:22 -0700 Subject: [PATCH 1/5] Larger format for single secondary timezone --- apps/worldclock/app.js | 111 ++++++++++++++++++++++++++--------------- 1 file changed, 70 insertions(+), 41 deletions(-) diff --git a/apps/worldclock/app.js b/apps/worldclock/app.js index cdbc29cd8..dbd489c4b 100644 --- a/apps/worldclock/app.js +++ b/apps/worldclock/app.js @@ -1,31 +1,37 @@ /* jshint esversion: 6 */ -const timeFontSize = 6; -const dateFontSize = 3; -const gmtFontSize = 2; + +// Font for primary time and date +const primaryTimeFontSize = 6; +const primaryDateFontSize = 3; + +// Font for single secondary time +const secondaryTimeFontSize = 4; +const secondaryTimeZoneFontSize = 4; + +// Font / columns for multiple secondary times +const secondaryRowColFontSize = 2; +const xcol1 = 10; +const xcol2 = g.getWidth() - xcol1; + const font = "6x8"; const xyCenter = g.getWidth() / 2; -const xcol1=10; -const xcol2=g.getWidth()-xcol1; const yposTime = 75; const yposDate = 130; -//const yposYear = 175; -//const yposGMT = 220; -const yposWorld=170; +const yposWorld = 170; - -var offsets = require("Storage").readJSON("worldclock.settings.json"); +var offsets = require("Storage").readJSON("worldclock.settings.json") || 0; // Check settings for what type our clock should be //var is12Hour = (require("Storage").readJSON("setting.json",1)||{})["12hour"]; -var secondInterval = undefined; +var secondInterval; function doublenum(x) { - return x<10? "0"+x : ""+x; + return x < 10 ? "0" + x : "" + x; } -function offset(dt,offset) { - return new Date(dt.getTime() + (offset*60*60*1000)); +function offset(dt, offset) { + return new Date(dt.getTime() + offset * 60 * 60 * 1000); } function drawSimpleClock() { @@ -33,42 +39,66 @@ function drawSimpleClock() { var d = new Date(); var da = d.toString().split(" "); - g.reset(); // default draw styles + // default draw styles + g.reset(); + // drawSting centered g.setFontAlign(0, 0); // draw time var time = da[4].substr(0, 5).split(":"); - var hours = time[0], minutes = time[1]; + var hours = time[0], + minutes = time[1]; - g.setFont(font, timeFontSize); + g.setFont(font, primaryTimeFontSize); g.drawString(`${hours}:${minutes}`, xyCenter, yposTime, true); // draw Day, name of month, Date var date = [da[0], da[1], da[2]].join(" "); - g.setFont(font, dateFontSize); + g.setFont(font, primaryDateFontSize); g.drawString(date, xyCenter, yposDate, true); - // draw year - //g.setFont(font, dateFontSize); - //g.drawString(d.getFullYear(), xyCenter, yposYear, true); - - // draw gmt - //console.log(d.getTimezoneOffset());//offset to GMT in minutes - var gmt = new Date(d.getTime()+(d.getTimezoneOffset()*60*1000)); - //gmt is now UTC+0 + // set gmt to UTC+0 + var gmt = new Date(d.getTime() + d.getTimezoneOffset() * 60 * 1000); - for (var i=0; i 1 extra timezones, list as columns / rows + g.setFont(font, secondaryRowColFontSize); + g.setFontAlign(-1, 0); + g.drawString(offsets[i][0], xcol1, yposWorld + i * 15, true); + g.setFontAlign(1, 0); + g.drawString(`${hours}:${minutes}`, xcol2, yposWorld + i * 15, true); + } } } @@ -78,11 +108,11 @@ Bangle.loadWidgets(); Bangle.drawWidgets(); // refesh every 15 sec when screen is on -Bangle.on('lcdPower',on=>{ +Bangle.on("lcdPower", (on) => { if (secondInterval) clearInterval(secondInterval); secondInterval = undefined; if (on) { - secondInterval = setInterval(drawSimpleClock, 15E3); + secondInterval = setInterval(drawSimpleClock, 15e3); drawSimpleClock(); // draw immediately } }); @@ -90,9 +120,8 @@ Bangle.on('lcdPower',on=>{ // draw now and every 15 sec until display goes off drawSimpleClock(); if (Bangle.isLCDOn()) { - secondInterval = setInterval(drawSimpleClock, 15E3); + secondInterval = setInterval(drawSimpleClock, 15e3); } // Show launcher when middle button pressed -setWatch(Bangle.showLauncher, BTN2, {repeat:false,edge:"falling"}); - +setWatch(Bangle.showLauncher, BTN2, { repeat: false, edge: "falling" }); From 1d7f2070cffd318b74a42c0392addf48f3dca5fe Mon Sep 17 00:00:00 2001 From: Mark Hoekstra Date: Fri, 11 Dec 2020 10:10:56 -0700 Subject: [PATCH 2/5] bump version from 0.02 to 0.03 --- apps.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/apps.json b/apps.json index f8d73cc7e..739146f4c 100644 --- a/apps.json +++ b/apps.json @@ -2307,7 +2307,7 @@ "name": "World Clock - 4 time zones", "shortName":"World Clock", "icon": "app.png", - "version":"0.02", + "version":"0.03", "description": "Current time zone plus up to four others", "tags": "clock", "type" : "clock", From f6161942c889e8ccdcda7ec3e51ca0e62fcd3930 Mon Sep 17 00:00:00 2001 From: Mark Hoekstra Date: Fri, 11 Dec 2020 11:13:26 -0700 Subject: [PATCH 3/5] Add testing code, refactor for loop --- apps/worldclock/app.js | 77 +++++++++++++++++++++++++++++------------- 1 file changed, 54 insertions(+), 23 deletions(-) diff --git a/apps/worldclock/app.js b/apps/worldclock/app.js index dbd489c4b..9b9c0526b 100644 --- a/apps/worldclock/app.js +++ b/apps/worldclock/app.js @@ -20,7 +20,45 @@ const yposTime = 75; const yposDate = 130; const yposWorld = 170; -var offsets = require("Storage").readJSON("worldclock.settings.json") || 0; +const OFFSET_TIME_ZONE = 0; +const OFFSET_HOURS = 1; + +var offsets = require("Storage").readJSON("worldclock.settings.json") || []; + +// TESTING CODE +// Used to test offset array values during development. +// Uncomment to override secondary offsets value + +const mockOffsets = { + zeroOffsets: [], + oneOffset: [["UTC", 0]], + twoOffsets: [ + ["Tokyo", 9], + ["UTC", 0], + ], + fourOffsets: [ + ["Tokyo", 9], + ["UTC", 0], + ["Denver", -7], + ["Miami", -5], + ], + fiveOffsets: [ + ["Tokyo", 9], + ["UTC", 0], + ["Denver", -7], + ["Chicago", -6], + ["Miami", -5], + ], +}; + +// Uncomment one at a time to test various offsets array scenarios +// offsets = mockOffsets.zeroOffsets; // should render nothing below primary time +// offsets = mockOffsets.oneOffset; // should render larger in two rows +// offsets = mockOffsets.twoOffsets; // should render two in columns +// offsets = mockOffsets.fourOffsets; // should render in columns +// offsets = mockOffsets.fiveOffsets; // should render first four in columns + +// END TESTING CODE // Check settings for what type our clock should be //var is12Hour = (require("Storage").readJSON("setting.json",1)||{})["12hour"]; @@ -30,7 +68,7 @@ function doublenum(x) { return x < 10 ? "0" + x : "" + x; } -function offset(dt, offset) { +function getCurrentTimeFromOffset(dt, offset) { return new Date(dt.getTime() + offset * 60 * 60 * 1000); } @@ -40,7 +78,7 @@ function drawSimpleClock() { var da = d.toString().split(" "); // default draw styles - g.reset(); + g.reset(); // drawSting centered g.setFontAlign(0, 0); @@ -61,21 +99,10 @@ function drawSimpleClock() { // set gmt to UTC+0 var gmt = new Date(d.getTime() + d.getTimezoneOffset() * 60 * 1000); - - // Testing Code to set values during development. - // Uncomment to override secondary offsets value - // offsets = [ - // ["Tokyo", 9], - // ["UTC", 0], - // ]; - - // offsets = [ - // ["UTC", 0], - // ]; // Loop through offset(s) and render - for (var i = 0; i < offsets.length; i++) { - dx = offset(gmt, offsets[i][1]); + offsets.forEach((offset, index) => { + dx = getCurrentTimeFromOffset(gmt, offset[OFFSET_HOURS]); hours = doublenum(dx.getHours()); minutes = doublenum(dx.getMinutes()); @@ -85,21 +112,25 @@ function drawSimpleClock() { g.setFont(font, secondaryTimeFontSize); g.drawString(`${hours}:${minutes}`, xyCenter, yposTime + 100, true); g.setFont(font, secondaryTimeFontSize - 2); - g.drawString(offsets[i][0], xyCenter, yposTime + 130, true); + g.drawString(offset[OFFSET_TIME_ZONE], xyCenter, yposTime + 130, true); // draw Day, name of month, Date g.setFont(font, secondaryTimeZoneFontSize); g.drawString(date, xyCenter, yposDate, true); - - } else { - // For > 1 extra timezones, list as columns / rows + } else if (index < 4) { + // For > 1 extra timezones, render as columns / rows g.setFont(font, secondaryRowColFontSize); g.setFontAlign(-1, 0); - g.drawString(offsets[i][0], xcol1, yposWorld + i * 15, true); + g.drawString( + offset[OFFSET_TIME_ZONE], + xcol1, + yposWorld + index * 15, + true + ); g.setFontAlign(1, 0); - g.drawString(`${hours}:${minutes}`, xcol2, yposWorld + i * 15, true); + g.drawString(`${hours}:${minutes}`, xcol2, yposWorld + index * 15, true); } - } + }); } // clean app screen From 472ede6f383723d842905913d0d69ec1262a0de0 Mon Sep 17 00:00:00 2001 From: Mark Hoekstra Date: Fri, 11 Dec 2020 11:13:38 -0700 Subject: [PATCH 4/5] Comment out mocks --- apps/worldclock/app.js | 42 +++++++++++++++++++++--------------------- 1 file changed, 21 insertions(+), 21 deletions(-) diff --git a/apps/worldclock/app.js b/apps/worldclock/app.js index 9b9c0526b..81078f6d7 100644 --- a/apps/worldclock/app.js +++ b/apps/worldclock/app.js @@ -29,27 +29,27 @@ var offsets = require("Storage").readJSON("worldclock.settings.json") || []; // Used to test offset array values during development. // Uncomment to override secondary offsets value -const mockOffsets = { - zeroOffsets: [], - oneOffset: [["UTC", 0]], - twoOffsets: [ - ["Tokyo", 9], - ["UTC", 0], - ], - fourOffsets: [ - ["Tokyo", 9], - ["UTC", 0], - ["Denver", -7], - ["Miami", -5], - ], - fiveOffsets: [ - ["Tokyo", 9], - ["UTC", 0], - ["Denver", -7], - ["Chicago", -6], - ["Miami", -5], - ], -}; +// const mockOffsets = { +// zeroOffsets: [], +// oneOffset: [["UTC", 0]], +// twoOffsets: [ +// ["Tokyo", 9], +// ["UTC", 0], +// ], +// fourOffsets: [ +// ["Tokyo", 9], +// ["UTC", 0], +// ["Denver", -7], +// ["Miami", -5], +// ], +// fiveOffsets: [ +// ["Tokyo", 9], +// ["UTC", 0], +// ["Denver", -7], +// ["Chicago", -6], +// ["Miami", -5], +// ], +// }; // Uncomment one at a time to test various offsets array scenarios // offsets = mockOffsets.zeroOffsets; // should render nothing below primary time From ad9c170f7884692b01c600b826f0d5ace375ac3b Mon Sep 17 00:00:00 2001 From: Mark Hoekstra Date: Fri, 11 Dec 2020 12:17:38 -0700 Subject: [PATCH 5/5] Use correct variable for secondary timezone fontsize --- apps/worldclock/app.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/apps/worldclock/app.js b/apps/worldclock/app.js index 81078f6d7..5d676b615 100644 --- a/apps/worldclock/app.js +++ b/apps/worldclock/app.js @@ -6,7 +6,7 @@ const primaryDateFontSize = 3; // Font for single secondary time const secondaryTimeFontSize = 4; -const secondaryTimeZoneFontSize = 4; +const secondaryTimeZoneFontSize = 2; // Font / columns for multiple secondary times const secondaryRowColFontSize = 2; @@ -111,7 +111,7 @@ function drawSimpleClock() { const xOffset = 30; g.setFont(font, secondaryTimeFontSize); g.drawString(`${hours}:${minutes}`, xyCenter, yposTime + 100, true); - g.setFont(font, secondaryTimeFontSize - 2); + g.setFont(font, secondaryTimeZoneFontSize); g.drawString(offset[OFFSET_TIME_ZONE], xyCenter, yposTime + 130, true); // draw Day, name of month, Date