mirror of https://github.com/espruino/BangleApps
v0.03 update - new settings
parent
fb3e036ebd
commit
f7c5051bfa
|
@ -1,2 +1,3 @@
|
||||||
0.01: New App!
|
0.01: New App!
|
||||||
0.02: New 'Settings Menu' to choose your favorite color and switch between light or dark themes
|
0.02: New 'Settings Menu' to choose your favorite color and switch between light or dark themes
|
||||||
|
0.03: New 'Leading Zero' and 'Date Suffix' options in 'Settings Menu'
|
||||||
|
|
|
@ -12,13 +12,20 @@ Shadow Clock uses the "Londrina" font in a user selectable color and surrounds i
|
||||||
|
|
||||||
## Configuration
|
## Configuration
|
||||||
|
|
||||||
Anton Clock is configured by the standard settings mechanism of Bangle.js's operating system:
|
Shadow Clock is configured by the standard settings mechanism of Bangle.js's operating system:
|
||||||
Open the `Settings` app, then the `Apps` submenu and below it the `Shadow Clock` menu.
|
Open the `Settings` app, then the `Apps` submenu and below it the `Shadow Clock` menu.
|
||||||
You configure Shadow Clock by selecting a `Light` or `Dark` system wide theme and then selecting the `Color` of the clock numbers.
|
You can configure Shadow Clock by selecting a `Light` or `Dark` system wide theme, selecting the `Color` of the clock numbers, enabling or disabling the suffix, and enabling or disabling the leading zero.
|
||||||
|
|
||||||
|
### Configuration Options
|
||||||
|
|
||||||
|
* Theme: Choose between `Light` and `Dark` themes.
|
||||||
|
* Color: Choose the color of the clock numbers from the available options.
|
||||||
|
* Date Suffix: `Yes` will show "10th" and `No` will show "10".
|
||||||
|
* Lead Zero: `Yes` to show the leading zero in 24hr mode, `No` to hide.
|
||||||
|
|
||||||
## Compatibility
|
## Compatibility
|
||||||
|
|
||||||
Shadow Clock should be fully compatible with with Bangle.js 1 and Bangle.js 2. However, it was built and tested with Bangle.js 2
|
Shadow Clock should be fully compatible with with Bangle.js 1 and Bangle.js 2. However, it was built and tested with Bangle.js 2.
|
||||||
|
|
||||||
## Creator
|
## Creator
|
||||||
|
|
||||||
|
|
|
@ -30,13 +30,14 @@ Graphics.prototype.setFontRighteous = function() {
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|
||||||
let storage = require('Storage');
|
// Load and set default settings
|
||||||
|
let teletextColors = ["#000", "#f00", "#0f0", "#ff0", "#00f", "#f0f", "#0ff", "#fff"];
|
||||||
var settings = Object.assign({
|
let settings = Object.assign({
|
||||||
// default values
|
color: teletextColors[6],
|
||||||
color: "#0ff",
|
theme: 'light',
|
||||||
theme: "light",
|
enableSuffix: true,
|
||||||
}, storage.readJSON("shadowclk.json", true) || {});
|
enableLeadingZero: false,
|
||||||
|
}, require('Storage').readJSON("shadowclk.json", true) || {});
|
||||||
|
|
||||||
(function () {
|
(function () {
|
||||||
let drawTimeout;
|
let drawTimeout;
|
||||||
|
@ -46,8 +47,13 @@ var settings = Object.assign({
|
||||||
var y = g.getHeight() / 2;
|
var y = g.getHeight() / 2;
|
||||||
g.reset().clearRect(Bangle.appRect);
|
g.reset().clearRect(Bangle.appRect);
|
||||||
var date = new Date();
|
var date = new Date();
|
||||||
var hour = String(date.getHours()).padStart(2, '0');
|
var hour = date.getHours();
|
||||||
if (hour[0] === '0') hour = hour[1];
|
hour = String(hour);
|
||||||
|
if (settings.enableLeadingZero) {
|
||||||
|
hour = hour.padStart(2, '0');
|
||||||
|
} else if (hour[0] === '0') {
|
||||||
|
hour = hour[1];
|
||||||
|
}
|
||||||
var minutes = String(date.getMinutes()).padStart(2, '0');
|
var minutes = String(date.getMinutes()).padStart(2, '0');
|
||||||
var timeStr = hour + ':' + minutes;
|
var timeStr = hour + ':' + minutes;
|
||||||
var color = settings.color;
|
var color = settings.color;
|
||||||
|
@ -59,6 +65,7 @@ var settings = Object.assign({
|
||||||
var month = locale.month(date, 1).slice(0, 1).toUpperCase() + locale.month(date, 1).slice(1).toLowerCase();
|
var month = locale.month(date, 1).slice(0, 1).toUpperCase() + locale.month(date, 1).slice(1).toLowerCase();
|
||||||
var year = date.getFullYear();
|
var year = date.getFullYear();
|
||||||
var dayOfMonthStr = dayOfMonth.toString();
|
var dayOfMonthStr = dayOfMonth.toString();
|
||||||
|
if (settings.enableSuffix) {
|
||||||
if (dayOfMonth === 1 || dayOfMonth === 21 || dayOfMonth === 31) {
|
if (dayOfMonth === 1 || dayOfMonth === 21 || dayOfMonth === 31) {
|
||||||
dayOfMonthStr += "st";
|
dayOfMonthStr += "st";
|
||||||
} else if (dayOfMonth === 2 || dayOfMonth === 22) {
|
} else if (dayOfMonth === 2 || dayOfMonth === 22) {
|
||||||
|
@ -68,6 +75,7 @@ var settings = Object.assign({
|
||||||
} else {
|
} else {
|
||||||
dayOfMonthStr += "th";
|
dayOfMonthStr += "th";
|
||||||
}
|
}
|
||||||
|
}
|
||||||
var dayOfWeek = locale.dow(date, 0).slice(0, 1).toUpperCase() + locale.dow(date, 0).slice(1).toLowerCase();
|
var dayOfWeek = locale.dow(date, 0).slice(0, 1).toUpperCase() + locale.dow(date, 0).slice(1).toLowerCase();
|
||||||
var dateStr = month + " " + dayOfMonthStr + ", " + year + "\n" + dayOfWeek;
|
var dateStr = month + " " + dayOfMonthStr + ", " + year + "\n" + dayOfWeek;
|
||||||
g.setFontAlign(0, 0).setFont("Righteous").drawString(dateStr, x, y + 56);
|
g.setFontAlign(0, 0).setFont("Righteous").drawString(dateStr, x, y + 56);
|
||||||
|
|
|
@ -1,7 +1,7 @@
|
||||||
{
|
{
|
||||||
"id": "shadowclk",
|
"id": "shadowclk",
|
||||||
"name": "Shadow Clock",
|
"name": "Shadow Clock",
|
||||||
"version": "0.02",
|
"version": "0.03",
|
||||||
"description": "A simple clock using the Londrina font in color with a shadowed outline. Based on the Anton Clock.",
|
"description": "A simple clock using the Londrina font in color with a shadowed outline. Based on the Anton Clock.",
|
||||||
"icon": "app.png",
|
"icon": "app.png",
|
||||||
"screenshots": [{
|
"screenshots": [{
|
||||||
|
|
|
@ -6,8 +6,11 @@
|
||||||
let appSettings = Object.assign({
|
let appSettings = Object.assign({
|
||||||
color: teletextColors[6],
|
color: teletextColors[6],
|
||||||
theme: 'light',
|
theme: 'light',
|
||||||
|
enableSuffix: true,
|
||||||
|
enableLeadingZero: false,
|
||||||
}, require('Storage').readJSON("shadowclk.json", true) || {});
|
}, require('Storage').readJSON("shadowclk.json", true) || {});
|
||||||
|
|
||||||
|
|
||||||
// Save settings to storage
|
// Save settings to storage
|
||||||
function writeSettings() {
|
function writeSettings() {
|
||||||
require('Storage').writeJSON("shadowclk.json", appSettings);
|
require('Storage').writeJSON("shadowclk.json", appSettings);
|
||||||
|
@ -96,6 +99,22 @@
|
||||||
writeSettings();
|
writeSettings();
|
||||||
},
|
},
|
||||||
format: v => teletextColorNames[v]
|
format: v => teletextColorNames[v]
|
||||||
|
},
|
||||||
|
'Date Suffix:': {
|
||||||
|
value: appSettings.enableSuffix,
|
||||||
|
format: v => v ? 'Yes' : 'No',
|
||||||
|
onchange: v => {
|
||||||
|
appSettings.enableSuffix = v;
|
||||||
|
writeSettings();
|
||||||
|
}
|
||||||
|
},
|
||||||
|
'Lead Zero:': {
|
||||||
|
value: appSettings.enableLeadingZero,
|
||||||
|
format: v => v ? 'Yes' : 'No',
|
||||||
|
onchange: v => {
|
||||||
|
appSettings.enableLeadingZero = v;
|
||||||
|
writeSettings();
|
||||||
|
}
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in New Issue