From 1b3c36caf17a5d9e830cca16badff5cbdb1d171f Mon Sep 17 00:00:00 2001
From: Galen Charlton <gmc@equinoxinitiative.org>
Date: Fri, 5 Jun 2020 14:48:01 -0400
Subject: [PATCH] tweak display of times in staff scheduler

Use Moment's LT format to format the time according to the
browser's locale. Not quite perfect, but does point out
a need for a "Format Time with this pattern" library setting
to match "Format Date+Time with this pattern" and "Format Dates with this pattern"

Also display the number of available slots left in the drop-down.

Signed-off-by: Galen Charlton <gmc@equinoxinitiative.org>
---
 .../staff/circ/curbside/t_schedule_pickup.tt2      |  6 ++---
 .../circ/curbside/directives/schedule_pickup.js    | 29 ++++++++++++++++------
 2 files changed, 24 insertions(+), 11 deletions(-)

diff --git a/Open-ILS/src/templates/staff/circ/curbside/t_schedule_pickup.tt2 b/Open-ILS/src/templates/staff/circ/curbside/t_schedule_pickup.tt2
index 8a9ff0ed10..63448eb4cc 100644
--- a/Open-ILS/src/templates/staff/circ/curbside/t_schedule_pickup.tt2
+++ b/Open-ILS/src/templates/staff/circ/curbside/t_schedule_pickup.tt2
@@ -56,12 +56,12 @@
                        required min-date="minDate">
         </eg-date-input>
       </div>
-      <div class="col-md-1">
+      <div class="col-md-2">
         <label for="appointment-time">[% l('Time') %]</label>
         <select class="form-control" id="appointment-time" ng-model="appt.slot_time"
-                name="slot_time"
+                name="slot_time" style="display: block;"
                 required ng-focus="refreshAvailableTimes(appt)">
-          <option ng-repeat="t in appt.available_times" value="{{t}}">{{t}}</option>
+          <option ng-repeat="t in appt.available_times track by t.time" value="{{t.time}}">[% l('[_1] (Available: [_2])', '{{t.time_fmt}}', '{{t.available}}') %]</option>
         </select>
       </div>
       <div class="col-md-2">
diff --git a/Open-ILS/web/js/ui/default/staff/circ/curbside/directives/schedule_pickup.js b/Open-ILS/web/js/ui/default/staff/circ/curbside/directives/schedule_pickup.js
index a3247c6ec5..8cadbc34ab 100644
--- a/Open-ILS/web/js/ui/default/staff/circ/curbside/directives/schedule_pickup.js
+++ b/Open-ILS/web/js/ui/default/staff/circ/curbside/directives/schedule_pickup.js
@@ -224,6 +224,25 @@ function($scope , $q , egCurbsideCoreSvc , egCore , patronSvc ,
         });
     }
 
+    function mungeAvailableTimes(hash, times) {
+        var existing_present = false;
+        hash.available_times = times.map(function(t) {
+            if (hash.slot_time !== null && hash.slot_time === t[0]) existing_present = true;
+            return {
+                time: t[0],
+                available: t[1],
+                time_fmt: moment(t[0], [moment.ISO_8601, 'HH:mm:ss']).format('LT')
+            };
+        });
+        if (hash.slot_time !== null && !existing_present) {
+            hash.available_times.unshift({
+                time: hash.slot_time,
+                available: 0,
+                time_fmt: moment(hash.slot_time, [moment.ISO_8601, 'HH:mm:ss']).format('LT')
+            });
+        }
+    }
+
     function mungeOneAppointment(c, isNew) {
         var hash = egCore.idl.toHash(c);
         if (hash.slot === null) {
@@ -244,10 +263,7 @@ function($scope , $q , egCurbsideCoreSvc , egCore , patronSvc ,
             egCore.auth.token(),
             hash.slot.substring(0, 10),
         ).then(function(times) {
-            hash.available_times = times.map(function(t) { return t[0]; });
-            if (hash.slot_time !== null && hash.available_times.indexOf(hash.slot_time) === -1) {
-                hash.available_times.unshift(hash.slot_time);
-            }
+            mungeAvailableTimes(hash, times);
         });
         return hash;
     }
@@ -278,10 +294,7 @@ function($scope , $q , egCurbsideCoreSvc , egCore , patronSvc ,
             egCore.auth.token(),
             dateStr,
         ).then(function(times) {
-            hash.available_times = times.map(function(t) { return t[0]; });
-            if (hash.slot_time !== null && hash.available_times.indexOf(hash.slot_time) === -1) {
-                hash.available_times.unshift(hash.slot_time);
-            }
+            mungeAvailableTimes(hash, times);
         });
     }
 
-- 
2.11.0