first draft of an hh:mm:ss frame and a corresponding font

package-lock.json

@@ -1,12 +1,12 @@
 {
   "name": "cryptic-clock",
-  "version": "1.4",
+  "version": "1.2",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
       "name": "cryptic-clock",
-      "version": "1.4",
+      "version": "1.2",
       "license": "GPL-3.0-or-later",
       "dependencies": {
         "@rebble/sdk-c-utils": "^1.2.3",

package.json

@@ -1,7 +1,7 @@
 {
   "name": "cryptic-clock",
   "author": "jennyaa",
-  "version": "1.4",
+  "version": "1.2",
   "license": "GPL-3.0-or-later",
   "keywords": [
     "pebble-app"
@@ -25,14 +25,11 @@
     "watchapp": {
       "watchface": true
     },
-    "messageKeys": {
-      "BACKGROUND_COLOR": 10000,
-      "DIGIT_COLOR": 10001,
-      "FRAME_COLOR": 10002,
-      "TIME_FORMAT_OVERRIDE": 10010,
-      "12H_START": 10011,
-      "24H_START": 10012
-    },
+    "messageKeys": [
+      "BACKGROUND_COLOR",
+      "DIGIT_COLOR",
+      "FRAME_COLOR"
+    ],
     "capabilities": [ "configurable" ],
     "resources": {
       "media": [

src/c/digit_layer.cpp

@@ -5,10 +5,6 @@
 using namespace Pebble;
 
 namespace {
-  static constexpr int16_t extraDigits = 6;
-  static constexpr int16_t digitHeight = 56;
-  static constexpr int16_t digitCount = 10;
-
   void draw_digit(const Pebble::GContext& ctx, const Pebble::GRect& bounds, const uint16_t digit) {
     Pebble::GBitmapBase& bitmap = bitmaps::GetDigitBitmap(digit);
     auto rect = bitmap.GetBounds();
@@ -19,13 +15,13 @@ namespace {
 
 void DigitLayerInner::OnUpdate(const Pebble::GContext& ctx) {
   auto bounds = this->GetBounds();
-  // LOG("Digit layer update. %d digits", digitCount);
+  // LOG("Digit layer update. %d digits", this->digitCount);
 
   ctx.SetCompositingMode(GCompOpSet);
-  for (int i = 0; i <= digitCount + 2 * extraDigits; i++) {
-    Pebble::GRect rect(0, i * digitHeight, bounds.size.w, digitHeight);
-    uint16_t digit = ((i - extraDigits) % digitCount + digitCount) % digitCount;
-    // LOG("Digit %d -> %d", i - extraDigits, digit);
+  for (int i = 0; i <= this->digitCount + 2 * this->extraDigits; i++) {
+    Pebble::GRect rect(0, i * this->digitHeight, bounds.size.w, this->digitHeight);
+    uint16_t digit = ((i - this->extraDigits) % this->digitCount + this->digitCount) % this->digitCount % 10;
+    // LOG("Digit %d -> %d", i - this->extraDigits, digit);
     draw_digit(ctx, rect, digit);
   }
 }
@@ -39,7 +35,7 @@ DigitLayer::DigitLayer() : Pebble::SimpleLayer(Pebble::GRect()) {
 void DigitLayer::UpdateLayout() {
   auto bounds = this->GetBounds();
   this->scrollLayer.SetFrame(bounds);
-  bounds.size.h = (digitCount + 2 * extraDigits) * digitHeight;
+  bounds.size.h = (this->innerLayer.digitCount + 2 * this->innerLayer.extraDigits) * this->innerLayer.digitHeight;
   this->innerLayer.SetFrame(bounds);
   this->scrollLayer.SetContentSize(bounds.size);
 }
@@ -47,21 +43,18 @@ void DigitLayer::UpdateLayout() {
 
 int16_t DigitLayer::ComputeOffset(uint16_t digit) {
   auto bounds = this->GetBounds();
-  return bounds.size.h / 2 - digitHeight / 2 - (digit + extraDigits) * digitHeight;
+  return bounds.size.h / 2 - this->innerLayer.digitHeight / 2
+      - (digit + this->innerLayer.extraDigits) * this->innerLayer.digitHeight;
 }
 
 void DigitLayer::RotateTo(uint16_t digit, bool animate) {
-  // LOG("Digit %d, out of %d", digit, digitCount);
-  digit %= digitCount;
+  // LOG("Digit %d, out of %d", digit, innerLayer.digitCount);
+  digit %= innerLayer.digitCount;
   auto currentOffset = this->scrollLayer.GetContentOffset();
-  if (digit > this->currentDigit + digitCount / 2) {
-    currentOffset.y -= digitCount * digitHeight;
-    this->scrollLayer.SetContentOffset(currentOffset, false);
-  } else if (digit < this->currentDigit - digitCount / 2) {
-    currentOffset.y += digitCount * digitHeight;
+  if (digit == 0 && currentOffset.y <= ComputeOffset(this->innerLayer.digitCount / 2)) {
+    currentOffset.y += this->innerLayer.digitCount * this->innerLayer.digitHeight;
     this->scrollLayer.SetContentOffset(currentOffset, false);
   }
 
   this->scrollLayer.SetContentOffset(this->ComputeOffset(digit), animate);
-  this->currentDigit = digit;
 }

src/c/digit_layer.hpp

@@ -3,6 +3,10 @@
 #include <pebble-cpp/pebble.hpp>
 
 class DigitLayerInner : public Pebble::CustomLayer {
+  static constexpr int16_t extraDigits = 2;
+  static constexpr int16_t digitHeight = 56;
+  int16_t digitCount = 10;
+
   DigitLayerInner() : Pebble::CustomLayer(Pebble::GRect()) {}
 
   static void DrawDigit(const Pebble::GContext& ctx, const Pebble::GRect& bounds, const uint16_t digit);
@@ -16,10 +20,15 @@ protected:
 class DigitLayer : public Pebble::SimpleLayer {
   DigitLayerInner innerLayer;
   Pebble::ScrollLayer scrollLayer;
-  int16_t currentDigit = 0;
 public:
   DigitLayer();
 
+  void SetDigitCount(uint16_t cnt = 10) {
+    if (this->innerLayer.digitCount != cnt) {
+      this->innerLayer.digitCount = cnt;
+      this->UpdateLayout();
+    }
+  }
   void UpdateLayout();
   void RotateTo(uint16_t digit, bool animate=true);
 private:

src/c/main.cpp

@@ -8,7 +8,7 @@
 using namespace Pebble;
 
 // For debugging
-constexpr bool USE_SECONDS_INSTEAD_OF_MINUTES = false;
+const bool USE_SECONDS_INSTEAD_OF_MINUTES = false;
 
 class MainWindow : public AppWindow, public TickTimer {
   DigitLayer digitLayers[4];
@@ -39,18 +39,19 @@ protected:
     TickTimerStart(HOUR_UNIT);
     TickTimerStart(USE_SECONDS_INSTEAD_OF_MINUTES ? SECOND_UNIT : MINUTE_UNIT);
     UpdateTime(false);
-    ApplySettings();
   }
 
   void UpdateTime(bool animate=true) {
     DateTime dateTime = DateTime::Now();
-    int hour = settings::FormatHour(dateTime.GetHour());
+    int hour = dateTime.GetHour();
     int minute = USE_SECONDS_INSTEAD_OF_MINUTES ? dateTime.GetSecond() : dateTime.GetMinute();
+    bool is_24h = clock_is_24h_style();
+    if (!is_24h) hour %= 12;
 
-    // digitLayers[0].SetDigitCount(is_24h ? 3 : 2);
-    // digitLayers[1].SetDigitCount(is_24h ? 24 : 12);
-    // digitLayers[2].SetDigitCount(6);
-    // digitLayers[3].SetDigitCount(10);
+    digitLayers[0].SetDigitCount(is_24h ? 3 : 2);
+    digitLayers[1].SetDigitCount(is_24h ? 24 : 12);
+    digitLayers[2].SetDigitCount(6);
+    digitLayers[3].SetDigitCount(10);
     this->digitLayers[0].RotateTo(hour / 10, animate);
     this->digitLayers[1].RotateTo(hour, animate);
     this->digitLayers[2].RotateTo(minute / 10, animate);
@@ -60,34 +61,34 @@ protected:
   void OnTick(tm &tick_time, TimeUnits units_changed) {
     UpdateTime(true);
   }
-  
-public:
-  void ApplySettings() {
-    this->SetBackgroundColor(settings::GetBackgroundColor());
-    bitmaps::SetDigitColor(settings::GetDigitColor());
-    bitmaps::SetFrameColor(settings::GetFrameColor());
-    this->UpdateTime(false);
-    this->MarkDirty();
-  }
 };
 
 namespace {
+  void ApplySettings() {
+    Pebble::Window window = window_stack_get_top_window();
+    window.SetBackgroundColor(settings::GetBackgroundColor());
+    window.MarkDirty();
+
+    bitmaps::SetDigitColor(settings::GetDigitColor());
+    bitmaps::SetFrameColor(settings::GetFrameColor());
+  }
+
   void HandleMsg(DictionaryIterator *iter, void *context) {
     settings::HandleMsg(iter);
-    static_cast<MainWindow*>(context)->ApplySettings();
+    ApplySettings();
   }
 }
 
 MAIN {
   bitmaps::Init();
   settings::Load();
-  MainWindow window;
-  window.StackPush(true);
-
-  app_message_set_context(&window);
   app_message_register_inbox_received(HandleMsg);
   app_message_open(64, 64); // inbox, outbox
 
+  MainWindow window;
+  window.StackPush(true);
+  ApplySettings();
+
   app_event_loop();
 
   bitmaps::DeInit();

src/c/settings.cpp

@@ -1,4 +1,3 @@
-#include <@rebble/sdk-c-utils/macros.h>
 #include "settings.hpp"
 
 // Built-in GColorFromRGBA doesn't seem to work in C++11 :(
@@ -17,49 +16,28 @@ namespace settings {
     GColor backgroundColor = GColorWhite;
     GColor digitColor = GColorBlack;
     GColor frameColor = GColorBlack;
-    int time_format_override = 0;
-    int time_12h_start = 1;
-    int time_24h_start = 0;
   }
 
   void Save() {
     persist_write_data(MESSAGE_KEY_BACKGROUND_COLOR, &backgroundColor, sizeof(GColor));
     persist_write_data(MESSAGE_KEY_DIGIT_COLOR, &digitColor, sizeof(GColor));
     persist_write_data(MESSAGE_KEY_FRAME_COLOR, &frameColor, sizeof(GColor));
-    persist_write_data(MESSAGE_KEY_TIME_FORMAT_OVERRIDE, &time_format_override, sizeof(int));
-    persist_write_data(MESSAGE_KEY_12H_START, &time_12h_start, sizeof(int));
-    persist_write_data(MESSAGE_KEY_24H_START, &time_24h_start, sizeof(int));
   }
 
   void Load() {
     persist_read_data(MESSAGE_KEY_BACKGROUND_COLOR, &backgroundColor, sizeof(GColor));
     persist_read_data(MESSAGE_KEY_DIGIT_COLOR, &digitColor, sizeof(GColor));
     persist_read_data(MESSAGE_KEY_FRAME_COLOR, &frameColor, sizeof(GColor));
-    persist_read_data(MESSAGE_KEY_TIME_FORMAT_OVERRIDE, &time_format_override, sizeof(int));
-    persist_read_data(MESSAGE_KEY_12H_START, &time_12h_start, sizeof(int));
-    persist_read_data(MESSAGE_KEY_24H_START, &time_24h_start, sizeof(int));
   }
 
   void HandleMsg(DictionaryIterator *iter) {
     if (auto tuple = dict_find(iter, MESSAGE_KEY_BACKGROUND_COLOR)) backgroundColor = GColorFromHEX(tuple->value->int32);
     if (auto tuple = dict_find(iter, MESSAGE_KEY_DIGIT_COLOR)) digitColor = GColorFromHEX(tuple->value->int32);
     if (auto tuple = dict_find(iter, MESSAGE_KEY_FRAME_COLOR)) frameColor = GColorFromHEX(tuple->value->int32);
-    if (auto tuple = dict_find(iter, MESSAGE_KEY_TIME_FORMAT_OVERRIDE)) time_format_override = tuple->value->int8;
-    if (auto tuple = dict_find(iter, MESSAGE_KEY_12H_START)) time_12h_start = tuple->value->int8;
-    if (auto tuple = dict_find(iter, MESSAGE_KEY_24H_START)) time_24h_start = tuple->value->int8;
     Save();
   }
 
   GColor GetBackgroundColor() {return backgroundColor;}
   GColor GetDigitColor() {return digitColor;}
   GColor GetFrameColor() {return frameColor;}
-
-  int FormatHour(int hour) {
-    const bool is_24h = time_format_override ? time_format_override == 24 : clock_is_24h_style();
-    if (is_24h) {
-      return (hour + 24 - time_24h_start) % 24 + time_24h_start;
-    } else {
-      return (hour + 12 - time_12h_start) % 12 + time_12h_start;
-    }
-  }
 }

src/c/settings.hpp

@@ -9,5 +9,4 @@ namespace settings {
   GColor GetBackgroundColor();
   GColor GetDigitColor();
   GColor GetFrameColor();
-  int FormatHour(int hours);
 }

src/pkjs/config.js

@@ -29,42 +29,6 @@ module.exports = [
       },
     ]
   },
-  { 
-    type: "section", 
-    items: [ 
-      {
-        type: "heading", 
-        defaultValue: "Time Format",
-      },
-      {
-        label: "Time Format",
-        messageKey: "TIME_FORMAT_OVERRIDE",
-        type: "select",
-        options: [
-          {label: "Use system", value: 0},
-          {label: "12 hour", value: 12},
-          {label: "24 hour", value: 24},
-        ],
-        defaultValue: 0,
-      },
-      {
-        label: "12h Range",
-        description: "Most people want '1:00 to 12:59'. Some countries use '0:00 to 11:59' instead.",
-        messageKey: "12H_START",
-        type: "select",
-        options: Array.from({length: 12}, (_, i) => ({value: i, label: `${i}:00 to ${i + 11}:59`})),
-        defaultValue: 1,
-      },
-      {
-        label: "24h Range",
-        description: "Most people want '0:00 to 23:59'.",
-        messageKey: "24H_START",
-        type: "select",
-        options: Array.from({length: 24}, (_, i) => ({value: i, label: `${i}:00 to ${i + 23}:59`})),
-        defaultValue: 0,
-      },
-    ]
-  },
   {
     type: "submit",
     defaultValue: "Save Settings",

src/pkjs/index.js

@@ -1,48 +1,3 @@
 var Clay = require('pebble-clay');
 var clayConfig = require('./config');
 var clay = new Clay(clayConfig);
-
-
-// Patch `select` to return integers instead of strings
-
-function disable() {
-  if (this.$manipulatorTarget.get('disabled')) { return this; }
-  this.$element.set('+disabled');
-  this.$manipulatorTarget.set('disabled', true);
-  return this.trigger('disabled');
-}
-
-function enable() {
-  if (!this.$manipulatorTarget.get('disabled')) { return this; }
-  this.$element.set('-disabled');
-  this.$manipulatorTarget.set('disabled', false);
-  return this.trigger('enabled');
-}
-
-function hide() {
-  if (this.$element[0].classList.contains('hide')) { return this; }
-  this.$element.set('+hide');
-  return this.trigger('hide');
-}
-
-function show() {
-  if (!this.$element[0].classList.contains('hide')) { return this; }
-  this.$element.set('-hide');
-  return this.trigger('show');
-}
-
-clay.components.select.manipulator = {
-  get: function() {
-    return parseInt(this.$manipulatorTarget.get('value'));
-  },
-  set: function(value) {
-    if (this.get() === value) { return this; }
-    this.$manipulatorTarget.set('value', value);
-    return this.trigger('change');
-  },
-  disable: disable,
-  enable: enable,
-  hide: hide,
-  show: show
-};
-