diff --git a/apps/pebblepp/ChangeLog b/apps/pebblepp/ChangeLog index 4d81b17d8..b44914451 100644 --- a/apps/pebblepp/ChangeLog +++ b/apps/pebblepp/ChangeLog @@ -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 \ No newline at end of file +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) \ No newline at end of file diff --git a/apps/pebblepp/app.js b/apps/pebblepp/app.js index 2aa50b7de..7c01fcade 100644 --- a/apps/pebblepp/app.js +++ b/apps/pebblepp/app.js @@ -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(); -} +} \ No newline at end of file diff --git a/apps/pebblepp/metadata.json b/apps/pebblepp/metadata.json index eb74fda25..c2187483c 100644 --- a/apps/pebblepp/metadata.json +++ b/apps/pebblepp/metadata.json @@ -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"], diff --git a/apps/pebblepp/screenshot2.png b/apps/pebblepp/screenshot2.png new file mode 100644 index 000000000..6b53a017f Binary files /dev/null and b/apps/pebblepp/screenshot2.png differ diff --git a/apps/pebblepp/settings.js b/apps/pebblepp/settings.js index f477b9ab8..f2384577e 100644 --- a/apps/pebblepp/settings.js +++ b/apps/pebblepp/settings.js @@ -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(); } } }); -}); +}) \ No newline at end of file