add format2 field in config.json to switch clock formats

Author: bayashi

README.md

@@ -111,6 +111,10 @@ The countdown clock hasn't been tested enough though. Probably work if your conf
 
 The `format` field is a date-time format string used to display the clock. To create a custom date-time format, please refer to [this formatting guide](https://momentjs.com/docs/#/parsing/string-format/).
 
+#### format2
+
+The `format2` field is same as `format`. These are switched each other by clicking the mclocks. The `format2` is optional field.
+
 #### locale
 
 The `locale` field determines the language settings for displaying the date-time. You can find [a list of supported locales here](https://github.com/kawanet/cdate-locale/blob/main/locales.yml).

src-tauri/src/lib.rs

@@ -30,6 +30,8 @@ struct AppConfig {
     #[serde(default)]
     format: String,
     #[serde(default)]
+    format2: String,
+    #[serde(default)]
     locale: String,
     #[serde(default)]
     forefront: bool,
@@ -120,6 +122,7 @@ fn merge_configs(old: OldAppConfig, new: AppConfig) -> AppConfig {
         } else {
             "MM-DD ddd HH:mm".to_string()
         },
+        format2: new.format2,
         locale: if new.locale != "" {
             new.locale
         } else if old.locale_date_time != "" {

src/app.js

@@ -10,12 +10,21 @@ const currentPlatform = platform();
 let elClocks = document.querySelector("#mclocks");
 let Config;
 let ignoreOnMoved = false
+let switchFormat = false
 
 window.addEventListener("DOMContentLoaded", async () => {
   elClocks.addEventListener("mousedown", async () => {
     await getCurrentWindow().startDragging();
   })
 
+  elClocks.addEventListener("click", async () => {
+    if (!Config || !Config.format2) {
+      return
+    }
+    switchFormat = !switchFormat
+    adjustWindowSize()
+  })
+
   await getCurrentWindow().onMoved(() => {
     // Not support to save window-state onMoved for macOS.
     // Just save window-state on quit mclocks for macOS.
@@ -95,7 +104,11 @@ function tock(clock) {
   if (clock.target) {
     clock.el.innerHTML = escapeHTML(buildCountdown(clock.target, clock.timezone, clock.countdown));
   } else {
-    clock.el.innerHTML = escapeHTML(clock.fn().format(Config.format));
+    let format = Config.format
+    if (switchFormat) {
+      format = Config.format2
+    }
+    clock.el.innerHTML = escapeHTML(clock.fn().format(format));
   }
 }