From 848c4d2b1b1a0cf7536ca70e803e6c5fcdaa0c1c Mon Sep 17 00:00:00 2001
From: Mike Lang <mikelang3000@gmail.com>
Date: Sun, 10 Oct 2021 17:36:27 +1100
Subject: [PATCH] thrimbletrimmer: Add waveform image below video

---
 thrimbletrimmer/index.html    | 1 +
 thrimbletrimmer/scripts/IO.js | 4 ++++
 2 files changed, 5 insertions(+)

diff --git a/thrimbletrimmer/index.html b/thrimbletrimmer/index.html
index d77598e..1b6df5d 100644
--- a/thrimbletrimmer/index.html
+++ b/thrimbletrimmer/index.html
@@ -79,6 +79,7 @@
         </div>
 
         <div id="EditorDetailsPane">
+			<img id="Waveform" style="width: 100%">
             <div id="EditNotesPane" style="display:none">
                 Edit Notes: <br/>
                 <textarea id="EditNotes" disabled ></textarea>
diff --git a/thrimbletrimmer/scripts/IO.js b/thrimbletrimmer/scripts/IO.js
index d780c40..6639c98 100644
--- a/thrimbletrimmer/scripts/IO.js
+++ b/thrimbletrimmer/scripts/IO.js
@@ -272,6 +272,10 @@ function loadPlaylist(isEditor, startTrim, endTrim, defaultQuality) {
 				document.getElementById("wubloaderAdvancedInputTable").style.display = "block";
 			}
 		});
+
+	// Get audio waveform. Note we assume "source" is a valid quality.
+	const waveformURL = `/waveform/${stream}/source.png?${buildQuery(range)}`;
+	document.getElementById("Waveform").setAttribute("src", waveformURL);
 }
 
 function thrimbletrimmerSubmit(state, override_changes = false) {