Move clock config to backend

client/src/main/Clock.svelte

@@ -1,7 +1,7 @@
 <script>
   import dayjs from "dayjs"
 
-  import { userConfig } from "../stores/config"
+  import { config } from "../stores/config"
 
   export let isWide = false
 
@@ -19,9 +19,9 @@
 
   $: {
     clearInterval(interval)
-    is24Hour = $userConfig.clock === "24h"
+    is24Hour = $config.CLOCK === "24h"
     update()
-    if ($userConfig.clock) {
+    if ($config.CLOCK) {
       interval = setInterval(() => update(), 250)
     }
   }
@@ -35,7 +35,7 @@
   }
 </script>
 
-{#if $userConfig.clock}
+{#if $config.CLOCK}
   <div class="relative h-0">
     <div
       class="fixed right-0 flex w-max items-end gap-1 rounded-bl-lg bg-base-200 px-2 py-1 font-mono leading-none {classes}"

client/src/main/modals/Settings.svelte

@@ -127,23 +127,6 @@
     </div>
     <hr class="divider col-span-2 m-0 h-0 p-0" />
 
-    <div class="flex justify-end text-lg font-bold">System clock:</div>
-    <div class="tabs-boxed tabs w-max">
-      {#each [[null, false], [hours12, "12h"], [hours24, "24h"]] as [icon, clock]}
-        <button
-          class="tab gap-2"
-          class:tab-active={$userConfig.clock === clock}
-          on:click={() => ($userConfig.clock = clock)}
-        >
-          {#if icon}
-            <Icon {icon} class="h-6 w-6" />
-          {/if}
-          <span class:font-bold={!clock}>{clock ? `${clock.substring(0, 2)} hour` : "OFF"}</span>
-        </button>
-      {/each}
-    </div>
-    <hr class="divider col-span-2 m-0 h-0 p-0" />
-
     <div class="flex justify-end text-lg font-bold">Theme:</div>
     <div class="tabs-boxed tabs w-max">
       {#each themes as [name, theme, icon]}
@@ -334,6 +317,12 @@
             {:else}
               <em class="text-error">none</em>
             {/if}
+          {:else if key === "CLOCK"}
+            {#if value}
+              {value.replace(/h$/, "-hour display")}
+            {:else}
+              <span class="text-error">off</span>
+            {/if}
           {:else}
             {value}{#if value === 0}<span class="text-error">&nbsp;(disabled)</span>{/if}
           {/if}

client/src/stores/config.js

@@ -22,7 +22,6 @@ const defaultUserConfig = {
   tooltips: true,
   startFullscreen: false,
   showViz: false,
-  clock: "12h",
   theme: null
 }
 export const userConfig = persisted("user-config", defaultUserConfig)

server/constants.json

@@ -114,6 +114,7 @@
   "settings_descriptions": {
     "ALLOW_REPEATS_IN_STOPSET": "The randomization algorithm will try its absolute best to avoid duplicates. However, when that's not possible (for example because of a nearly empty rotator), do you want the same asset to repeat (True), or for the rotator to be ignored in a given stop set (False)?",
     "BROADCAST_COMPRESSION": "Enable broadcast compression when True, smoothing out dynamic range in audio output.\nNOTE: compression is applied at the time you play an audio asset and performed on-the-fly in the desktop app.",
+    "CLOCK": "This will enable a clock that displays the current time in the desktop app (12 or 24-hour). On larger screens the date will also display.",
     "END_DATE_PRIORITY_WEIGHT_MULTIPLIER": "Multiply an asset's weight by this number if it has an end date and the end date is in the next 24 hours (one day). Set to 0 to disable this feature.",
     "NO_REPEAT_ASSETS_TIME": "The time (in seconds) required to elapse for the Desktop app to attempt to not repeat any assets. Set to 0 to disable and allow potential repetition in the randomization algorithm. If there are not enough assets in a rotator to respect this setting, it will be ignored.",
     "ONE_CLIENT_LOGIN_PER_ACCOUNT": "Only allow one desktop client to be connected per account.",

server/tomato/models/serialize.py

@@ -44,7 +44,11 @@ async def get_constance_config_for_api():
     except Exception:
         logger.exception("Error parsing UI_MODE_RESET_TIMES. Sending empty list.")
 
-    config.update({"UI_MODES": list(map(int, config["UI_MODES"])), "UI_MODE_RESET_TIMES": reset_times})
+    config.update({
+        "UI_MODES": list(map(int, config["UI_MODES"])),
+        "UI_MODE_RESET_TIMES": reset_times,
+        "CLOCK": config["CLOCK"] or False,
+    })
     config["_numeric"] = [key for key, value in config.items() if isinstance(value, decimal.Decimal)]
     return config
 

server/tomato/settings.py

@@ -322,6 +322,10 @@ def validate_reset_times(values):
             "max_value": 60,
         },
     ),
+    "clock": (
+        "django.forms.ChoiceField",
+        {"choices": (("", "Off"), ("12h", "12 Hour"), ("24h", "24 Hour")), "required": False},
+    ),
 }
 
 CONSTANCE_CONFIG = {
@@ -453,13 +457,22 @@ def validate_reset_times(values):
         mark_safe("Reject silence assets of this many seconds. <strong>Set to 0 disable</strong>."),
         "silence",
     ),
+    "CLOCK": (
+        "",
+        (
+            "This will enable a clock that displays the current time in the desktop app (12- or 24-hour display). On"
+            " larger screens the date will also display."
+        ),
+        "clock",
+    ),
 }
 
 CONSTANCE_CONFIG_FIELDSETS = OrderedDict((
     (
         "User Interface Options",
         (
             "STATION_NAME",
+            "CLOCK",
             "UI_MODES",
             "UI_MODE_RESET_TIMES",
             "ONE_CLIENT_LOGIN_PER_ACCOUNT",