feat: Add time since last reading

gabe565 · May 9, 2024 · 771ce2f · 771ce2f
1 parent 7315492
commit 771ce2f
Show file tree

Hide file tree

Showing 3 changed files with 76 additions and 22 deletions.
diff --git a/src/com.gabe565.nightscout.sdPlugin/js/Nightscout.js b/src/com.gabe565.nightscout.sdPlugin/js/Nightscout.js
@@ -32,24 +32,27 @@ class Nightscout {
       }
       this.url = new URL(this.settings.nightscoutUrl);
       this.url.pathname += "api/v2/properties/bgnow,buckets,delta,direction";
-      this.beginTick();
+      this.start();
     }
   }
 
-  async tick() {
+  async fetch() {
     if (!this.url) {
       return;
     }
 
+    this.fetchTimeout = null;
+
     let sleepMs = 60000;
     try {
       const response = await fetch(this.url, this.request);
-      const data = await response.json();
-      $SD.setImage(this.context, this.template.render(data, this.settings.unit));
-      const bucket = data?.buckets[0];
+      this.response = await response.json();
+      this.render();
+
+      const bucket = this.response?.buckets[0];
       if (bucket) {
-        const lastDiff = bucket.toMills - bucket.fromMills;
-        const nextRead = data?.bgnow?.mills + lastDiff + 30000;
+        const lastDiff = bucket?.toMills - bucket?.fromMills;
+        const nextRead = this.response?.bgnow.mills + lastDiff + 30000;
         const now = Date.now();
         if (nextRead - now > 0) {
           sleepMs = nextRead - now;
@@ -59,25 +62,64 @@ class Nightscout {
       console.error(err);
       $SD.showAlert(this.context);
     }
-    this.tickTimeout = setTimeout(() => this.tick(), sleepMs);
+
+    if (!this.fetchTimeout) {
+      this.fetchTimeout = setTimeout(() => this.fetch(), sleepMs);
+    }
   }
 
-  beginTick() {
+  render() {
+    if (!this.response) {
+      return;
+    }
+
+    this.renderTimeout = null;
+
+    const image = this.template.render(this.response, this.settings.unit);
+    if (image) {
+      $SD.setImage(this.context, image);
+      if (!this.renderTimeout) {
+        let sleepMs = 60000;
+        try {
+          const mills = this.response.bgnow.mills;
+          if (mills) {
+            let diff = (Date.now() - mills) % 60000;
+            sleepMs = 60000 - diff;
+          }
+        } catch (err) {
+          console.error(err);
+        }
+
+        if (!this.renderTimeout) {
+          this.renderTimeout = setTimeout(() => this.render(), sleepMs);
+        }
+      }
+    }
+  }
+
+  async start() {
     if (!this.url) {
       return;
     }
 
-    this.stopTick();
-    this.tick();
+    this.stop();
+    await this.fetch();
   }
 
-  stopTick() {
-    clearTimeout(this.tickTimeout);
-    this.tickTimeout = null;
+  stop() {
+    if (this.fetchTimeout) {
+      clearTimeout(this.fetchTimeout);
+    }
+    this.fetchTimeout = null;
+
+    if (this.renderTimeout) {
+      clearTimeout(this.renderTimeout);
+    }
+    this.renderTimeout = null;
   }
 
   delete() {
-    this.stopTick();
+    this.stop();
     delete nightscoutMap[this.context];
   }
 }
diff --git a/src/com.gabe565.nightscout.sdPlugin/js/Template.js b/src/com.gabe565.nightscout.sdPlugin/js/Template.js
@@ -26,24 +26,36 @@ class Template {
     const imgHeight = Height / 4;
     context.drawImage(this.img, 10, Height / 2 - imgHeight / 2, imgWidth, imgHeight);
 
-    context.fillStyle = "white";
+    context.fillStyle = "#fff";
     context.textAlign = "center";
     context.font = "36px Verdana";
     let last = data.bgnow.last;
     if (unit === Unit.Mmol) {
       last = Math.round(last * ConversionFactor * 10) / 10;
     }
-    context.fillText(last, Width / 2 + 20, Height / 2);
+    context.fillText(last, Width / 2 + 20, Height / 2 - 10);
 
-    context.font = "26px Verdana";
+    context.font = "25px Verdana";
+    context.fillStyle = "#ddd";
     let delta = data.delta.display;
     if (unit === Unit.Mmol) {
       delta = Math.round(data.delta.scaled * ConversionFactor * 10) / 10;
       if (delta >= 0) {
         delta = "+" + delta;
       }
     }
-    context.fillText(`${data.direction.label} ${delta}`, Width / 2 + 20, Height / 2 + 30);
+    context.fillText(`${data.direction.label} ${delta}`, Width / 2 + 20, Height / 2 + 20);
+
+    context.font = "22px Verdana";
+    context.fillStyle = "#777";
+    const ago = ((Date.now() - data.bgnow.mills) / 1000 / 60) | 0;
+    let agoDisplay;
+    if (ago > 5) {
+      agoDisplay = ago + "m";
+    } else {
+      agoDisplay = "–".repeat(ago);
+    }
+    context.fillText(agoDisplay, Width / 2 + 20, Height / 2 + 50);
 
     return this.canvas.toDataURL();
   }

diff --git a/src/com.gabe565.nightscout.sdPlugin/js/app.js b/src/com.gabe565.nightscout.sdPlugin/js/app.js
@@ -8,15 +8,15 @@ nightscoutAction.onDidReceiveSettings((data) =>
   new Nightscout(data).setSettings(data.payload.settings),
 );
 
-nightscoutAction.onKeyDown((data) => new Nightscout(data).beginTick());
+nightscoutAction.onKeyDown((data) => new Nightscout(data).start());
 
 nightscoutAction.onWillDisappear((data) => {
   const ns = new Nightscout(data);
   if (Object.keys(data.payload.settings).length === 0) {
     ns.delete();
   } else {
-    ns.stopTick();
+    ns.stop();
   }
 });
 
-nightscoutAction.onWillAppear((data) => new Nightscout(data).beginTick());
+nightscoutAction.onWillAppear((data) => new Nightscout(data).start());