From dd38dbd0f73b79acf304d850151253d19760bfdf Mon Sep 17 00:00:00 2001
From: Armin <armin@raumschiff>
Date: Thu, 9 Jul 2026 00:27:48 +0200
Subject: [PATCH] show progress bar before waveform loads

- Draw progress bar track background unconditionally when no waveform
  exists, so the waveform area never appears blank
- Call drawWaveform() from onLoadedmetadata() so the bar fill appears
  as soon as metadata is available
---
 index.html | 11 ++++++-----
 1 file changed, 6 insertions(+), 5 deletions(-)

diff --git a/index.html b/index.html
index 5dba1e6..738b7f1 100644
--- a/index.html
+++ b/index.html
@@ -676,13 +676,13 @@ function drawWaveform() {
   ctx.clearRect(0, 0, visWidth, h);
   if (!t) return;
   if (!t.waveform) {
+    const barH = 4, y = (h - barH) / 2;
+    ctx.fillStyle = '#272c42';
+    ctx.beginPath();
+    ctx.roundRect(0, y, visWidth, barH, 2);
+    ctx.fill();
     if (audio && audio.duration) {
       const pct = audio.currentTime / audio.duration;
-      const barH = 4, y = (h - barH) / 2;
-      ctx.fillStyle = '#272c42';
-      ctx.beginPath();
-      ctx.roundRect(0, y, visWidth, barH, 2);
-      ctx.fill();
       ctx.fillStyle = '#84a0c6';
       ctx.beginPath();
       ctx.roundRect(0, y, visWidth * pct, barH, 2);
@@ -1562,6 +1562,7 @@ function onLoadedmetadata(e) {
   if (t && audio.duration) {
     t.playtime = audio.duration;
     renderTracks();
+    drawWaveform();
     computeWaveform(t);
   }
 }