migrate home page recently played date and time pickers to twig

RocketMan · Oct 16, 2024 · 8d180df · 8d180df
1 parent 3d1aaab
commit 8d180df
Show file tree

Hide file tree

Showing 3 changed files with 43 additions and 25 deletions.
diff --git a/js/home.js b/js/home.js
@@ -2,7 +2,7 @@
 // Zookeeper Online
 //
 // @author Jim Mason <jmason@ibinx.com>
-// @copyright Copyright (C) 1997-2023 Jim Mason <jmason@ibinx.com>
+// @copyright Copyright (C) 1997-2024 Jim Mason <jmason@ibinx.com>
 // @link https://zookeeper.ibinx.com/
 // @license GPL-3.0
 //
@@ -220,7 +220,7 @@ $().ready(function(){
             accept: 'application/json; charset=utf-8',
             url: url
         }).done(function (response) {
-            $("#time").empty().append(response.times).selectmenu('refresh');
+            $("#time").empty().append(response).selectmenu('refresh');
             var time = $("#time").val();
             populateCards(true, time == 'now' ? null : (date + " " + time));
         });

diff --git a/ui/Home.php b/ui/Home.php
@@ -3,7 +3,7 @@
  * Zookeeper Online
  *
  * @author Jim Mason <jmason@ibinx.com>
- * @copyright Copyright (C) 1997-2022 Jim Mason <jmason@ibinx.com>
+ * @copyright Copyright (C) 1997-2024 Jim Mason <jmason@ibinx.com>
  * @link https://zookeeper.ibinx.com/
  * @license GPL-3.0
  *
@@ -47,46 +47,44 @@ public function recentSpins() {
     }
 
     protected function makeDatePicker() {
+        $result = [];
+
         $now = new \DateTime();
-        $result = "<option value='" . $now->format("Y-m-d") . "'>Today</option>";
-        $now->modify("-1 days");
-        $result .= "<option value='" . $now->format("Y-m-d") . "'>Yesterday</option>";
-        for($i=0; $i<5; $i++) {
+        $result[] = clone $now;
+
+        for($i=0; $i<6; $i++) {
             $now->modify("-1 days");
-            $result .= "<option value='" . $now->format("Y-m-d") . "'>" .
-                $now->format("D M j") . "</option>";
+            $result[] = clone $now;
         }
 
-        return $result;
+        $this->addVar("dates", $result);
     }
 
     protected function makeTimePicker($date=null) {
+        $result = [];
+
         $now = new \DateTime();
         if(!$date || $now->format("Y-m-d") == $date) {
             // today
-            $result = "<option value='now'>Recently Played</option>";
             $hour = (int)$now->format("H");
+            $result[] = -1;
         } else {
-            $result = "<option value='23:59:59'>Before midnight</option>";
             $hour = 23;
+            $result[] = $hour;
         }
 
         do {
             if($hour % 3) continue;
-            $h = sprintf("%02d", $hour);
-            $ampm = $h >= 12?"pm":"am";
-            $hx = $h > 12?$hour-12:$hour;
-            $dh = $h == 12?"noon":($hx.$ampm);
-            $result .= "<option value='$h:00:00'>Before $dh</option>";
+            $result[] = $hour;
         } while(--$hour > 0);
 
-        return $result;
+        $this->addVar("times", $result);
     }
 
     public function getTimes() {
-        $retVal = [];
-        $retVal['times'] = $this->makeTimePicker($_REQUEST["date"] ?? null);
-        echo json_encode($retVal);
+        $this->setTemplate('onnow.html');
+        $this->makeTimePicker($_REQUEST["date"] ?? null);
+        echo json_encode($this->render('time'));
     }
 
     public function emitHome() {
@@ -102,8 +100,8 @@ public function emitHome() {
 
     private function emitRecentlyPlayed() {
         $this->addVar('discogs', true);
-        $this->addVar('datepicker', $this->makeDatePicker());
-        $this->addVar('timepicker', $this->makeTimePicker());
+        $this->makeDatePicker();
+        $this->makeTimePicker();
     }
 
     private function emitTopPlays($numweeks=1, $limit=10) {

diff --git a/ui/templates/default/onnow.html b/ui/templates/default/onnow.html
@@ -36,8 +36,28 @@
   <h3>Recently Played on {{ app.station }}</h3>
   <div>
     <form>
-      <select id='date'>{{ datepicker | raw }}</select>
-      <select id='time'>{{ timepicker | raw }}</select>
+      <select id='date'>
+        <option value="{{ dates[0] | date("Y-m-d") }}">Today</option>
+        <option value="{{ dates[1] | date("Y-m-d") }}">Yesterday</option>
+{% for day in dates[2:] %}
+        <option value="{{ day | date("Y-m-d") }}">{{ day | date("D M j") }}</option>
+{% endfor %}
+      </select>
+      <select id='time'>
+{% block time %}
+{% if times[0] == -1 %}
+        <option value='now'>Recently Played</option>
+{% else %}
+        <option value='23:59:59'>Before midnight</option>
+{% endif %}
+{% for hour in times[1:] %}
+  {%~ set ampm = hour >= 12 ? "pm" : "am" %}
+  {%~ set hx = hour > 12 ? hour - 12 : hour %}
+  {%~ set dh = hour == 12 ? "noon" : hx ~ ampm %}
+        <option value='{{ "%02d" | format(hour) }}:00:00'>Before {{ dh }}</option>
+{% endfor %}
+{% endblock %}
+      </select>
     </form>
   </div>
 </div>