updated pebblepp with fix for bottom line and other improvements

pull/3608/head
Gordon Williams 2024-10-09 11:22:43 +01:00
parent 78dd28b389
commit 66a9f8b6cb
5 changed files with 46 additions and 25 deletions

View File

@ -7,4 +7,7 @@
0.06: Use the clockbg library to allow custom image backgrounds
0.07: Fix automatic coloring of middle of clockinfo images if clockinfo image goes right to the top or left
0.08: Use new clockinfo lib with function to render images wirh borders
0.09: Add date on the bottom
0.09: Add date on the bottom
0.10: Fix size of bottom bar after 0.09
Make date toggleable with settings
Optional border around clockinfos (available from settings)

View File

@ -20,7 +20,7 @@ Graphics.prototype.setFontLECO1976Regular14 = function() {
{
const SETTINGS_FILE = "pebblepp.json";
let settings = require("Storage").readJSON(SETTINGS_FILE,1)|| {'theme':'System', 'showlock':false};
let settings = Object.assign({'theme':'System', 'showdate':true, 'clkinfoborder': false}, require("Storage").readJSON(SETTINGS_FILE,1)||{});
let background = require("clockbg");
let theme;
let drawTimeout;
@ -28,8 +28,8 @@ let drawTimeout;
const h = g.getHeight();
const w = g.getWidth();
//const ha = 2*h/5 - 4;
const h2 = 3*h/5 - 10;
const h3 = 7*h/8;
const h2 = Math.round(3*h/5) - 10;
const h3 = Math.round(7*h/8);
let draw = function() {
let locale = require("locale");
@ -37,10 +37,12 @@ let draw = function() {
let time = locale.time(date, 1);
g.reset();
g.setBgColor(theme.bg).clearRect(0, h2, w, h3);
g.setColor(theme.fg).fillRect(w / 2 - 30, h3 + 5, w / 2 + 30, h); // refresh date background
g.setFontLECO1976Regular22().setFontAlign(0, -1);
g.setColor(theme.bg).drawString(date.getDate() + "." + (date.getMonth() + 1), w / 2, h3 + 5);
g.setBgColor(theme.bg).clearRect(0, h2, w, h3); // clear area where clock is
if (settings.showdate) {
g.setColor(theme.fg).fillRect(w / 2 - 30, h3 + 5, w / 2 + 30, h); // refresh date background
g.setFontLECO1976Regular22().setFontAlign(0, -1);
g.setColor(theme.bg).drawString(date.getDate() + "." + (date.getMonth() + 1), w / 2, h3 + 5);
}
g.setFontLECO1976Regular42().setFontAlign(0, -1);
g.setColor(theme.fg);
g.drawString(time, w/2, h2 + 8);
@ -89,7 +91,10 @@ let clockInfoDraw = (itm, info, options) => {
if (info.img) { // draw the image
// TODO: we could replace certain images with our own ones here...
y = options.y+8;
require("clock_info").drawFilledImage(info.img,midx-24,y,{scale:2});
if (settings.clkinfoborder)
require("clock_info").drawBorderedImage(info.img,midx-24,y,{scale:2});
else
require("clock_info").drawFilledImage(info.img,midx-24,y,{scale:2});
}
g.setFontLECO1976Regular22().setFontAlign(0, 0);
var txt = info.text.toString().toUpperCase();
@ -100,6 +105,11 @@ let clockInfoDraw = (itm, info, options) => {
txt = l.slice(0,2).join("\n") + (l.length>2)?"...":"";
}
y = options.y+options.h-12;
if (settings.clkinfoborder) {
g.setColor(theme.bg)
g.drawString(txt, midx-2, y).drawString(txt, midx+2, y).drawString(txt, midx, y-2).drawString(txt, midx, y+2);
g.setColor(theme.fg);
}
g.drawString(txt, midx, y); // draw the text
};
@ -134,7 +144,7 @@ Bangle.loadWidgets();
require("widget_utils").swipeOn(); // hide widgets, make them visible with a swipe
background.fillRect(Bangle.appRect); // start off with completely clear background
// background contrast bar
g.setColor(theme.fg).fillRect(0, h2 - 6, w, h3 + 5);
g.setColor(theme.fg).fillRect(0, h2 - 6, w, h3 + 6);
draw();
}
}

View File

@ -2,10 +2,10 @@
"id": "pebblepp",
"name": "Pebble++ Clock",
"shortName": "Pebble++",
"version": "0.09",
"description": "A pebble style clock (based on the 'Pebble Clock' app) but with two configurable ClockInfo items at the top",
"version": "0.10",
"description": "A Pebble style clock (based on the 'Pebble Clock' app) but with two configurable ClockInfo items at the top and custom backgrounds. Date/theme/borders be reconfigured using settings page.",
"icon": "app.png",
"screenshots": [{"url":"screenshot.png"}],
"screenshots": [{"url":"screenshot.png"},{"url":"screenshot2.png"}],
"type": "clock",
"tags": "clock,clkinfo,clockbg",
"supports": ["BANGLEJS2"],

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.0 KiB

View File

@ -2,19 +2,13 @@
const SETTINGS_FILE = "pebblepp.json";
// Initialize with default settings...
let s = {'theme':'System', 'showlock':false}
let settings = {'theme':'System', 'showdate':true, 'clkinfoborder':false}
// ...and overwrite them with any saved values
// This way saved values are preserved if a new version adds more settings
const storage = require('Storage');
let settings = storage.readJSON(SETTINGS_FILE, 1) || s;
const saved = settings || {};
for (const key in saved) {
s[key] = saved[key]
}
settings = Object.assign(settings, storage.readJSON(SETTINGS_FILE, 1)||{});
function save() {
settings = s;
storage.write(SETTINGS_FILE, settings);
}
@ -24,13 +18,27 @@
'': { 'title': 'Pebble++ Clock' },
/*LANG*/'< Back': back,
/*LANG*/'Theme': {
value: 0 | theme_options.indexOf(s.theme),
value: 0 | theme_options.indexOf(settings.theme),
min: 0, max: theme_options.length - 1,
format: v => theme_options[v],
onchange: v => {
s.theme = theme_options[v];
settings.theme = theme_options[v];
save();
}
},
/*LANG*/'Show Date': {
value: !!settings.showdate,
onchange: v => {
settings.showdate = v;
save();
}
},
/*LANG*/'ClockInfo border': {
value: !!settings.clkinfoborder,
onchange: v => {
settings.clkinfoborder = v;
save();
}
}
});
});
})