Integrate KiezelPay/Fitbit_Realistic_HRM

5 files changed, 55 insertions, 57 deletions

diff --git a/app/hrm.js b/app/hrm.js
index d3f1483..fe3d120 100644
--- a/app/hrm.js
+++ b/app/hrm.js
@@ -2,11 +2,14 @@ import document from "document";
 import { HeartRateSensor } from "heart-rate";
 import { display } from "display";
 import { me } from "appbit";
+import * as util from "./utils";
 
 
 var hrImage = document.getElementById("hrImage");
 var hrIcon = document.getElementById("hrIcon");
-var hrText = document.getElementById("hrText");
+let hr1 = document.getElementById("hr1");
+let hr2 = document.getElementById("hr2");
+let hr3 = document.getElementById("hr3");
 
 var hrm = null;
 var lastMeasuredHR = 0;
@@ -27,7 +30,7 @@ function getHRMReading() {
         //show as not active
         hrmActive = false;
         setHRIconColor();
-        showHRMValue("--");
+        showHRMValue("---");
       }
     }
     else {
@@ -68,12 +71,38 @@ function setHRIconColor() {
   }
   else {
     hrImage.animate("disable");
-    hrIcon.style.fill = "#CCCCCC";
+    hrIcon.style.fill = "#ffffff";
   }
 }
 
 function showHRMValue(newHRMValue) {
-  hrText.text = newHRMValue;
+  let digits = [hr1, hr2, hr3];
+  let lastNonZeroIndex = 3;
+
+  for (let i = 2; i >= 0; i--) {
+    var digit;
+    if (newHRMValue === "---")
+    {
+      digit = "-";
+    }
+    else {
+      digit = newHRMValue % 10;
+      newHRMValue = Math.floor(newHRMValue / 10);
+    }
+
+    if (digit != 0) {
+      lastNonZeroIndex = i;
+    }
+
+    util.drawDigit(digit, digits[i]);
+    digits[i].style.opacity = 1;
+  }
+
+  // Darken leading zeroes
+  for (let i = 0; i < lastNonZeroIndex; i++)
+  {
+    digits[i].style.opacity = 0.2;
+  }
 }
 
 function startHRMeasurements() {
@@ -97,7 +126,7 @@ function stopHRMeasurements() {
 }
 
 export function initialize() {
-  hrText.text = '--';
+  showHRMValue('---');
   if (me.permissions.granted("access_heart_rate")) {
     hrm = new HeartRateSensor();
     if (display.on) {
diff --git a/app/index.js b/app/index.js
index 8fab4d0..50e4f36 100644
--- a/app/index.js
+++ b/app/index.js
@@ -5,7 +5,7 @@ import * as fs from "fs";
 import * as messaging from "messaging";
 import { preferences } from "user-settings";
 import * as util from "./utils";
-import { HeartRateSensor } from "heart-rate";
+import * as hrm from "./hrm";
 import { display } from "display";
 import { today } from "user-activity";
 
@@ -87,20 +87,7 @@ clock.ontick = evt => {
   }
 }
 
-if (HeartRateSensor && me.permissions.granted("access_heart_rate")) {
-  let hrm = new HeartRateSensor({ frequency: 1 });
-  hrm.addEventListener("reading", () => {
-    setHeartRate(hrm.heartRate);
-  });
-  display.addEventListener("change", () => {
-    display.on ? hrm.start() : hrm.stop();
-  });
-  hrm.start();
-} else {
-  hr1.style.visibility = "hidden";
-  hr2.style.visibility = "hidden";
-  hr3.style.visibility = "hidden";
-}
+hrm.initialize();
 
 // Apply theme colors to elements
 function applyTheme(background, foreground) {
@@ -131,8 +118,8 @@ function setMins(val) {
 }
 
 function setDate(val) {
-  drawDigit(Math.floor(val / 10), date1);
-  drawDigit(Math.floor(val % 10), date2);
+  util.drawDigit(Math.floor(val / 10), date1);
+  util.drawDigit(Math.floor(val % 10), date2);
 }
 
 function setDay(val) {
@@ -150,29 +137,6 @@ function setDay(val) {
   }
 }
 
-function setHeartRate(val) {
-  let digits = [hr1, hr2, hr3];
-  let lastNonZeroIndex = 3;
-
-  for (let i = 2; i >= 0; i--) {
-    let digit = val % 10;
-    val = Math.floor(val / 10);
-
-    if (digit != 0) {
-      lastNonZeroIndex = i;
-    }
-
-    drawDigit(digit, digits[i]);
-    digits[i].style.opacity = 1;
-  }
-
-  // Darken leading zeroes
-  for (let i = 0; i < lastNonZeroIndex; i++)
-  {
-    digits[i].style.opacity = 0.2;
-  }
-}
-
 function setActivity(activity, val) {
   // Can't rely on $+ syntax because text is right-aligned.
   // Move container closer to edge for each 1; all other digits are the same width.
@@ -194,7 +158,7 @@ function setActivity(activity, val) {
       position += 7;
     }
 
-    drawDigit(digit, digits[i]);
+    util.drawDigit(digit, digits[i]);
     digits[i].style.opacity = 1;
   }
 
@@ -211,15 +175,6 @@ function drawNumeral(val, place) {
   place.image = `numerals/${val}.png`;
 }
 
-function drawDigit(val, place) {
-  place.image = `quantifier/${val}.png`
-  if (val == 1) {
-    place.width = 11;
-  } else {
-    place.width = 18;
-  }
-}
-
 function getDayImg(index) {
   let days = ["sun", "mon", "tue", "wed", "thu", "fri", "sat"];
   return `quantifier/${days[index]}.png`;
diff --git a/app/utils.js b/app/utils.js
index d401564..53ab424 100644
--- a/app/utils.js
+++ b/app/utils.js
@@ -5,3 +5,12 @@ export function zeroPad(i) {
   }
   return i;
 }
+
+export function drawDigit(val, place) {
+  place.image = `quantifier/${val}.png`
+  if (val == 1) {
+    place.width = 11;
+  } else {
+    place.width = 18;
+  }
+}
diff --git a/resources/index.gui b/resources/index.gui
index eb63cb2..c221b91 100644
--- a/resources/index.gui
+++ b/resources/index.gui
@@ -1,4 +1,8 @@
 <svg class="background">
+  <symbol id="animatedHRImage">
+    <image id="hrIcon" width="24" height="24" href="icons/stat_hr_solid_24px.png" load="sync" fill="#ffffff"/>
+    <animate attributeName="opacity" begin="enable" end="disable" final="restore" from="1" to="0" dur="1" />
+  </symbol>
   <svg x="6" y="64">
     <image id="day" href="quantifier/mon.png" x="$+3" width="66" height="21" fill="#FFFFFF" class="foreground" />
     <image id="date1" href="quantifier/3.png" x="$+15" width="18" height="21" fill="#FFFFFF" class="foreground" />
@@ -12,8 +16,8 @@
     <image id="mins2" href="numerals/8.png" x="234" y="100" width="60" height="122" fill="#FFFFFF" class="foreground" />
   </svg>
   <svg x="6" y="237">
-    <image id="hr-icon" href="icons/stat_hr_solid_24px.png" width="24" height="24" fill="#ffffff" class="foreground" />
-    <image id="hr1" href="quantifier/0.png" x="$+3" width="18" height="21" fill="#ffffff" class="foreground" />
+    <use id="hrImage" href="#animatedHRImage" />
+    <image id="hr1" href="quantifier/0.png" x="33" width="18" height="21" fill="#ffffff" class="foreground" />
     <image id="hr2" href="quantifier/0.png" x="$+3" width="18" height="21" fill="#ffffff" class="foreground" />
     <image id="hr3" href="quantifier/0.png" x="$+3" width="18" height="21" fill="#ffffff" class="foreground" />
   </svg>
@@ -27,3 +31,4 @@
     <image id="act6" href="quantifier/6.png" x="$+3" width="18" height="21" fill="#ffffff" class="foreground" />
   </svg>
 </svg>
+  
\ No newline at end of file
diff --git a/resources/quantifier/-.png b/resources/quantifier/-.png
new file mode 100644
index 0000000..e71212e
--- /dev/null
+++ b/resources/quantifier/-.png