More testing and tweaking of existing clock apps

apps.json

@@ -312,7 +312,7 @@
   { "id": "impwclock",
     "name": "Imprecise Word Clock",
     "icon": "clock-impword.png",
-    "version":"0.02",
+    "version":"0.03",
     "description": "Imprecise word clock for vacations, weekends, and those who never need accurate time.",
     "tags": "clock",
     "type":"clock",
@@ -1785,7 +1785,7 @@
     "name": "SWL Clock / Short Wave Listner Clock",
     "shortName": "SWL Clock",
     "icon": "swlclk.png",
-    "version":"0.01",
+    "version":"0.02",
     "description": "Display Local, UTC time and some programs on the shorts waves along the day, with the frequencies",
     "tags": "tool,clock",
     "type":"clock",
@@ -1801,7 +1801,7 @@
     "name": "Round clock with seconds,  minutes and date",
     "shortName": "Round Clock",
     "icon": "app.png",
-    "version": "0.05",
+    "version": "0.06",
     "description": "Designed round clock with ticks for minutes and seconds and heart rate indication",
     "tags": "clock",
     "type": "clock",
@@ -1815,7 +1815,7 @@
     "name": "fclock",
     "shortName": "F Clock",
     "icon": "app.png",
-    "version": "0.01",
+    "version": "0.02",
     "description": "Simple design of a digital clock",
     "tags": "clock",
     "type": "clock",
@@ -2623,7 +2623,7 @@
   "name": "ISO Compliant Clock Face",
   "shortName":"ISO Clock",
   "icon": "isoclock.png",
-  "version":"0.01",
+  "version":"0.02",
   "description": "Tweaked fork of digiclock for ISO date and time",
   "tags": "clock",
   "type" : "clock",
@@ -2781,7 +2781,7 @@
 { "id": "lazyclock",
   "name": "Lazy Clock",
   "icon": "lazyclock.png",
-  "version":"0.02",
+  "version":"0.03",
   "readme": "README.md",
   "description": "Tells the time, roughly",
   "tags": "clock",
@@ -2821,13 +2821,13 @@
   "name": "Game of Life Clock",
   "shortName":"Conway's Clock",
   "icon": "app.png",
-  "version":"0.05",
+  "version":"0.06",
   "description": "Modification and clockification of Conway's Game of Life",
   "tags": "clock",
   "type" : "clock",
   "readme": "README.md",
   "storage": [
-    {"name":"lifeclk.app.js","url":"app.js"},
+    {"name":"lifeclk.app.js","url":"app.min.js"},
     {"name":"lifeclk.img","url":"app-icon.js","evaluate":true}
   ]
 },
@@ -3347,7 +3347,7 @@
 { "id": "mysticclock",
   "name": "Mystic Clock",
   "icon": "mystic-clock.png",
-  "version":"1.00",
+  "version":"1.01",
   "description": "A retro-inspired watchface featuring time, date, and an interactive data display line.",
   "tags": "clock",
   "type":"clock",

apps/fclock/ChangeLog

@@ -1 +1,2 @@
 0.01: First published version of app
+0.02: Move to Bangle.setUI to launcher support

apps/fclock/fclock.app.js

@@ -1,27 +1,26 @@
-{
+var minutes;
-  var minutes;
+var seconds;
-  var seconds;
+var hours;
-  var hours;
+var date;
-  var date;
+var first = true;
-  var first = true;
+var locale = require('locale');
-  var locale = require('locale');
+var _12hour = (require("Storage").readJSON("setting.json", 1) || {})["12hour"] || false;
-  var _12hour = (require("Storage").readJSON("setting.json", 1) || {})["12hour"] || false;
 
-  //HR variables
+//HR variables
-  var id = 0;
+var id = 0;
-  var grow = true;
+var grow = true;
-  var size=10;
+var size=10;
 
-  //Screen dimensions
+//Screen dimensions
-  const screen = {
+const screen = {
   width: g.getWidth(),
   height: g.getWidth(),
   middle: g.getWidth() / 2,
   center: g.getHeight() / 2,
-  };
+};
 
-  // Ssettings
+// Ssettings
-  const settings = {
+const settings = {
   time: {
     color: '#dddddd',
     font: 'Vector',
@@ -50,21 +49,21 @@
     x: screen.center,
     y: screen.middle + 65
   }
-  };
+};
 
-  const dateStr = function (date) {
+const dateStr = function (date) {
   return locale.date(new Date(), 1);
-  };
+};
 
-  const getFormated = function(val) {
+const getFormated = function(val) {
   if (val<10) {
     val='0'+val;
   }
 
   return val;
-  };
+};
 
-  const drawMin = function (sections, color) {
+const drawMin = function (sections, color) {
 
   g.setFontAlign(0, 0, 0);
   g.setColor('#000000');
@@ -73,9 +72,9 @@
   g.setColor(settings.time.color);
   g.setFont(settings.time.font, settings.time.size/2);
   g.drawString(getFormated(sections), settings.time.center+50, settings.time.middle);
-  };
+};
 
-  const drawSec = function (sections, color) {
+const drawSec = function (sections, color) {
   g.setFontAlign(0, 0, 0);
   g.setColor('#000000');
   g.setFont(settings.time.font, settings.time.size/4);
@@ -83,9 +82,9 @@
   g.setColor(settings.time.color);
   g.setFont(settings.time.font, settings.time.size/4);
   g.drawString(getFormated(sections), settings.time.center+100, settings.time.middle);
-  };
+};
 
-  const drawClock = function () {
+const drawClock = function () {
 
   currentTime = new Date();
 
@@ -138,19 +137,19 @@
   g.setColor(settings.date.color);
   g.setFont(settings.date.font, settings.date.size);
   g.drawString(date, settings.date.center, settings.date.middle);
-  };
+};
 
-  //setInterval for HR visualisation
+//setInterval for HR visualisation
-  const newBeats = function (hr) {
+const newBeats = function (hr) {
   if (id != 0) {
     changeInterval(id, 6e3 / hr.bpm);
   } else {
     id = setInterval(drawHR, 6e3 / hr.bpm);
   }
-  };
+};
 
-  //visualize HR with circles pulsating
+//visualize HR with circles pulsating
-  const drawHR = function () {
+const drawHR = function () {
   if (grow && size < settings.hr.size) {
     size++;
   }
@@ -172,35 +171,33 @@
     g.setColor(color);
     g.drawCircle(settings.hr.x, settings.hr.y, size);
   }
-  };
+};
 
-  // clean app screen
+// clean app screen
-  g.clear();
+g.clear();
-  Bangle.loadWidgets();
+Bangle.loadWidgets();
-  Bangle.drawWidgets();
+Bangle.drawWidgets();
 
-  //manage when things should be enabled and not
+//manage when things should be enabled and not
-  Bangle.on('lcdPower', function (on) {
+Bangle.on('lcdPower', function (on) {
   if (on) {
     Bangle.setHRMPower(1);
   } else {
     Bangle.setHRMPower(0);
   }
-  });
+});
 
-  // refesh every second
+// refesh every second
-  setInterval(drawClock, 1E3);
+setInterval(drawClock, 1E3);
 
-  //start HR monitor and update frequency of update
+//start HR monitor and update frequency of update
-  Bangle.setHRMPower(1);
+Bangle.setHRMPower(1);
-  Bangle.on('HRM', function (d) {
+Bangle.on('HRM', function (d) {
   newBeats(d);
-  });
+});
 
-  // draw now
+// draw now
-  drawClock();
+drawClock();
 
-  // Show launcher when middle button pressed
+// Show launcher when button pressed
-  setWatch(Bangle.showLauncher, BTN2, { repeat: false, edge: "falling" });
+Bangle.setUI("clock");
-
-} 

apps/impwclock/ChangeLog

@@ -1,2 +1,3 @@
 0.01: New App!
 0.02: Stopped watchface from flashing every interval
+0.03: Move to Bangle.setUI to launcher support

apps/impwclock/clock-impword.js

@@ -47,10 +47,9 @@ const activeColorNight = 0xF800 /*red*/ ;
 const activeColorDay = 0xFFFF /* white */;
 
 var hidxPrev;
+var showDigitalTime = false;
 
 function drawWordClock() {
-
-
   // get time
   var t = new Date();
   var h = t.getHours();
@@ -141,7 +140,7 @@ function drawWordClock() {
 
   // Display digital time while button 1 is pressed
   g.clearRect(0, 215, 240, 240);
-  if (BTN1.read()){
+  if (showDigitalTime){
     g.setColor(activeColor);
     g.drawString(time, 120, 215);
   }
@@ -158,8 +157,20 @@ Bangle.drawWidgets();
 setInterval(drawWordClock, 1E4);
 drawWordClock();
 
-// Show digital time while top button is pressed
+// Show digital time while top button is pressed (if we have physical buttons)
-setWatch(drawWordClock, BTN1, {repeat:true,edge:"both"});
+if (global.BTN3) setWatch(function() {
+  showDigitalTime = BTN1.read();
+  drawWordClock();
+}, BTN1, {repeat:true,edge:"both"});
 
-// Show launcher when middle button pressed
+// If LCD pressed (on Bangle.js 2) draw digital time
-setWatch(Bangle.showLauncher, BTN2, {repeat:false,edge:"falling"});
+Bangle.on('drag',e=>{
+  var pressed = e.b!=0;
+  if (pressed!=showDigitalTime) {
+    showDigitalTime = pressed;
+    drawWordClock();
+  }
+});
+
+// Show launcher when button pressed
+Bangle.setUI("clock");

apps/isoclock/ChangeLog

@@ -1 +1,2 @@
 0.01: Created app based on digiclock with some small tweaks.
+0.02: Swap to Bangle.setUI for launcher/buttons

apps/isoclock/isoclock.js

@@ -92,4 +92,5 @@ Bangle.on('lcdPower',on=>{
 Bangle.loadWidgets();
 Bangle.drawWidgets();
 
-setWatch(Bangle.showLauncher, BTN2, {repeat : false, edge: "falling"}); 
+// Show launcher when button pressed
+Bangle.setUI("clock");

apps/lazyclock/ChangeLog

@@ -1,2 +1,3 @@
 0.01: Launch app
 0.02: Fix bug with the elusive one o'clock monster; Only change template when going over boundaries; Re-jig wording options
+0.03: Use Bangle.setUI for launcher/buttons

apps/lazyclock/lazyclock-app.js

@@ -221,22 +221,13 @@ function addEvents() {
     }
   });
 
-  setWatch(switchMode, BTN1, {
+  // Show launcher when button pressed
-    repeat: true,
+  Bangle.setUI("clockupdown", btn=>{
-    edge: "falling"
+    if (btn<0) switchMode();
-  });
+    if (btn>0) {
-
-  setWatch(Bangle.showLauncher, BTN2, {
-    repeat: false,
-    edge: "falling"
-  });
-
-  setWatch(() => {
       currentFormatter = null;
       refreshTime();
-  }, BTN3, {
+    }
-    repeat: true,
-    edge: "falling"
   });
 }
 

apps/lifeclk/ChangeLog

@@ -3,3 +3,4 @@
 0.03: Ah yes. Some people prefer the 12 hour system 2021-01-14
 0.04: Fixed a bug, doesn't run while display's on now 2021-01-18
 0.05: Fixed a bug, doesn't count the time it was asleep when calculating the update time 2021-01-19
+0.06: Use Bangle.set UI, change to unminified upload to ensure this works ok on Bangle.js

apps/lifeclk/app.min.js

@@ -1,4 +1,4 @@
-Bangle.setLCDTimeout(30);
+// Name as .min.js so we don't try and pretokenise (which stops Bangle.js running this somehow)
 
 const is12Hour = (require("Storage").readJSON("setting.json",1)||{})["12hour"];
 
@@ -435,9 +435,11 @@ function showMinAgain(){
 }
 
 function setButtons(){
-  setWatch(showMinAgain, BTN1, {repeat:true,edge:"falling"});
+  // Show launcher when button pressed
-  setWatch(Bangle.showLauncher, BTN2, {repeat:false,edge:"falling"});
+  Bangle.setUI("clockupdown", btn=>{
-  setWatch(regen, BTN3, {repeat:true,edge:"falling"});
+    if (btn<0) showMinAgain();
+    if (btn>0) regen();
+  });
 }
 
 let wentToSleepAt;

apps/mysticclock/ChangeLog

@@ -1 +1,2 @@
 1.00: First published version.
+1.01: Use Bangle.setUI for Launcher/buttons

apps/mysticclock/mystic-clock-app.js

@@ -200,16 +200,9 @@ if (Bangle.isLCDOn()) {
   drawAll(); // draw immediately
 }
 
-// show launcher when middle button pressed
+// Show launcher when button pressed
-setWatch(Bangle.showLauncher, BTN2, { repeat: false, edge: "falling" });
+Bangle.setUI("clockupdown", btn=>{
-
+  if (btn<0) prevInfo();
-// rotate through info when the buttons are pressed
+  if (btn>0) nextInfo();
-setWatch(() => {
-  nextInfo();
   drawAll();
-}, BTN3, { repeat: true });
+});
-
-setWatch(() => {
-    prevInfo();
-    drawAll();
-}, BTN1, { repeat: true });

apps/rclock/ChangeLog

@@ -3,3 +3,5 @@
 0.03: Added HR indication to clock
 0.04: Update font size and alignment
 0.05: Changes which circle show minutes and seconds
+0.06: Avoid function wrapper, use setUI for launcher
+      Clock face smaller so no longer breaks widgets

apps/rclock/rclock.app.js

@@ -1,27 +1,26 @@
-{
+var minutes;
-  var minutes;
+var seconds;
-  var seconds;
+var hours;
-  var hours;
+var date;
-  var date;
+var first = true;
-  var first = true;
+var locale = require('locale');
-  var locale = require('locale');
+var _12hour = (require("Storage").readJSON("setting.json", 1) || {})["12hour"] || false;
-  var _12hour = (require("Storage").readJSON("setting.json", 1) || {})["12hour"] || false;
 
-  //HR variables
+//HR variables
-  var id = 0;
+var id = 0;
-  var grow = true;
+var grow = true;
-  var size=10;
+var size=10;
 
-  //Screen dimensions
+//Screen dimensions
-  const screen = {
+const screen = {
   width: g.getWidth(),
   height: g.getWidth(),
   middle: g.getWidth() / 2,
   center: g.getHeight() / 2,
-  };
+};
 
-  // Ssettings
+// Settings
-  const settings = {
+const settings = {
   time: {
     color: '#D6ED17',
     font: 'Vector',
@@ -42,7 +41,7 @@
     width: 10,
     middle: screen.middle,
     center: screen.center,
-      height: screen.height
+    height: screen.height-24
   },
   hr: {
     color: '#333333',
@@ -50,47 +49,47 @@
     x: screen.center,
     y: screen.middle + 45
   }
-  };
+};
 
-  const dateStr = function (date) {
+const dateStr = function (date) {
   return locale.date(new Date(), 1);
-  };
+};
 
-  const getArcXY = function (centerX, centerY, radius, angle) {
+const getArcXY = function (centerX, centerY, radius, angle) {
   var s, r = [];
   s = 2 * Math.PI * angle / 360;
   r.push(centerX + Math.round(Math.cos(s) * radius));
   r.push(centerY + Math.round(Math.sin(s) * radius));
 
   return r;
-  };
+};
 
-  const drawMinArc = function (sections, color) {
+const drawMinArc = function (sections, color) {
   g.setColor(color);
-    rad = (settings.circle.height / 2) - 40;
+  var rad = (settings.circle.height / 2) - 40;
-    r1 = getArcXY(settings.circle.middle, settings.circle.center, rad, sections * (360 / 60) - 90);
+  var r1 = getArcXY(settings.circle.middle, settings.circle.center, rad, sections * (360 / 60) - 90);
   //g.setPixel(r[0],r[1]);
-    r2 = getArcXY(settings.circle.middle, settings.circle.center, rad - settings.circle.width, sections * (360 / 60) - 90);
+  var r2 = getArcXY(settings.circle.middle, settings.circle.center, rad - settings.circle.width, sections * (360 / 60) - 90);
   //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);
-  };
+};
 
-  const drawSecArc = function (sections, color) {
+const drawSecArc = function (sections, color) {
   g.setColor(color);
-    rad = (settings.circle.height / 2) - 20;
+  var rad = (settings.circle.height / 2) - 20;
-    r1 = getArcXY(settings.circle.middle, settings.circle.center, rad, sections * (360 / 60) - 90);
+  var r1 = getArcXY(settings.circle.middle, settings.circle.center, rad, sections * (360 / 60) - 90);
   //g.setPixel(r[0],r[1]);
-    r2 = getArcXY(settings.circle.middle, settings.circle.center, rad - settings.circle.width, sections * (360 / 60) - 90);
+  var r2 = getArcXY(settings.circle.middle, settings.circle.center, rad - settings.circle.width, sections * (360 / 60) - 90);
   //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);
-  };
+};
-
-  const drawClock = function () {
 
+const drawClock = function () {
+  g.reset();
   currentTime = new Date();
 
   //Set to initial time when started
@@ -161,19 +160,19 @@
   g.setColor(settings.date.color);
   g.setFont(settings.date.font, settings.date.size);
   g.drawString(date, settings.date.center, settings.date.middle);
-  };
+};
 
-  //setInterval for HR visualisation
+//setInterval for HR visualisation
-  const newBeats = function (hr) {
+const newBeats = function (hr) {
   if (id != 0) {
     changeInterval(id, 6e3 / hr.bpm);
   } else {
     id = setInterval(drawHR, 6e3 / hr.bpm);
   }
-  };
+};
 
-  //visualize HR with circles pulsating
+//visualize HR with circles pulsating
-  const drawHR = function () {
+const drawHR = function () {
   if (grow && size < settings.hr.size) {
     size++;
   }
@@ -195,35 +194,33 @@
     g.setColor(color);
     g.drawCircle(settings.hr.x, settings.hr.y, size);
   }
-  };
+};
 
-  // clean app screen
+// clean app screen
-  g.clear();
+g.clear();
-  Bangle.loadWidgets();
+Bangle.loadWidgets();
-  Bangle.drawWidgets();
+Bangle.drawWidgets();
 
-  //manage when things should be enabled and not
+//manage when things should be enabled and not
-  Bangle.on('lcdPower', function (on) {
+Bangle.on('lcdPower', function (on) {
   if (on) {
     Bangle.setHRMPower(1);
   } else {
     Bangle.setHRMPower(0);
   }
-  });
+});
 
-  // refesh every second
+// refesh every second
-  setInterval(drawClock, 1E3);
+setInterval(drawClock, 1E3);
 
-  //start HR monitor and update frequency of update
+//start HR monitor and update frequency of update
-  Bangle.setHRMPower(1);
+Bangle.setHRMPower(1);
-  Bangle.on('HRM', function (d) {
+Bangle.on('HRM', function (d) {
   newBeats(d);
-  });
+});
 
-  // draw now
+// draw now
-  drawClock();
+drawClock();
 
-  // Show launcher when middle button pressed
+// Show launcher when button pressed
-  setWatch(Bangle.showLauncher, BTN2, { repeat: false, edge: "falling" });
+Bangle.setUI("clock");
-
-} 

apps/swlclk/ChangeLog

@@ -1 +1,2 @@
 0.01: New App!
+0.02: Fix text alignment, move to setUI

apps/swlclk/app.js

@@ -17,8 +17,7 @@ function drawTime(){
   var utc  = getUTCTime(d);
   var beats = Math.floor((((utc[0] + 1) % 24) + utc[1] / 60 + utc[2] / 3600) * 1000 / 24);
 
-  function drawStation(){
+  g.reset().setFont("Vector",10).setFontAlign(0,0);
-    g.setFont("Vector",10);
   g.setColor("#ffffff");
   switch (utc[0]) {
     case 0:
@@ -118,25 +117,19 @@ function drawTime(){
       g.drawString("17h00-18h00 R.F.I.\n13740 15300 17850\n17h00-18h00 R.F.I.\n7205 9790",xyCenter,30);
       break;
   }
-  }
-  drawStation();
 
   // Local time
-  g.setFont("6x8",1);
+  g.setFont("6x8",1).setColor("#cccccc");
-  g.setColor("#cccccc");
   g.drawString("Loc",10,85);
 
-  g.setFont("7x11Numeric7Seg",4);
+  g.setFont("7x11Numeric7Seg",4).setColor("#ffffff");
-  g.setColor("#ffffff");
   g.drawString(`${hours}:${minutes}:${seconds}`, xyCenter, 115, true);
 
   // UTC time
-  g.setFont("6x8",1);
+  g.setFont("6x8",1).setColor("#cccccc");
-  g.setColor("#cccccc");
   g.drawString("UTC",10,155);
 
-  g.setFont("7x11Numeric7Seg",4);
+  g.setFont("7x11Numeric7Seg",4).setColor("#ff0000");
-  g.setColor("#ff0000");
   g.drawString(utc[0]+`:${minutes}:${seconds}`, xyCenter, 185,true);
 
   // footer date
@@ -147,6 +140,7 @@ function drawTime(){
 }
 
 function setGpsTime(){
+  print("set GPS time");
   Bangle.setGPSPower(1);
   Bangle.on('GPS',function(fix) {
     if (fix.fix) {
@@ -157,7 +151,7 @@ function setGpsTime(){
         start();
       } else {
           stop();
-          g.setFont("Vector",10);
+          g.reset().setFont("Vector",10).setFontAlign(0,0);
           g.setColor("#cccccc");
           g.clearRect(0,25,240,80);
           g.drawString("Mise à l'heure\npar satellites\nen cours...",xyCenter,40);
@@ -166,14 +160,13 @@ function setGpsTime(){
 }
 
 function setButtons(){
-  // BTN 1
+  // Show launcher when button pressed
-  setWatch(() => {
+  Bangle.setUI("clockupdown", btn=>{
+    if (btn!=-1) return;
+    // if up pressed, turn GPS on and wait for new time
     setGpsTime();
     Bangle.beep(500, 4000);
-  }, BTN1, {edge:"rising", repeat:true});
+  });
-
-  // BTN 2
-  setWatch(Bangle.showLauncher, BTN2, {repeat:false,edge:"falling"});
 }
 
 var intervalRef = null;