1
0
Fork 0

General clock update - fix svclock after last commit, ensure other clocks update on the minute (not 1-15 seconds later), add Bangle.js 2 and theme compatibility

master
Gordon Williams 2021-10-21 09:13:17 +01:00
parent 96685e531d
commit d2d1f5b8cd
9 changed files with 160 additions and 108 deletions

View File

@ -1026,7 +1026,7 @@
{
"id": "sclock",
"name": "Simple Clock",
"version": "0.06",
"version": "0.07",
"description": "A Simple Digital Clock",
"icon": "clock-simple.png",
"type": "clock",
@ -1071,12 +1071,12 @@
{
"id": "svclock",
"name": "Simple V-Clock",
"version": "0.03",
"version": "0.04",
"description": "Modification of Simple Clock 0.04 to use Vectorfont",
"icon": "vclock-simple.png",
"type": "clock",
"tags": "clock",
"supports": ["BANGLEJS"],
"supports": ["BANGLEJS","BANGLEJS2"],
"allow_emulator": true,
"storage": [
{"name":"svclock.app.js","url":"vclock-simple.js"},
@ -1376,12 +1376,12 @@
{
"id": "berlinc",
"name": "Berlin Clock",
"version": "0.04",
"version": "0.05",
"description": "Berlin Clock (see https://en.wikipedia.org/wiki/Mengenlehreuhr)",
"icon": "berlin-clock.png",
"type": "clock",
"tags": "clock",
"supports": ["BANGLEJS"],
"supports": ["BANGLEJS","BANGLEJS2"],
"allow_emulator": true,
"storage": [
{"name":"berlinc.app.js","url":"berlin-clock.js"},
@ -2804,12 +2804,12 @@
"id": "worldclock",
"name": "World Clock - 4 time zones",
"shortName": "World Clock",
"version": "0.04",
"version": "0.05",
"description": "Current time zone plus up to four others",
"icon": "app.png",
"type": "clock",
"tags": "clock",
"supports": ["BANGLEJS"],
"supports": ["BANGLEJS","BANGLEJS2"],
"readme": "README.md",
"custom": "custom.html",
"storage": [

View File

@ -1,3 +1,6 @@
0.02: Modified for use with new bootloader and firmware
0.03: Shrinked size to avoid cut-off edges on the physical device. BTN3: show date. BTN1: show time in decimal.
0.04: Update to use Bangle.setUI instead of setWatch
0.05: Update *on* the minute rather than every 15 secs
Now show widgets
Make compatible with themes, and Bangle.js 2

View File

@ -1,7 +1,7 @@
// Berlin Clock see https://en.wikipedia.org/wiki/Mengenlehreuhr
// https://github.com/eska-muc/BangleApps
const fields = [4, 4, 11, 4];
const offset = 20;
const offset = 24;
const width = g.getWidth() - 2 * offset;
const height = g.getHeight() - 2 * offset;
const rowHeight = height / 4;
@ -10,11 +10,23 @@ var show_date = false;
var show_time = false;
var yy = 0;
rowlights = [];
time_digit = [];
var rowlights = [];
var time_digit = [];
function drawBerlinClock() {
g.clear();
// timeout used to update every minute
var drawTimeout;
// schedule a draw for the next minute
function queueDraw() {
if (drawTimeout) clearTimeout(drawTimeout);
drawTimeout = setTimeout(function() {
drawTimeout = undefined;
draw();
}, 60000 - (Date.now() % 60000));
}
function draw() {
g.reset().clearRect(0,24,g.getWidth(),g.getHeight());
var now = new Date();
// show date below the clock
@ -24,8 +36,7 @@ function drawBerlinClock() {
var day = now.getDate();
var dateString = `${yr}-${month < 10 ? '0' : ''}${month}-${day < 10 ? '0' : ''}${day}`;
var strWidth = g.stringWidth(dateString);
g.setColor(1, 1, 1);
g.setFontAlign(-1,-1);
g.setColor(g.theme.fg).setFontAlign(-1,-1);
g.drawString(dateString, ( g.getWidth() - strWidth ) / 2, height + offset + 4);
}
@ -50,8 +61,7 @@ function drawBerlinClock() {
x2 = (col + 1) * boxWidth + offset;
y2 = (row + 1) * rowHeight + offset;
g.setColor(1, 1, 1);
g.drawRect(x1, y1, x2, y2);
g.setColor(g.theme.fg).drawRect(x1, y1, x2, y2);
if (col < rowlights[row]) {
if (row === 2) {
if (((col + 1) % 3) === 0) {
@ -65,46 +75,42 @@ function drawBerlinClock() {
g.fillRect(x1 + 2, y1 + 2, x2 - 2, y2 - 2);
}
if (row == 3 && show_time) {
g.setColor(1,1,1);
g.setFontAlign(0,0);
g.setColor(g.theme.fg).setFontAlign(0,0);
g.drawString(time_digit[col],(x1+x2)/2,(y1+y2)/2);
}
}
}
queueDraw();
}
function toggleDate() {
show_date = ! show_date;
drawBerlinClock();
draw();
}
function toggleTime() {
show_time = ! show_time;
drawBerlinClock();
draw();
}
// special function to handle display switch on
Bangle.on('lcdPower', (on) => {
g.clear();
// Stop updates when LCD is off, restart when on
Bangle.on('lcdPower',on=>{
if (on) {
Bangle.drawWidgets();
// call your app function here
drawBerlinClock();
draw(); // draw immediately, queue redraw
} else { // stop draw timer
if (drawTimeout) clearTimeout(drawTimeout);
drawTimeout = undefined;
}
});
// refesh every 15 sec
setInterval(drawBerlinClock, 15E3);
// Show launcher when button pressed, handle up/down
Bangle.setUI("clockupdown", dir=> {
if (dir<0) toggleTime();
if (dir>0) toggleDate();
});
g.clear();
Bangle.loadWidgets();
Bangle.drawWidgets();
drawBerlinClock();
if (BTN3) {
// Toggle date display, when BTN3 is pressed
setWatch(toggleTime,BTN1, { repeat : true, edge: "falling"});
// Toggle date display, when BTN3 is pressed
setWatch(toggleDate,BTN3, { repeat : true, edge: "falling"});
}
// Show launcher when button pressed
Bangle.setUI("clock");
draw();

View File

@ -3,3 +3,4 @@
0.04: Make this clock do 12h and 24h
0.05: setUI, screen size changes
0.06: Use Bangle.setUI for button/launcher handling
0.07: Update *on* the minute rather than every 15 secs

View File

@ -1,4 +1,3 @@
/* jshint esversion: 6 */
const big = g.getWidth()>200;
const timeFontSize = big?6:5;
const dateFontSize = big?3:2;
@ -14,7 +13,19 @@ const yposGMT = xyCenter*1.9;
// Check settings for what type our clock should be
var is12Hour = (require("Storage").readJSON("setting.json",1)||{})["12hour"];
function drawSimpleClock() {
// timeout used to update every minute
var drawTimeout;
// schedule a draw for the next minute
function queueDraw() {
if (drawTimeout) clearTimeout(drawTimeout);
drawTimeout = setTimeout(function() {
drawTimeout = undefined;
draw();
}, 60000 - (Date.now() % 60000));
}
function draw() {
// get date
var d = new Date();
var da = d.toString().split(" ");
@ -60,11 +71,18 @@ function drawSimpleClock() {
var gmt = da[5];
g.setFont(font, gmtFontSize);
g.drawString(gmt, xyCenter, yposGMT, true);
queueDraw();
}
// handle switch display on by pressing BTN1
Bangle.on('lcdPower', function(on) {
if (on) drawSimpleClock();
// 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;
}
});
// clean app screen
@ -74,8 +92,5 @@ Bangle.setUI("clock");
Bangle.loadWidgets();
Bangle.drawWidgets();
// refesh every 15 sec
setInterval(drawSimpleClock, 15E3);
// draw now
drawSimpleClock();
draw();

View File

@ -1,3 +1,4 @@
0.01: Modification of SimpleClock 0.04 to use Vectorfont
0.02: Use Bangle.setUI for button/launcher handling
0.03: Scale to BangleJS 2 and add locale
0.03: Scale to BangleJS 2 and add locale
0.04: Fix rendering issue on real hardware, now update *on* the minute rather than every 15 secs

View File

@ -1,4 +1,3 @@
/* jshint esversion: 6 */
const locale = require("locale");
var timeFontSize;
@ -12,8 +11,7 @@ var yposDate;
var yposYear;
var yposGMT;
switch (process.env.BOARD) {
case "EMSCRIPTEN":
if (g.getWidth() > 200) {
timeFontSize = 65;
dateFontSize = 20;
gmtFontSize = 10;
@ -22,8 +20,7 @@ switch (process.env.BOARD) {
yposDate = 130;
yposYear = 175;
yposGMT = 220;
break;
case "EMSCRIPTEN2":
} else {
timeFontSize = 48;
dateFontSize = 15;
gmtFontSize = 10;
@ -32,12 +29,23 @@ switch (process.env.BOARD) {
yposDate = 95;
yposYear = 128;
yposGMT = 161;
break;
}
// Check settings for what type our clock should be
var is12Hour = (require("Storage").readJSON("setting.json",1)||{})["12hour"];
function drawSimpleClock() {
// timeout used to update every minute
var drawTimeout;
// schedule a draw for the next minute
function queueDraw() {
if (drawTimeout) clearTimeout(drawTimeout);
drawTimeout = setTimeout(function() {
drawTimeout = undefined;
draw();
}, 60000 - (Date.now() % 60000));
}
function draw() {
g.clear();
Bangle.drawWidgets();
@ -76,23 +84,26 @@ function drawSimpleClock() {
// draw gmt
g.setFont(font, gmtFontSize);
g.drawString(d.toString().match(/GMT[+-]\d+/), xyCenter, yposGMT, true);
queueDraw();
}
// handle switch display on by pressing BTN1
Bangle.on('lcdPower', function(on) {
if (on) drawSimpleClock();
// 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 button pressed
Bangle.setUI("clock");
// clean app screen
g.clear();
Bangle.loadWidgets();
Bangle.drawWidgets();
// refesh every 15 sec
setInterval(drawSimpleClock, 15E3);
// draw now
drawSimpleClock();
// Show launcher when button pressed
Bangle.setUI("clock");
draw();

View File

@ -2,3 +2,5 @@
0.02: Update custom.html for refactor; add README
0.03: Update for larger secondary timezone display (#610)
0.04: setUI, different screen sizes
0.05: Now update *on* the minute rather than every 15 secs
Fix rendering of single extra timezone on Bangle.js 2

View File

@ -1,5 +1,3 @@
/* jshint esversion: 6 */
const big = g.getWidth()>200;
// Font for primary time and date
const primaryTimeFontSize = big?6:5;
@ -16,8 +14,13 @@ const xcol2 = g.getWidth() - xcol1;
const font = "6x8";
/* TODO: we could totally use 'Layout' here and
avoid a whole bunch of hard-coded offsets */
const xyCenter = g.getWidth() / 2;
const yposTime = big ? 75 : 60;
const yposTime2 = yposTime + (big ? 100 : 60);
const yposDate = big ? 130 : 90;
const yposWorld = big ? 170 : 120;
@ -29,41 +32,52 @@ 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],
// ],
// };
/*
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
//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"];
var secondInterval;
// timeout used to update every minute
var drawTimeout;
// schedule a draw for the next minute
function queueDraw() {
if (drawTimeout) clearTimeout(drawTimeout);
drawTimeout = setTimeout(function() {
drawTimeout = undefined;
draw();
}, 60000 - (Date.now() % 60000));
}
function doublenum(x) {
return x < 10 ? "0" + x : "" + x;
@ -73,7 +87,7 @@ function getCurrentTimeFromOffset(dt, offset) {
return new Date(dt.getTime() + offset * 60 * 60 * 1000);
}
function drawSimpleClock() {
function draw() {
// get date
var d = new Date();
var da = d.toString().split(" ");
@ -111,9 +125,9 @@ function drawSimpleClock() {
// For a single secondary timezone, draw it bigger and drop time zone to second line
const xOffset = 30;
g.setFont(font, secondaryTimeFontSize);
g.drawString(`${hours}:${minutes}`, xyCenter, yposTime + 100, true);
g.drawString(`${hours}:${minutes}`, xyCenter, yposTime2, true);
g.setFont(font, secondaryTimeZoneFontSize);
g.drawString(offset[OFFSET_TIME_ZONE], xyCenter, yposTime + 130, true);
g.drawString(offset[OFFSET_TIME_ZONE], xyCenter, yposTime2 + 30, true);
// draw Day, name of month, Date
g.setFont(font, secondaryTimeZoneFontSize);
@ -132,6 +146,8 @@ function drawSimpleClock() {
g.drawString(`${hours}:${minutes}`, xcol2, yposWorld + index * 15, true);
}
});
queueDraw();
}
// clean app screen
@ -141,18 +157,15 @@ Bangle.setUI("clock");
Bangle.loadWidgets();
Bangle.drawWidgets();
// refesh every 15 sec when screen is on
Bangle.on("lcdPower", (on) => {
if (secondInterval) clearInterval(secondInterval);
secondInterval = undefined;
// Stop updates when LCD is off, restart when on
Bangle.on('lcdPower',on=>{
if (on) {
secondInterval = setInterval(drawSimpleClock, 15e3);
drawSimpleClock(); // draw immediately
draw(); // draw immediately, queue redraw
} else { // stop draw timer
if (drawTimeout) clearTimeout(drawTimeout);
drawTimeout = undefined;
}
});
// draw now and every 15 sec until display goes off
drawSimpleClock();
if (Bangle.isLCDOn()) {
secondInterval = setInterval(drawSimpleClock, 15e3);
}
// draw now
draw();