From 71ddf2d40ebe2cb128b2f56dd7bcb7db564a9fbb Mon Sep 17 00:00:00 2001
From: Cade Scroggins <git@cadejs.com>
Date: Mon, 15 Apr 2019 21:16:41 -0700
Subject: [PATCH] add clockAction config and searchBackground color var

---
 index.html | 21 +++++++++++++++------
 1 file changed, 15 insertions(+), 6 deletions(-)

diff --git a/index.html b/index.html
index 60e5009..23ad836 100644
--- a/index.html
+++ b/index.html
@@ -227,6 +227,14 @@
      * Show a twenty-four-hour clock instead of a twelve-hour clock with AM/PM.
      */
     twentyFourHourClock: true,
+
+    /**
+     * Action to take when the clock is clicked. Options include:
+     *
+     * - "Menu" to show the help menu
+     * - "Search" to show the search input
+     */
+    clockAction: 'Menu',
   };
 </script>
 
@@ -235,6 +243,7 @@
     /* colors */
     --background: #fff;
     --foreground: #232931;
+    --searchBackground: #000;
     --searchForeground: #fff;
 
     /* fonts */
@@ -361,7 +370,7 @@
   }
 
   .search-form {
-    background: var(--background);
+    background: var(--searchBackground);
     color: var(--searchForeground);
     z-index: 2;
   }
@@ -641,9 +650,9 @@
     constructor(options) {
       this._el = $.el('#clock');
       this._delimiter = options.delimiter;
-      this._twentyFourHourClock = options.twentyFourHourClock;
+      this._twentyFourHour = options.twentyFourHour;
       this._setTime = this._setTime.bind(this);
-      this._el.addEventListener('click', options.showForm);
+      this._el.addEventListener('click', options.onClick);
       this._start();
     }
 
@@ -652,7 +661,7 @@
       let hours = $.pad(date.getHours());
       let amPm = '';
 
-      if (!this._twentyFourHourClock) {
+      if (!this._twentyFourHour) {
         hours = date.getHours();
         if (hours > 12) hours -= 12;
         else if (hours === 0) hours = 12;
@@ -1296,7 +1305,7 @@
 
   new Clock({
     delimiter: CONFIG.clockDelimiter,
-    showForm: form.show,
-    twentyFourHourClock: CONFIG.twentyFourHourClock,
+    onClick: CONFIG.clockAction === 'Search' ? form.show : help.toggle,
+    twentyFourHour: CONFIG.twentyFourHourClock,
   });
 </script>