Merge pull request #713 from flautrup/master

Moved which ring shows seconds and minutes

apps.json

@@ -1703,7 +1703,7 @@
     "name": "Round clock with seconds,  minutes and date",
     "shortName": "Round Clock",
     "icon": "app.png",
-    "version":"0.04",
+    "version": "0.05",
     "description": "Designed round clock with ticks for minutes and seconds and heart rate indication",
     "tags": "clock",
     "type": "clock",
@@ -1712,6 +1712,20 @@
       {"name":"rclock.img","url":"app-icon.js","evaluate":true}
     ]
   },
+  {
+    "id": "fclock",
+    "name": "fclock",
+    "shortName": "F Clock",
+    "icon": "app.png",
+    "version": "0.01",
+    "description": "Simple design of a digital clock",
+    "tags": "clock",
+    "type": "clock",
+    "storage": [
+      {"name":"fclock.app.js","url":"fclock.app.js"},
+      {"name":"fclock.img","url":"app-icon.js","evaluate":true}
+    ]
+  },
   { "id": "hamloc",
     "name": "QTH Locator / Maidenhead Locator System",
     "shortName": "QTH Locator",

apps/fclock/ChangeLog

@@ -0,0 +1 @@
+0.01: First published version of app

apps/fclock/fclock.app.js

@@ -0,0 +1,206 @@
+{
+  var minutes;
+  var seconds;
+  var hours;
+  var date;
+  var first = true;
+  var locale = require('locale');
+  var _12hour = (require("Storage").readJSON("setting.json", 1) || {})["12hour"] || false;
+
+  //HR variables
+  var id = 0;
+  var grow = true;
+  var size=10;
+
+  //Screen dimensions
+  const screen = {
+    width: g.getWidth(),
+    height: g.getWidth(),
+    middle: g.getWidth() / 2,
+    center: g.getHeight() / 2,
+  };
+
+  // Ssettings
+  const settings = {
+    time: {
+      color: '#dddddd',
+      font: 'Vector',
+      size: 100,
+      middle: screen.middle,
+      center: screen.center,
+    },
+    date: {
+      color: '#dddddd',
+      font: 'Vector',
+      size: 15,
+      middle: screen.height-17, // at bottom of screen
+      center: screen.center,
+    },
+    circle: {
+      colormin: '#ffffff',
+      colorsec: '#ffffff',
+      width: 10,
+      middle: screen.middle,
+      center: screen.center,
+      height: screen.height
+    },
+    hr: {
+      color: '#333333',
+      size: 20,
+      x: screen.center,
+      y: screen.middle + 65
+    }
+  };
+
+  const dateStr = function (date) {
+    return locale.date(new Date(), 1);
+  };
+
+  const getFormated = function(val) {
+    if (val<10) {
+      val='0'+val;
+    }
+
+    return val;
+  };
+
+  const drawMin = function (sections, color) {
+    
+    g.setFontAlign(0, 0, 0);
+    g.setColor('#000000');
+    g.setFont(settings.time.font, settings.time.size/2);
+    g.drawString(getFormated(sections-1), settings.time.center+50, settings.time.middle);
+    g.setColor(settings.time.color);
+    g.setFont(settings.time.font, settings.time.size/2);
+    g.drawString(getFormated(sections), settings.time.center+50, settings.time.middle);
+  };
+
+  const drawSec = function (sections, color) {
+    g.setFontAlign(0, 0, 0);
+    g.setColor('#000000');
+    g.setFont(settings.time.font, settings.time.size/4);
+    g.drawString(getFormated(sections-1), settings.time.center+100, settings.time.middle);
+    g.setColor(settings.time.color);
+    g.setFont(settings.time.font, settings.time.size/4);
+    g.drawString(getFormated(sections), settings.time.center+100, settings.time.middle);
+  };
+
+  const drawClock = function () {
+
+    currentTime = new Date();
+
+    //Get date as a string
+    date = dateStr(currentTime);
+    
+    if(seconds==59) {
+        g.clear();
+    }
+
+    // Update minutes when needed
+    if (minutes != currentTime.getMinutes()) {
+      minutes = currentTime.getMinutes();
+      drawMin(minutes, settings.circle.colormin);
+    }
+
+    //Update seconds when needed
+    if (seconds != currentTime.getSeconds()) {
+      seconds = currentTime.getSeconds();
+      drawSec(seconds, settings.circle.colorsec);
+    }
+
+    //Write the time as configured in the settings
+    hours = currentTime.getHours();
+    if (_12hour && hours > 13) {
+      hours = hours - 12;
+    }
+
+    var meridian;
+
+    if (typeof locale.meridian === "function") {
+      meridian = locale.meridian(new Date());
+    } else {
+      meridian = "";
+    }
+
+    var timestr;
+
+    if (meridian.length > 0 && _12hour) {
+      timestr = hours + " " + meridian;
+    } else {
+      timestr = hours;
+    }
+    g.setFontAlign(0, 0, 0);
+    g.setColor(settings.time.color);
+    g.setFont(settings.time.font, settings.time.size);
+    g.drawString(timestr, settings.time.center-40, settings.time.middle);
+
+    //Write the date as configured in the settings
+    g.setColor(settings.date.color);
+    g.setFont(settings.date.font, settings.date.size);
+    g.drawString(date, settings.date.center, settings.date.middle);
+  };
+
+  //setInterval for HR visualisation
+  const newBeats = function (hr) {
+    if (id != 0) {
+      changeInterval(id, 6e3 / hr.bpm);
+    } else {
+      id = setInterval(drawHR, 6e3 / hr.bpm);
+    }
+  };
+
+  //visualize HR with circles pulsating
+  const drawHR = function () {
+    if (grow && size < settings.hr.size) {
+      size++;
+    }
+
+    if (!grow && size > 3) {
+      size--;
+    }
+
+    if (size == settings.hr.size || size == 3) {
+      grow = !grow;
+    }
+
+    if (grow) {
+      color = settings.hr.color;
+      g.setColor(color);
+      g.fillCircle(settings.hr.x, settings.hr.y, size);
+    } else {
+      color = "#000000";
+      g.setColor(color);
+      g.drawCircle(settings.hr.x, settings.hr.y, size);
+    }
+  };
+
+  // clean app screen
+  g.clear();
+  Bangle.loadWidgets();
+  Bangle.drawWidgets();
+
+  //manage when things should be enabled and not
+  Bangle.on('lcdPower', function (on) {
+    if (on) {
+      Bangle.setHRMPower(1);
+    } else {
+      Bangle.setHRMPower(0);
+    }
+  });
+
+  // refesh every second
+  setInterval(drawClock, 1E3);
+
+  //start HR monitor and update frequency of update
+  Bangle.setHRMPower(1);
+  Bangle.on('HRM', function (d) {
+    newBeats(d);
+  });
+
+  // draw now
+  drawClock();
+
+  // Show launcher when middle button pressed
+  setWatch(Bangle.showLauncher, BTN2, { repeat: false, edge: "falling" });
+
+} 

apps/rclock/ChangeLog

@@ -2,3 +2,4 @@
 0.02: Added support for locale and 12H clock
 0.03: Added HR indication to clock
 0.04: Update font size and alignment
+0.05: Changes which circle show minutes and seconds

apps/rclock/rclock.app.js

@@ -23,29 +23,29 @@
   // Ssettings
   const settings = {
     time: {
-      color: 0xD6ED17,
+      color: '#D6ED17',
       font: 'Vector',
       size: 60,
       middle: screen.middle,
       center: screen.center,
     },
     date: {
-      color: 0xD6ED17,
+      color: '#D6ED17',
       font: 'Vector',
       size: 15,
       middle: screen.height-17, // at bottom of screen
       center: screen.center,
     },
     circle: {
-      colormin: 0x606060,
+      colormin: '#ffffff',
-      colorsec: 0x656565,
+      colorsec: '#ffffff',
       width: 10,
       middle: screen.middle,
       center: screen.center,
       height: screen.height
     },
     hr: {
-      color: 0x333333,
+      color: '#333333',
       size: 10,
       x: screen.center,
       y: screen.middle + 45
@@ -66,18 +66,6 @@
   };
 
   const drawMinArc = function (sections, color) {
-    g.setColor(color);
-    rad = (settings.circle.height / 2) - 20;
-    r1 = getArcXY(settings.circle.middle, settings.circle.center, rad, sections * (360 / 60) - 90);
-    //g.setPixel(r[0],r[1]);
-    r2 = getArcXY(settings.circle.middle, settings.circle.center, rad - settings.circle.width, sections * (360 / 60) - 90);
-    //g.setPixel(r[0],r[1]);
-    g.drawLine(r1[0], r1[1], r2[0], r2[1]);
-    g.setColor('#333333');
-    g.drawCircle(settings.circle.middle, settings.circle.center, rad - settings.circle.width - 4)
-  };
-
-  const drawSecArc = function (sections, color) {
     g.setColor(color);
     rad = (settings.circle.height / 2) - 40;
     r1 = getArcXY(settings.circle.middle, settings.circle.center, rad, sections * (360 / 60) - 90);
@@ -86,7 +74,19 @@
     //g.setPixel(r[0],r[1]);
     g.drawLine(r1[0], r1[1], r2[0], r2[1]);
     g.setColor('#333333');
-    g.drawCircle(settings.circle.middle, settings.circle.center, rad - settings.circle.width - 4)
+    g.drawCircle(settings.circle.middle, settings.circle.center, rad - settings.circle.width - 4);
+  };
+
+  const drawSecArc = function (sections, color) {
+    g.setColor(color);
+    rad = (settings.circle.height / 2) - 20;
+    r1 = getArcXY(settings.circle.middle, settings.circle.center, rad, sections * (360 / 60) - 90);
+    //g.setPixel(r[0],r[1]);
+    r2 = getArcXY(settings.circle.middle, settings.circle.center, rad - settings.circle.width, sections * (360 / 60) - 90);
+    //g.setPixel(r[0],r[1]);
+    g.drawLine(r1[0], r1[1], r2[0], r2[1]);
+    g.setColor('#333333');
+    g.drawCircle(settings.circle.middle, settings.circle.center, rad - settings.circle.width - 4);
   };
 
   const drawClock = function () {
@@ -107,15 +107,13 @@
       first = false;
     }
 
-    // Reset seconds
+    // Reset
     if (seconds == 59) {
       g.setColor('#000000');
-      g.fillCircle(settings.circle.middle, settings.circle.center, (settings.circle.height / 2) - 40);
+      g.fillCircle(settings.circle.middle, settings.circle.center, (settings.circle.height / 2));
+      for (count = 0; count <= minutes; count++) {
+        drawMinArc(count, settings.circle.colormin);
       }
-    // Reset minutes
-    if (minutes == 59 && seconds == 59) {
-      g.setColor('#000000');
-      g.fillCircle(settings.circle.middle, settings.circle.center, (settings.circle.height / 2) - 20);
     }
 
     //Get date as a string