First atempt to HR indication

apps/rclock/rclock.app.js

@@ -4,6 +4,14 @@
   var hours;
   var date;
   var first = true;
+  var locale = require('locale');
+  var _12hour = (require("Storage").readJSON("setting.json", 1) || {})["12hour"] || false;
+
+  //HR variables
+  var color="#FF0000";
+  var id=0;
+  var size=10;
+  var grow=true;
 
   const screen = {
     width: g.getWidth(),
@@ -41,17 +49,7 @@
   };
 
   const dateStr = function (date) {
-    day = date.getDate();
-    month = date.getMonth();
-    year = date.getFullYear();
-    if (day < 10) {
-      day = "0" + day;
-    }
-    if (month < 10) {
-      month = "0" + month;
-    }
-
-    return year + "-" + month + "-" + day;
+    return locale.date(new Date(), 1);
   };
 
   const getArcXY = function (centerX, centerY, radius, angle) {
@@ -72,7 +70,7 @@
     //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) {
@@ -84,7 +82,7 @@
     //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 drawClock = function () {
@@ -128,14 +126,34 @@
     //Update seconds when needed
     if (seconds != currentTime.getSeconds()) {
       seconds = currentTime.getSeconds();
-      drawSecArc(seconds,  settings.circle.colorsec);
+      drawSecArc(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.setColor(settings.time.color);
     g.setFont(settings.time.font, settings.time.size);
-    g.drawString(hours, settings.time.center, settings.time.middle);
+    g.drawString(timestr, settings.time.center, settings.time.middle);
 
     //Write the date as configured in the settings
     g.setColor(settings.date.color);
@@ -147,15 +165,57 @@
     if (on) drawClock();
   });
 
+
+//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 (hr) {
+    if (grow && size < 12) {
+      size++;
+    }
+
+    if (!grow && size > 3) {
+      size--;
+    }
+
+    if (size == 12 || size == 3) {
+      grow = !grow;
+    }
+
+    if (grow) {
+      color = "#f0af00";
+      g.setColor(color);
+      g.fillCircle(settings.circle.center, settings.circle.middle, size);
+    } else {
+      color = "#000000";
+      g.setColor(color);
+      g.drawCircle(settings.circle.center, settings.circle.middle, size);
+    }
+    print(size);
+  };
+
   // clean app screen
   g.clear();
-  g.setFontAlign( 0, 0, 0);
+  g.setFontAlign(0, 0, 0);
   Bangle.loadWidgets();
   Bangle.drawWidgets();
 
   // refesh every 30 sec
   setInterval(drawClock, 1E3);
 
+  //start HR monitor and draw heart rate
+  Bangle.setHRMPower(1);
+  Bangle.on('HRM', function (d) {
+    newBeats(d);
+  });
+
   // draw now
   drawClock();