From f7efc338f172ccc3a0468ce8ffcacb4a6e44d702 Mon Sep 17 00:00:00 2001
From: Richard de Boer <git@tubul.net>
Date: Mon, 16 May 2022 20:21:24 +0200
Subject: [PATCH 1/2] ClockFace: add `is12Hour` property, document `paused`

---
 modules/ClockFace.js |  5 ++++-
 modules/ClockFace.md | 26 ++++++++++++++++++++++++++
 2 files changed, 30 insertions(+), 1 deletion(-)

diff --git a/modules/ClockFace.js b/modules/ClockFace.js
index 9818ae4e36..25e2430bf8 100644
--- a/modules/ClockFace.js
+++ b/modules/ClockFace.js
@@ -32,6 +32,8 @@ function ClockFace(options) {
     if (dir>0 && options.down) options.down.apply(this);
   };
   if (options.upDown) this._upDown = options.upDown;
+
+  this.is12Hour = !!(require("Storage").readJSON("setting.json", 1) || {})["12hour"];
 }
 
 ClockFace.prototype.tick = function() {
@@ -69,6 +71,7 @@ ClockFace.prototype.start = function() {
   if (this._upDown) Bangle.setUI("clockupdown", d=>this._upDown.apply(this,[d]));
   else Bangle.setUI("clock");
   delete this._last;
+  this.paused = false;
   this.tick();
 
   Bangle.on("lcdPower", on => {
@@ -87,7 +90,7 @@ ClockFace.prototype.pause = function() {
 ClockFace.prototype.resume = function() {
   if (this._timeout) return; // not paused
   delete this._last;
-  delete this.paused;
+  this.paused = false;
   if (this._resume) this._resume.apply(this);
   this.tick(true);
 };
diff --git a/modules/ClockFace.md b/modules/ClockFace.md
index 1da6e60206..e760c3e745 100644
--- a/modules/ClockFace.md
+++ b/modules/ClockFace.md
@@ -59,6 +59,7 @@ var clock = new ClockFace({
     draw: function(time, changed) {   // at least draw or update is required
       // (re)draw entire clockface, time is a Date object
       // `changed` is the same format as for update() below, but always all true
+      // You can use `this.is12Hour` to test if the 'Time Format' setting is set to "12h" or "24h"
     },
     // The difference between draw() and update() is that the screen is cleared
     // before draw() is called, so it needs to always redraw the entire clock
@@ -107,4 +108,29 @@ var clock = new ClockFace(function(time) {
 });
 clock.start();
 
+```
+
+Properties
+----------
+The following properties are automatically set on the clock:
+* `is12Hour`: `true` if the "Time Format" setting is set to "12h", `false` for "24h".
+* `paused`: `true` while the clock is paused.  (You don't need to check this inside your `draw()` code)
+
+Inside the `draw()`/`update()` function you can access these using `this`:
+
+```js
+
+var ClockFace = require("ClockFace");
+var clock = new ClockFace({
+  draw: function (time) {
+    if (this.is12Hour) // draw 12h time
+    else // use 24h format
+  }
+});
+clock.start();
+
+Bangle.on('step', function(steps) {
+  if (clock.paused === false) // draw step count
+});
+
 ```
\ No newline at end of file

From 33d25e4b0755288d5f9e77ba1c15bf72006bc7af Mon Sep 17 00:00:00 2001
From: Richard de Boer <git@tubul.net>
Date: Mon, 16 May 2022 21:28:08 +0200
Subject: [PATCH 2/2] barclock: use ClockFace.is12Hour instead of reading the
 setting

---
 apps/barclock/ChangeLog     | 1 +
 apps/barclock/clock-bar.js  | 7 +++----
 apps/barclock/metadata.json | 2 +-
 3 files changed, 5 insertions(+), 5 deletions(-)

diff --git a/apps/barclock/ChangeLog b/apps/barclock/ChangeLog
index 0b8470b6ad..5df032c4d8 100644
--- a/apps/barclock/ChangeLog
+++ b/apps/barclock/ChangeLog
@@ -8,3 +8,4 @@
 0.08: Use theme colors, Layout library
 0.09: Fix time/date disappearing after fullscreen notification
 0.10: Use ClockFace library
+0.11: Use ClockFace.is12Hour
diff --git a/apps/barclock/clock-bar.js b/apps/barclock/clock-bar.js
index a465bb6929..987d41cc60 100644
--- a/apps/barclock/clock-bar.js
+++ b/apps/barclock/clock-bar.js
@@ -3,7 +3,6 @@
  * A simple digital clock showing seconds as a bar
  **/
 // Check settings for what type our clock should be
-const is12Hour = (require("Storage").readJSON("setting.json", 1) || {})["12hour"];
 let locale = require("locale");
 { // add some more info to locale
   let date = new Date();
@@ -25,7 +24,7 @@ function renderBar(l) {
 
 
 function timeText(date) {
-  if (!is12Hour) {
+  if (!clock.is12Hour) {
     return locale.time(date, true);
   }
   const date12 = new Date(date.getTime());
@@ -38,7 +37,7 @@ function timeText(date) {
   return locale.time(date12, true);
 }
 function ampmText(date) {
-  return (is12Hour && locale.hasMeridian)? locale.meridian(date) : "";
+  return (clock.is12Hour && locale.hasMeridian) ? locale.meridian(date) : "";
 }
 function dateText(date) {
   const dayName = locale.dow(date, true),
@@ -69,7 +68,7 @@ const ClockFace = require("ClockFace"),
       }, {lazy: true});
       // adjustments based on screen size and whether we display am/pm
       let thickness; // bar thickness, same as time font "pixel block" size
-      if (is12Hour) {
+      if (this.is12Hour) {
         // Maximum font size = (<screen width> - <ampm: 2chars * (2*6)px>) / (5chars * 6px)
         thickness = Math.floor((Bangle.appRect.w-24)/(5*6));
       } else {
diff --git a/apps/barclock/metadata.json b/apps/barclock/metadata.json
index 3ee7ccb3a4..7bc61096d1 100644
--- a/apps/barclock/metadata.json
+++ b/apps/barclock/metadata.json
@@ -1,7 +1,7 @@
 {
   "id": "barclock",
   "name": "Bar Clock",
-  "version": "0.10",
+  "version": "0.11",
   "description": "A simple digital clock showing seconds as a bar",
   "icon": "clock-bar.png",
   "screenshots": [{"url":"screenshot.png"},{"url":"screenshot_pm.png"}],