Merge pull request #1131 from myxor/circleclock_v0.03

Circles clock v0.03

apps.json

@@ -5029,9 +5029,10 @@
   { "id": "circlesclock",
     "name": "Circles clock",
     "shortName":"Circles clock",
-    "version":"0.02",
+    "version":"0.03",
     "description": "A clock with circles for different data at the bottom in a probably familiar style",
     "icon": "app.png",
+    "screenshots": [{"url":"screenshot.png"}],
     "dependencies": {"widpedom":"app"},
     "type": "clock",
     "tags": "clock",

apps/circlesclock/ChangeLog

@@ -1,2 +1,3 @@
 0.01: New clock
 0.02: Fix icon & add battery warn functionality
+0.03: Theming support & minor fixes

apps/circlesclock/README.md

@@ -13,6 +13,8 @@ It shows besides time, date and day of week the following information:
 
 ## TODO
 * Show weather information
+* Configure which information to show in each circle
+* Configure visibility of widgets
 
 ## Creator
 Marco ([myxor](https://github.com/myxor))

apps/circlesclock/app.js

@@ -7,19 +7,23 @@ const powerIcon = heatshrink.decompress(atob("h0OwYQNsAED7AEDmwEDtu2AgUbtuABwXbB
 const powerIconGreen = heatshrink.decompress(atob("h0OwYQNkAEDpAEDiQEDkmSAgUJkmABwVJBIUEyVAAoYOCgEBFIgODABI"));
 const powerIconRed = heatshrink.decompress(atob("h0OwYQNoAEDyAEDkgEDpIFDiVJBweSAgUJkmAAoYZDgQpEBwYAJA"));
 
-const SETTINGS_FILE = "circlesclock.json";
 let settings;
 
 function loadSettings() {
-  settings = require("Storage").readJSON(SETTINGS_FILE, 1) || {
+  settings = require("Storage").readJSON("circlesclock.json", 1) || {
     'maxHR': 200,
     'stepGoal': 10000,
     'batteryWarn': 30
   };
+  // Load step goal from pedometer widget as fallback
+  if (settings.stepGoal == undefined) {
+    const d = require('Storage').readJSON("wpedom.json", 1) || {};
+    settings.stepGoal = d != undefined && d.settings != undefined ? d.settings.goal : 10000;
+  }
 }
 
-const colorFg = '#fff';
+const colorFg = g.theme.dark ? '#fff' : '#000';
-const colorBg = '#000';
+const colorBg = g.theme.dark ? '#000' : '#fff';
 const colorGrey = '#808080';
 const colorRed = '#ff0000';
 const colorGreen = '#00ff00';
@@ -73,7 +77,7 @@ function drawSteps() {
   g.setColor(colorGrey);
   g.fillCircle(w1, h3, radiusOuter);
 
-  const stepGoal = settings.stepGoal;
+  const stepGoal = settings.stepGoal || 10000;
   if (stepGoal > 0) {
     let percent = steps / stepGoal;
     if (stepGoal < steps) percent = 1;
@@ -97,8 +101,9 @@ function drawHeartRate() {
   g.setColor(colorGrey);
   g.fillCircle(w2, h3, radiusOuter);
 
-  if (hrtValue != undefined) {
+  if (hrtValue != undefined && hrtValue > 0) {
-    const percent = hrtValue / settings.maxHR;
+    const minHR = 40;
+    const percent = (hrtValue - minHR) / (settings.maxHR - minHR);
     drawGauge(w2, h3, percent, colorRed);
   }
 
@@ -156,25 +161,26 @@ function radians(a) {
   return a * Math.PI / 180;
 }
 
-
 function drawGauge(cx, cy, percent, color) {
   let offset = 30;
   let end = 300;
   var i = 0;
   var r = radiusInner + 3;
 
+  if (percent <= 0) return;
   if (percent > 1) percent = 1;
 
   var startrot = -offset;
-  var endrot = startrot - ((end - offset) * percent);
+  var endrot = startrot - ((end - offset) * percent) - 15;
 
   g.setColor(color);
 
+  const size = 4;
   // draw gauge
-  for (i = startrot; i > endrot; i -= 4) {
+  for (i = startrot; i > endrot - size; i -= size) {
     x = cx + r * Math.sin(radians(i));
     y = cy + r * Math.cos(radians(i));
-    g.fillCircle(x, y, 4);
+    g.fillCircle(x, y, size);
   }
 }
 
@@ -201,6 +207,10 @@ function getSteps() {
 Bangle.on('lock', function(isLocked) {
   if (!isLocked) {
     Bangle.setHRMPower(1, "watch");
+    if (hrtValue == undefined) {
+      hrtValue = '...';
+      drawHeartRate();
+    }
   } else {
     Bangle.setHRMPower(0, "watch");
   }
@@ -218,6 +228,10 @@ Bangle.on('HRM', function(hrm) {
   //}
 });
 
+Bangle.on('charging', function(charging) {
+  drawBattery();
+});
+
 g.clear();
 Bangle.loadWidgets();
 /*
@@ -225,10 +239,12 @@ Bangle.loadWidgets();
  * so we will blank out the draw() functions of each widget and change the
  * area to the top bar doesn't get cleared.
  */
+if (typeof WIDGETS === "object") {
   for (let wd of WIDGETS) {
     wd.draw = () => {};
     wd.area = "";
   }
+}
 loadSettings();
 setInterval(draw, 60000);
 draw();