}, 5000);
}
- function handleMessage(event) {
+ async function handleMessage(event) {
// Handle any WebRTC data channel messages if needed
const eventJson = JSON.parse(event.data);
if (eventJson.type === "error") {
showError(eventJson.message);
+ } else if (eventJson.type === "send_input") {
+ const response = await fetch('/send_input', {
+ method: 'POST',
+ headers: { 'Content-Type': 'application/json' },
+ body: JSON.stringify({
+ webrtc_id: webrtc_id,
+ transcript: ""
+ })
+ });
}
console.log('Received message:', event.data);
+
}
function updateButtonState() {
diff --git a/docs/userguide/audio.md b/docs/userguide/audio.md
index e426e77..49357ca 100644
--- a/docs/userguide/audio.md
+++ b/docs/userguide/audio.md
@@ -3,6 +3,8 @@
Typically, you want to run a python function whenever a user has stopped speaking. This can be done by wrapping a python generator with the `ReplyOnPause` class and passing it to the `handler` argument of the `Stream` object. The `ReplyOnPause` class will handle the voice detection and turn taking logic automatically!
+By default, the `ReplyOnPause` handler will allow you to interrupt the response at any time by speaking again. If you do not want to allow interruption, you can set the `can_interrupt` parameter to `False`.
+
=== "Code"
```python
from fastrtc import ReplyOnPause, Stream
@@ -33,13 +35,14 @@ Typically, you want to run a python function whenever a user has stopped speakin
You can also use an async generator with `ReplyOnPause`.
!!! tip "Parameters"
- You can customize the voice detection parameters by passing in `algo_options` and `model_options` to the `ReplyOnPause` class.
+ You can customize the voice detection parameters by passing in `algo_options` and `model_options` to the `ReplyOnPause` class. Also, you can set the `can_interrupt` parameter to `False` to prevent the user from interrupting the response. By default, `can_interrupt` is `True`.
```python
from fastrtc import AlgoOptions, SileroVadOptions
stream = Stream(
handler=ReplyOnPause(
response,
+ can_interrupt=True,
algo_options=AlgoOptions(
audio_chunk_duration=0.6,
started_talking_threshold=0.2,
diff --git a/frontend/shared/InteractiveAudio.svelte b/frontend/shared/InteractiveAudio.svelte
index bd9332b..38861a8 100644
--- a/frontend/shared/InteractiveAudio.svelte
+++ b/frontend/shared/InteractiveAudio.svelte
@@ -7,10 +7,11 @@
import { StreamingBar } from "@gradio/statustracker";
import {
Circle,
- Square,
Spinner,
Music,
DropdownArrow,
+ VolumeMuted,
+ VolumeHigh,
Microphone,
} from "@gradio/icons";
@@ -77,6 +78,7 @@
let available_audio_devices: MediaDeviceInfo[];
let selected_device: MediaDeviceInfo | null = null;
let mic_accessed = false;
+ let is_muted = false;
const audio_source_callback = () => {
if (mode === "send") return stream;
@@ -261,6 +263,13 @@
options_open = false;
};
+ function toggleMute(): void {
+ if (audio_player) {
+ audio_player.muted = !audio_player.muted;
+ is_muted = audio_player.muted;
+ }
+ }
+
$: if (stopword_recognized) {
notification_sound.play();
}
@@ -314,19 +323,28 @@