From a32273f3c287f54296b27d62f38aab4bc60133b7 Mon Sep 17 00:00:00 2001
From: sahil raja <s.raja@imperial.ac.uk>
Date: Wed, 30 Oct 2024 10:06:37 +0000
Subject: [PATCH 1/5] :sparkles: adding timezone to messagefeed header

---
 process_manager/templates/process_manager/index.html | 12 ++++++++++++
 1 file changed, 12 insertions(+)

diff --git a/process_manager/templates/process_manager/index.html b/process_manager/templates/process_manager/index.html
index 4e854380..a6ab8f75 100644
--- a/process_manager/templates/process_manager/index.html
+++ b/process_manager/templates/process_manager/index.html
@@ -64,6 +64,17 @@
     end
   end
   </script>
+  <script>
+    document.addEventListener('DOMContentLoaded', function() {
+      var timezoneElement = document.getElementById('timezone');
+      var timezone = Intl.DateTimeFormat().resolvedOptions().timeZone;
+      var offset = new Date().getTimezoneOffset();
+      var offsetHours = Math.abs(offset / 60);
+      var offsetSign = offset <= 0 ? '+' : '-';
+      var offsetString = offsetSign + String(offsetHours).padStart(2, '0')
+      timezoneElement.textContent = timezone + ' (UTC' + offsetString + ')';
+    });
+  </script>
 {% endblock extra_js %}
 {% block content %}
   <div class="container-fluid no-padding no-margin">
@@ -126,6 +137,7 @@ <h5>Process Control</h5>
         <div class="card shadow-sm">
           <div class="card-header bg-info text-white">
             <h5 class="d-inline">Messages</h5>
+            <span class="d-inline"id="timezone"></span>
             <!-- Updated Hide Messages Button as a close icon -->
             <button id="hide-messages-button"
                     type="button"

From 9388c5cdee871170df7242b672f1770bd36a7d8f Mon Sep 17 00:00:00 2001
From: Sahil Raja <56438860+Sahil590@users.noreply.github.com>
Date: Wed, 30 Oct 2024 12:19:45 +0000
Subject: [PATCH 2/5] Update
 process_manager/templates/process_manager/index.html
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Co-authored-by: Diego Alonso Álvarez <6095790+dalonsoa@users.noreply.github.com>
---
 process_manager/templates/process_manager/index.html | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/process_manager/templates/process_manager/index.html b/process_manager/templates/process_manager/index.html
index a6ab8f75..c2c16f2a 100644
--- a/process_manager/templates/process_manager/index.html
+++ b/process_manager/templates/process_manager/index.html
@@ -72,7 +72,7 @@
       var offsetHours = Math.abs(offset / 60);
       var offsetSign = offset <= 0 ? '+' : '-';
       var offsetString = offsetSign + String(offsetHours).padStart(2, '0')
-      timezoneElement.textContent = timezone + ' (UTC' + offsetString + ')';
+      timezoneElement.textContent = timezone + ' (UTC' + offsetString + 'h)';
     });
   </script>
 {% endblock extra_js %}

From ff7189d9a6485c6858ae2bbc7e25418675b44d9e Mon Sep 17 00:00:00 2001
From: sahil raja <s.raja@imperial.ac.uk>
Date: Wed, 30 Oct 2024 17:56:06 +0530
Subject: [PATCH 3/5] adding minutes to take into account fractional timezones

---
 .../templates/process_manager/index.html      | 19 ++++++++++---------
 1 file changed, 10 insertions(+), 9 deletions(-)

diff --git a/process_manager/templates/process_manager/index.html b/process_manager/templates/process_manager/index.html
index c2c16f2a..7abf9f2f 100644
--- a/process_manager/templates/process_manager/index.html
+++ b/process_manager/templates/process_manager/index.html
@@ -65,15 +65,16 @@
   end
   </script>
   <script>
-    document.addEventListener('DOMContentLoaded', function() {
-      var timezoneElement = document.getElementById('timezone');
-      var timezone = Intl.DateTimeFormat().resolvedOptions().timeZone;
-      var offset = new Date().getTimezoneOffset();
-      var offsetHours = Math.abs(offset / 60);
-      var offsetSign = offset <= 0 ? '+' : '-';
-      var offsetString = offsetSign + String(offsetHours).padStart(2, '0')
-      timezoneElement.textContent = timezone + ' (UTC' + offsetString + 'h)';
-    });
+  document.addEventListener('DOMContentLoaded', function() {
+    var timezoneElement = document.getElementById('timezone');
+    var timezone = Intl.DateTimeFormat().resolvedOptions().timeZone;
+    var offset = new Date().getTimezoneOffset();
+    var offsetHours = Math.floor(Math.abs(offset / 60)); // Ensure whole number
+    var offsetMinutes = Math.abs(offset % 60);
+    var offsetSign = offset <= 0 ? '+' : '-';
+    var offsetString = offsetSign + String(offsetHours).padStart(2, '0') + ':' + String(offsetMinutes).padStart(2, '0');
+    timezoneElement.textContent = timezone + ' (UTC' + offsetString + ')';
+  });
   </script>
 {% endblock extra_js %}
 {% block content %}

From 470809dccbe3cf917ec93b0223469824b979bdd1 Mon Sep 17 00:00:00 2001
From: sahil raja <s.raja@imperial.ac.uk>
Date: Wed, 30 Oct 2024 15:44:18 +0000
Subject: [PATCH 4/5] getting server time instead of client time

---
 .../templates/process_manager/index.html      | 56 ++++++++-----------
 1 file changed, 24 insertions(+), 32 deletions(-)

diff --git a/process_manager/templates/process_manager/index.html b/process_manager/templates/process_manager/index.html
index 7abf9f2f..41a0ba3f 100644
--- a/process_manager/templates/process_manager/index.html
+++ b/process_manager/templates/process_manager/index.html
@@ -1,4 +1,5 @@
 {% extends "main/base.html" %}
+{% load tz %}
 {% block title %}
   Home
 {% endblock title %}
@@ -64,18 +65,6 @@
     end
   end
   </script>
-  <script>
-  document.addEventListener('DOMContentLoaded', function() {
-    var timezoneElement = document.getElementById('timezone');
-    var timezone = Intl.DateTimeFormat().resolvedOptions().timeZone;
-    var offset = new Date().getTimezoneOffset();
-    var offsetHours = Math.floor(Math.abs(offset / 60)); // Ensure whole number
-    var offsetMinutes = Math.abs(offset % 60);
-    var offsetSign = offset <= 0 ? '+' : '-';
-    var offsetString = offsetSign + String(offsetHours).padStart(2, '0') + ':' + String(offsetMinutes).padStart(2, '0');
-    timezoneElement.textContent = timezone + ' (UTC' + offsetString + ')';
-  });
-  </script>
 {% endblock extra_js %}
 {% block content %}
   <div class="container-fluid no-padding no-margin">
@@ -138,29 +127,32 @@ <h5>Process Control</h5>
         <div class="card shadow-sm">
           <div class="card-header bg-info text-white">
             <h5 class="d-inline">Messages</h5>
-            <span class="d-inline"id="timezone"></span>
-            <!-- Updated Hide Messages Button as a close icon -->
-            <button id="hide-messages-button"
-                    type="button"
-                    class="btn-close"
-                    aria-label="Close"
-                    _="on click add .hide-messages to #main-content show #show-messages-button"></button>
-          </div>
-          <div class="card-body">
-            <input class="form-control mb-2"
-                   type="search"
-                   name="search"
-                   placeholder="Search messages..."
-                   hx-get="{% url 'process_manager:messages' %}"
-                   hx-trigger="input changed delay:500ms, every 1s"
-                   hx-target="#message-list">
-            <div id="message-list"
-                 class="list-group"
+            {% timezone None %}
+            {% now "e (O)" as server_time %}
+          {% endtimezone %}
+          <span id="timezone" class="d-line">{{ server_time }}</span>
+          <!-- Updated Hide Messages Button as a close icon -->
+          <button id="hide-messages-button"
+                  type="button"
+                  class="btn-close"
+                  aria-label="Close"
+                  _="on click add .hide-messages to #main-content show #show-messages-button"></button>
+        </div>
+        <div class="card-body">
+          <input class="form-control mb-2"
+                 type="search"
+                 name="search"
+                 placeholder="Search messages..."
                  hx-get="{% url 'process_manager:messages' %}"
-                 hx-trigger="load"></div>
-          </div>
+                 hx-trigger="input changed delay:500ms, every 1s"
+                 hx-target="#message-list">
+          <div id="message-list"
+               class="list-group"
+               hx-get="{% url 'process_manager:messages' %}"
+               hx-trigger="load"></div>
         </div>
       </div>
     </div>
   </div>
+</div>
 {% endblock content %}

From ac32ef9d8785af151ce2629526764a0c7076a475 Mon Sep 17 00:00:00 2001
From: sahil raja <s.raja@imperial.ac.uk>
Date: Thu, 31 Oct 2024 09:41:46 +0000
Subject: [PATCH 5/5] moving the timezone info above the search bar

---
 .../templates/process_manager/index.html      | 45 ++++++++++---------
 1 file changed, 23 insertions(+), 22 deletions(-)

diff --git a/process_manager/templates/process_manager/index.html b/process_manager/templates/process_manager/index.html
index 41a0ba3f..bf269ad9 100644
--- a/process_manager/templates/process_manager/index.html
+++ b/process_manager/templates/process_manager/index.html
@@ -52,6 +52,9 @@
       max-height: 60vh;
       overflow-y: auto;
     }
+    #timezone {
+      font-size: 10pt;
+    }
   </style>
 {% endblock extra_css %}
 {% block extra_js %}
@@ -127,32 +130,30 @@ <h5>Process Control</h5>
         <div class="card shadow-sm">
           <div class="card-header bg-info text-white">
             <h5 class="d-inline">Messages</h5>
-            {% timezone None %}
+            <!-- Updated Hide Messages Button as a close icon -->
+            <button id="hide-messages-button"
+                    type="button"
+                    class="btn-close"
+                    aria-label="Close"
+                    _="on click add .hide-messages to #main-content show #show-messages-button"></button>
+          </div>
+          <div class="card-body">
             {% now "e (O)" as server_time %}
-          {% endtimezone %}
-          <span id="timezone" class="d-line">{{ server_time }}</span>
-          <!-- Updated Hide Messages Button as a close icon -->
-          <button id="hide-messages-button"
-                  type="button"
-                  class="btn-close"
-                  aria-label="Close"
-                  _="on click add .hide-messages to #main-content show #show-messages-button"></button>
-        </div>
-        <div class="card-body">
-          <input class="form-control mb-2"
-                 type="search"
-                 name="search"
-                 placeholder="Search messages..."
+            <span id="timezone" class="d-line text-body-tertiary">All timestamps are displayed in {{ server_time }}</span>
+            <input class="form-control mb-2"
+                   type="search"
+                   name="search"
+                   placeholder="Search messages..."
+                   hx-get="{% url 'process_manager:messages' %}"
+                   hx-trigger="input changed delay:500ms, every 1s"
+                   hx-target="#message-list">
+            <div id="message-list"
+                 class="list-group"
                  hx-get="{% url 'process_manager:messages' %}"
-                 hx-trigger="input changed delay:500ms, every 1s"
-                 hx-target="#message-list">
-          <div id="message-list"
-               class="list-group"
-               hx-get="{% url 'process_manager:messages' %}"
-               hx-trigger="load"></div>
+                 hx-trigger="load"></div>
+          </div>
         </div>
       </div>
     </div>
   </div>
-</div>
 {% endblock content %}