fix: format duration, also change formatting to xhxmxs

webui/src/components/display/BlobPreview.svelte

@@ -8,6 +8,7 @@
   import { API_URL } from "../../lib/api";
   import { createEventDispatcher } from "svelte";
   import { getTypes } from "../../util/mediatypes";
+  import { formatDuration } from "../../util/fragments/time";
   const dispatch = createEventDispatcher();
 
   export let address: string;
@@ -45,16 +46,7 @@
   $: {
     let duration = $entity?.get("MEDIA_DURATION") as number | undefined;
     if (duration) {
-      const hours = Math.floor(duration / 3600);
-      const minutes = Math.floor((duration % 3600) / 60);
-      const seconds = Math.floor(duration - hours * 3600 - minutes * 60);
-
-      mediaDuration = "";
-      if (hours > 0) {
-        mediaDuration += `${hours}:`.padStart(3, "0");
-      }
-      mediaDuration += `${minutes}:`.padStart(3, "0");
-      mediaDuration += `${seconds}`.padStart(2, "0");
+      mediaDuration = formatDuration(duration);
     }
   }
 

webui/src/components/widgets/EntryList.svelte

@@ -14,6 +14,7 @@
   import { type Readable, readable } from "svelte/store";
   import { defaultEntitySort, entityValueSort } from "../../util/sort";
   import { attributeLabels } from "../../util/labels";
+  import { formatDuration } from "../../util/fragments/time";
   const dispatch = createEventDispatcher();
 
   export let columns: string | undefined = undefined;
@@ -162,6 +163,8 @@
         );
       case "NUM_VISITED":
         return `${value} times`;
+      case "MEDIA_DURATION":
+        return formatDuration(parseInt(String(value), 10));
       default:
         return String(value);
     }

webui/src/util/fragments/time.ts

@@ -27,3 +27,20 @@ export class TimeFragment {
     return `t=${this.start || ""},${this.end || ""}`;
   }
 }
+
+export function formatDuration(duration: number): string {
+  let result = "";
+
+  const hours = Math.floor(duration / 3600);
+  const minutes = Math.floor((duration % 3600) / 60);
+  const seconds = Math.floor(duration - hours * 3600 - minutes * 60);
+
+  result = "";
+  if (hours > 0) {
+    result += `${hours}h`;
+  }
+  result += `${minutes}m`.padStart(hours > 0 ? 3 : 2, "0");
+  result += `${seconds}s`.padStart(3, "0");
+
+  return result;
+}