analogquadclk 0.02: Fix fastloading memory leak and clockinfo overwritten by hands - fix #3378

apps/analogquadclk/ChangeLog

@@ -1 +1,2 @@
 0.01: New Clock!
+0.02: Fix fastloading memory leak and clockinfo overwritten by hands

apps/analogquadclk/app.js

@@ -1,3 +1,4 @@
+{
   const W = g.getWidth();
   const H = g.getHeight();
   const background = require("clockbg"); // image backgrounds
@@ -12,7 +13,7 @@ const MIN_BACK = 10;
   const HOUR_W = 10; // width of cleared area
   const MIN_W = 8;
 
-function get_hand(len, w, cornerw, overhang) {
+  const get_hand = function(len, w, cornerw, overhang) {
     return new Int8Array([
       0, overhang+w,
       -cornerw, overhang+cornerw,
@@ -25,7 +26,7 @@ function get_hand(len, w, cornerw, overhang) {
       w, overhang,
       cornerw, overhang+cornerw
     ]);
-}
+  };
   const hand_hour = get_hand(HOUR_LEN, 6, 4, HOUR_BACK);
   const hand_hour_bg = get_hand(HOUR_LEN, HOUR_W, 8, HOUR_BACK);
   const hand_minute = get_hand(MIN_LEN, 4, 3, MIN_BACK);
@@ -33,26 +34,26 @@ const hand_minute_bg = get_hand(MIN_LEN, MIN_W, 6, MIN_BACK);
 
 
   // schedule a draw for the next minute
-function queueDraw() {
+  let queueDraw = function() {
     if (drawTimeout) clearTimeout(drawTimeout);
     drawTimeout = setTimeout(function() {
       drawTimeout = undefined;
       draw();
     }, 60000 - (Date.now() % 60000));
-}
+  };
 
   // draw the clock hands
-function drawHands() {
+  let drawHands = function() {
     let h = date.getHours()*Math.PI/6, m = date.getMinutes()*Math.PI/30;
     g.setColor(g.theme.bg).fillPolyAA(g.transformVertices(hand_hour_bg,{x:W/2,y:H/2,rotate:h}));
     g.fillPolyAA(g.transformVertices(hand_minute_bg,{x:W/2,y:H/2,rotate:m}));
     g.setColor("#f00").fillPolyAA(g.transformVertices(hand_hour,{x:W/2,y:H/2,rotate:h}));
     g.setColor(g.theme.fg).fillPolyAA(g.transformVertices(hand_minute,{x:W/2,y:H/2,rotate:m}));
-}
+  };
 
   // return the screen area covered by clock hands (used for filling in background)
-function getHandBounds() {
+  let getHandBounds = function() {
-  let h = date.getHours()*Math.PI/6, m = date.getMinutes()*Math.PI/30;
+    let h = (date.getHours() + date.getMinutes()/60)*Math.PI/6, m = date.getMinutes()*Math.PI/30;
     let sh = Math.sin(h), ch = Math.cos(h), sm = Math.sin(m), cm = Math.cos(m);
     return {
       x1 : Math.round((W/2)+Math.min(sh*HOUR_LEN, sm*MIN_LEN, -sh*HOUR_BACK, -sm*MIN_BACK)-HOUR_W),
@@ -60,38 +61,61 @@ function getHandBounds() {
       x2 : Math.round((W/2)+Math.max(sh*HOUR_LEN, sm*MIN_LEN, -sh*HOUR_BACK, -sm*MIN_BACK)+HOUR_W),
       y2 : Math.round((H/2)-Math.min(ch*HOUR_LEN, cm*MIN_LEN, -ch*HOUR_BACK, -cm*MIN_BACK)+HOUR_W),
     };
-}
+  };
 
-function draw() {
+  let draw = function() {
     // queue next draw in one minute
     queueDraw();
     // work out locale-friendly date/time
-  date = new Date();
+    //date = new Date();
     //var timeStr = require("locale").time(date,1);
     //var dateStr = require("locale").date(date);
     // fill in area that we changed last time
     background.fillRect(lastModified.x1, lastModified.y1, lastModified.x2, lastModified.y2);
     if (!lastModified.first) { // first draw we don't have clockInfoMenuA/etc defined
-    if (lastModified.y1<30) {
+      //print(lastModified);
-      if (lastModified.x1 < 30) clockInfoMenuA.redraw();
+      if (lastModified.y1<40) {
-      if (lastModified.x2 > W-30) clockInfoMenuB.redraw();
+        if (lastModified.x1 < 40 ||
+            (lastModified.x1 < W/2 && lastModified.y1 < 16)) clockInfoMenuA.redraw();
+        if (lastModified.x2 > W-40 ||
+            (lastModified.x1 > W/2 && lastModified.y1 < 16)) clockInfoMenuB.redraw();
       }
-    if (lastModified.y2>W-20) {
+      if (lastModified.y2>W-40) {
-      if (lastModified.x1 < 30) clockInfoMenuD.redraw();
+        if (lastModified.x1 < 40 ||
-      if (lastModified.x2 > W-30) clockInfoMenuC.redraw();
+            (lastModified.x1 < W/2 && lastModified.y2>W-16)) clockInfoMenuD.redraw();
+        if (lastModified.x2 > W-40 ||
+            (lastModified.x1 > W/2 && lastModified.y2>W-16)) clockInfoMenuC.redraw();
       }
     }
     // draw hands
     drawHands();
     lastModified = getHandBounds();
     //g.drawRect(lastModified); // debug
-}
+  };
 
   // Clear the screen once, at startup
   background.fillRect(0, 0, W - 1, H - 1);
   // draw immediately at first, queue update
   draw();
 
+  let clockInfoMenuA, clockInfoMenuB, clockInfoMenuC, clockInfoMenuD;
+  // Show launcher when middle button pressed
+  Bangle.setUI({
+    mode: "clock",
+    remove: function() {
+      if (drawTimeout) clearTimeout(drawTimeout);
+      drawTimeout = undefined;
+      if (clockInfoMenuA) clockInfoMenuA.remove();
+      if (clockInfoMenuB) clockInfoMenuB.remove();
+      if (clockInfoMenuC) clockInfoMenuC.remove();
+      if (clockInfoMenuD) clockInfoMenuD.remove();
+      require("widget_utils").show(); // re-show widgets
+    }
+  });
+  // Load widgets
+  Bangle.loadWidgets();
+  require("widget_utils").hide();
+
   // used for clockinfo image rendering
   let clockInfoG = Graphics.createArrayBuffer(28, 28, 2, {msb:true});
   clockInfoG.transparent = 3;
@@ -200,28 +224,28 @@ if (clockInfoItemsBangle) {
 
   // Add the 4 clockinfos
   const CLOCKINFOSIZE = 50;
-let clockInfoMenuA = require("clock_info").addInteractive(clockInfoItems, {
+  clockInfoMenuA = require("clock_info").addInteractive(clockInfoItems, {
     x: 0,
     y: 0,
     w: CLOCKINFOSIZE,
     h: CLOCKINFOSIZE,
     draw: clockInfoDraw
   });
-let clockInfoMenuB = require("clock_info").addInteractive(clockInfoItems, {
+  clockInfoMenuB = require("clock_info").addInteractive(clockInfoItems, {
     x: W - CLOCKINFOSIZE,
     y: 0,
     w: CLOCKINFOSIZE,
     h: CLOCKINFOSIZE,
     draw: clockInfoDraw
   });
-let clockInfoMenuC = require("clock_info").addInteractive(clockInfoItems, {
+  clockInfoMenuC = require("clock_info").addInteractive(clockInfoItems, {
     x: W - CLOCKINFOSIZE,
     y: H - CLOCKINFOSIZE,
     w: CLOCKINFOSIZE,
     h: CLOCKINFOSIZE,
     draw: clockInfoDraw
   });
-let clockInfoMenuD = require("clock_info").addInteractive(clockInfoItems, {
+  clockInfoMenuD = require("clock_info").addInteractive(clockInfoItems, {
     x: 0,
     y: H - CLOCKINFOSIZE,
     w: CLOCKINFOSIZE,
@@ -229,14 +253,7 @@ let clockInfoMenuD = require("clock_info").addInteractive(clockInfoItems, {
     draw: clockInfoDraw
   });
 
-// Show launcher when middle button pressed
+  /*setInterval(function() {
-Bangle.setUI({
+    date.ms += 60000; draw();
-  mode: "clock",
+  }, 500);*/
-  remove: function() {
-    if (drawTimeout) clearTimeout(drawTimeout);
-    clockInfoMenuA.remove();
   }
-});
-// Load widgets
-Bangle.loadWidgets();
-require("widget_utils").hide();

apps/analogquadclk/metadata.json

@@ -1,7 +1,7 @@
 { "id": "analogquadclk",
   "name": "Analog Quad Clock",
   "shortName":"Quad Clock",
-  "version":"0.01",
+  "version":"0.02",
   "description": "An analog clock with clockinfos in each of the 4 corners, allowing 4 different data types to be rendered at once",
   "icon": "icon.png",
   "screenshots" : [ { "url":"screenshot.png" }, { "url":"screenshot2.png" } ],