mirror of https://github.com/espruino/BangleApps
updated pebblepp with fix for bottom line and other improvements
parent
78dd28b389
commit
66a9f8b6cb
|
@ -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)
|
|
@ -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();
|
||||
}
|
||||
}
|
|
@ -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 |
|
@ -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();
|
||||
}
|
||||
}
|
||||
});
|
||||
});
|
||||
})
|
Loading…
Reference in New Issue