pace: fix menu rendering

apps/pace/ChangeLog

@@ -2,3 +2,5 @@
 0.02: Show elapsed time on pause screen
 0.03: Avoid initial GPS skew and allow reset of time/splits
 0.04: Bump exstats module - show active time, not elapsed
+0.05: Fix menu display - don't draw over the menu and vice-versa. Require
+	double-tap for menu

apps/pace/README.md

@@ -5,7 +5,8 @@ A running pace app, useful for races. Will also record your splits and display t
 Drag up/down on the pause menu to scroll through your splits.
 Press the button to pause/resume - when resumed, pressing the button will pause instantly, regardless of whether the screen is locked.
 
+Double tap the pause screen to access a menu for finer control
+
 # Todo
 
 - Load splits on app start, button to reset (exs is always reset)
-- Show total time on pause screen

apps/pace/app.js

@@ -10,6 +10,7 @@
     });
     var S_1 = require("Storage");
     var drawTimeout_1;
+    var menuShown_1 = false;
     var splits_1 = [];
     var splitOffset_1 = 0, splitOffsetPx_1 = 0;
     var GPS_TIMEOUT_MS_1 = 30000;
@@ -129,6 +130,12 @@
         else
             resumeRun_1();
     };
+    var hideMenu_1 = function () {
+        if (!menuShown_1)
+            return;
+        Bangle.setUI();
+        menuShown_1 = false;
+    };
     exs_1.start();
     exs_1.stats.dist.on("notify", function (dist) {
         var prev = { time: 0, dist: 0 };
@@ -156,7 +163,7 @@
     });
     setWatch(function () { return onButton_1(); }, BTN1, { repeat: true });
     Bangle.on('drag', function (e) {
-        if (exs_1.state.active || e.b === 0)
+        if (exs_1.state.active || e.b === 0 || menuShown_1)
             return;
         splitOffsetPx_1 -= e.dy;
         if (splitOffsetPx_1 > 20) {
@@ -174,9 +181,10 @@
     Bangle.on('twist', function () {
         Bangle.setBacklight(1);
     });
-    Bangle.on('tap', function (_e) {
+    Bangle.on('tap', function (e) {
-        if (exs_1.state.active)
+        if (exs_1.state.active || menuShown_1 || !e.double)
             return;
+        menuShown_1 = true;
         var menu = {
             "": {
                 remove: function () {
@@ -184,16 +192,16 @@
                 },
             },
             "< Back": function () {
-                Bangle.setUI();
+                hideMenu_1();
             },
             "Zero time": function () {
                 exs_1.start();
                 exs_1.stop();
-                Bangle.setUI();
+                hideMenu_1();
             },
             "Clear splits": function () {
                 splits_1.splice(0, splits_1.length);
-                Bangle.setUI();
+                hideMenu_1();
             },
         };
         E.showMenu(menu);

apps/pace/app.ts

@@ -14,6 +14,7 @@ const exs = require("exstats").getStats(
 const S = require("Storage");
 
 let drawTimeout: TimeoutId | undefined;
+let menuShown = false;
 
 type Dist = number & { brand: 'dist' };
 type Time = number & { brand: 'time' };
@@ -171,6 +172,12 @@ const onButton = () => {
     resumeRun();
 };
 
+const hideMenu = () => {
+  if (!menuShown) return;
+  Bangle.setUI(); // calls `remove`, which handles redrawing
+  menuShown = false;
+}
+
 exs.start(); // aka reset
 
 exs.stats.dist.on("notify", (dist) => {
@@ -209,7 +216,7 @@ Bangle.on('lock', locked => {
 setWatch(() => onButton(), BTN1, { repeat: true });
 
 Bangle.on('drag', e => {
-  if (exs.state.active || e.b === 0) return;
+  if (exs.state.active || e.b === 0 || menuShown) return;
 
   splitOffsetPx -= e.dy;
   if (splitOffsetPx > 20) {
@@ -226,9 +233,11 @@ Bangle.on('twist', () => {
   Bangle.setBacklight(1);
 });
 
-Bangle.on('tap', _e => {
+Bangle.on('tap', e => {
-  if(exs.state.active) return;
+  // require a double tap, to avoid picking up menu "< Back" taps
+  if(exs.state.active || menuShown || !e.double) return;
 
+  menuShown = true;
   const menu: Menu = {
     "": {
       remove: () => {
@@ -236,16 +245,16 @@ Bangle.on('tap', _e => {
       },
     },
     "< Back": () => {
-      Bangle.setUI(); // calls `remove`, which handles redrawing
+      hideMenu();
     },
     "Zero time": () => {
       exs.start(); // calls reset
       exs.stop(); // re-pauses
-      Bangle.setUI();
+      hideMenu();
     },
     "Clear splits": () => {
       splits.splice(0, splits.length);
-      Bangle.setUI();
+      hideMenu();
     },
   };
 

apps/pace/metadata.json

@@ -1,7 +1,7 @@
 {
 	"id": "pace",
 	"name": "Pace",
-	"version": "0.04",
+	"version": "0.05",
 	"description": "Show pace and time running splits",
 	"icon": "app.png",
 	"tags": "run,running,fitness,outdoors",