From d387ab3a134916132d7c090825feb7c7f477b405 Mon Sep 17 00:00:00 2001
From: flippedbits <rrushton@gmail.com>
Date: Sun, 22 Sep 2024 23:38:08 -0700
Subject: [PATCH] Add hours minutes and seconds duration to task list view.

---
 static/tasks.js | 31 ++++++++++++++++++++++++-------
 1 file changed, 24 insertions(+), 7 deletions(-)

diff --git a/static/tasks.js b/static/tasks.js
index f7f9b09..4aea82b 100644
--- a/static/tasks.js
+++ b/static/tasks.js
@@ -1,6 +1,6 @@
 /**
  * tasks.js
- * 
+ *
  * Helpers for the task listing
  */
 
@@ -37,16 +37,33 @@ function renderStatus(status)
 /**
  * Render a task as a list group item
  *
- * @param {JSON} task The task to be rendered 
- * @returns 
+ * @param {JSON} task The task to be rendered
+ * @returns
  */
 export function renderTask(task)
 {
-    const started = new Date(task.tsStarted * 1000).toLocaleString();
-    const ended = task.tsEnded != 0 ? new Date(task.tsEnded * 1000).toLocaleString() : "--";
-    const status = renderStatus(task.status);
+    const hasEnded = task.tsEnded != 0;
+    const start = new Date(task.tsStarted * 1000);
+    const end = hasEnded ? new Date(task.tsEnded * 1000) : null;
+    let duration = "--";
+
+    if (hasEnded) {
+        const difference = Math.abs(start.getTime() - end.getTime());
+        const hours = Math.floor(difference / (1000 * 60 * 60));
+        const minutes = Math.floor((difference % (1000 * 60 * 60)) / (1000 * 60));
+        const seconds = Math.floor((difference % (1000 * 60)) / 1000);
+
+        duration =
+          (hours ? hours + "h " : "") +
+          (minutes ? minutes + "m " : "") +
+          seconds +
+          "s";
+    }
+
+    const timestamp = hasEnded
+      ? `Ended @ ${end.toLocaleString()} (${duration} on ${task.allocatedBuilder})`
+      : `Started @ ${start.toLocaleString()} on ${task.allocatedBuilder}`;
 
-    const timestamp = task.tsEnded != 0 ? "Ended @ " + ended : "Started @ " + started;
     return `
 <div class="list-group-item list-group-item-hoverable">
     <div class="row align-items-center">