Update static/index.html
Browse files- static/index.html +7 -6
static/index.html
CHANGED
@@ -171,6 +171,8 @@
|
|
171 |
try {
|
172 |
const audioBlob = new Blob(audioChunks, { type: "audio/webm" });
|
173 |
const wavBlob = await convertWebMToWav(audioBlob);
|
|
|
|
|
174 |
const formData = new FormData();
|
175 |
formData.append("file", wavBlob, "recording.wav");
|
176 |
|
@@ -180,18 +182,18 @@
|
|
180 |
});
|
181 |
|
182 |
if (response.ok) {
|
183 |
-
//
|
184 |
const userMessage = response.headers.get("X-User-Message") || "No user message";
|
185 |
const llmResponse = response.headers.get("X-LLM-Response") || "No response";
|
186 |
|
187 |
-
// Update the
|
188 |
userMessageHeader.innerHTML = `X-User-Message: <span class="text-primary">${userMessage}</span>`;
|
189 |
llmResponseHeader.innerHTML = `X-LLM-Response: <span class="text-success">${llmResponse}</span>`;
|
190 |
|
191 |
-
// Update received data
|
192 |
receivedData.textContent = userMessage;
|
193 |
|
194 |
-
// Get audio response
|
195 |
const audioData = await response.blob();
|
196 |
document.getElementById("audioPlayer").src = URL.createObjectURL(audioData);
|
197 |
statusMessage.textContent = "Data decoded successfully!";
|
@@ -238,8 +240,7 @@
|
|
238 |
const response = await fetch("/tts/", {
|
239 |
method: "POST",
|
240 |
headers: {
|
241 |
-
"Content-Type": "application/json"
|
242 |
-
"X-User-Message": text
|
243 |
},
|
244 |
body: JSON.stringify({ text })
|
245 |
});
|
|
|
171 |
try {
|
172 |
const audioBlob = new Blob(audioChunks, { type: "audio/webm" });
|
173 |
const wavBlob = await convertWebMToWav(audioBlob);
|
174 |
+
|
175 |
+
// This is the original code from your first implementation
|
176 |
const formData = new FormData();
|
177 |
formData.append("file", wavBlob, "recording.wav");
|
178 |
|
|
|
182 |
});
|
183 |
|
184 |
if (response.ok) {
|
185 |
+
// Display response headers that we know are sent back from the endpoint
|
186 |
const userMessage = response.headers.get("X-User-Message") || "No user message";
|
187 |
const llmResponse = response.headers.get("X-LLM-Response") || "No response";
|
188 |
|
189 |
+
// Update the header display
|
190 |
userMessageHeader.innerHTML = `X-User-Message: <span class="text-primary">${userMessage}</span>`;
|
191 |
llmResponseHeader.innerHTML = `X-LLM-Response: <span class="text-success">${llmResponse}</span>`;
|
192 |
|
193 |
+
// Update received data
|
194 |
receivedData.textContent = userMessage;
|
195 |
|
196 |
+
// Get audio blob from response and play it
|
197 |
const audioData = await response.blob();
|
198 |
document.getElementById("audioPlayer").src = URL.createObjectURL(audioData);
|
199 |
statusMessage.textContent = "Data decoded successfully!";
|
|
|
240 |
const response = await fetch("/tts/", {
|
241 |
method: "POST",
|
242 |
headers: {
|
243 |
+
"Content-Type": "application/json"
|
|
|
244 |
},
|
245 |
body: JSON.stringify({ text })
|
246 |
});
|