diff --git a/examples/web_client.html b/examples/web_client.html
index 5eb24dc..0d9b6f7 100644
--- a/examples/web_client.html
+++ b/examples/web_client.html
@@ -396,6 +396,8 @@
let playbackSources = [];
let interimUserEl = null;
let interimAiEl = null;
+ let interimUserText = "";
+ let interimAiText = "";
const targetSampleRate = 16000;
@@ -437,6 +439,8 @@
if (el) el.remove();
if (isAi) interimAiEl = null;
else interimUserEl = null;
+ if (isAi) interimAiText = "";
+ else interimUserText = "";
return;
}
if (!el) {
@@ -450,6 +454,17 @@
chatHistory.scrollTop = chatHistory.scrollHeight;
}
+ function stopPlayback() {
+ discardAudio = true;
+ playbackTime = audioCtx ? audioCtx.currentTime : 0;
+ playbackSources.forEach((s) => {
+ try {
+ s.stop();
+ } catch (err) {}
+ });
+ playbackSources = [];
+ }
+
function setStatus(connected, detail) {
statusDot.classList.toggle("on", connected);
statusText.textContent = connected ? "Connected" : "Disconnected";
@@ -581,7 +596,8 @@
setInterim("You", "");
addChat("You", event.text);
} else if (event.text) {
- setInterim("You", event.text);
+ interimUserText += event.text;
+ setInterim("You", interimUserText);
}
}
if (type === "llmResponse") {
@@ -589,33 +605,21 @@
setInterim("AI", "");
addChat("AI", event.text);
} else if (event.text) {
- setInterim("AI", event.text);
+ interimAiText += event.text;
+ setInterim("AI", interimAiText);
}
}
if (type === "trackStart") {
+ // New bot audio: stop any previous playback to avoid overlap
+ stopPlayback();
discardAudio = false;
- playbackTime = audioCtx ? audioCtx.currentTime : 0;
}
if (type === "speaking") {
// User started speaking: clear any in-flight audio to avoid overlap
- discardAudio = true;
- playbackTime = audioCtx ? audioCtx.currentTime : 0;
- playbackSources.forEach((s) => {
- try {
- s.stop();
- } catch (err) {}
- });
- playbackSources = [];
+ stopPlayback();
}
if (type === "interrupt") {
- discardAudio = true;
- playbackTime = audioCtx ? audioCtx.currentTime : 0;
- playbackSources.forEach((s) => {
- try {
- s.stop();
- } catch (err) {}
- });
- playbackSources = [];
+ stopPlayback();
}
}