pipecat-ai · filipi87 · Feb 14, 2025 · Feb 14, 2025
diff --git a/examples/instant-voice/.gitignore b/examples/instant-voice/.gitignore
@@ -0,0 +1,7 @@
+venv
+.idea
+server/.env
+client/javascript/node_modules
+client/javascript/.vite
+bkp
+
diff --git a/examples/instant-voice/README.md b/examples/instant-voice/README.md
@@ -0,0 +1,55 @@
+# Instant Voice
+
+This demo showcases how to enable instant voice communication as soon as a user connects.
+By leveraging optimizations on both the server and client sides, users can start speaking immediately after pressing the connect button.
+
+## How It Works
+
+### Server-Side Improvements:
+- A **pool of Daily rooms** is managed to ensure quick connections.
+- When a user connects, an existing room from the pool is assigned.
+- A new room is created asynchronously to maintain the predefined pool size.
+
+### Client-Side Improvements:
+- Using the **DailyTransport** property `bufferLocalAudioUntilBotReady` set to enabled, users can start speaking immediately
+  upon receiving the `AUDIO_BUFFERING_STARTED` event (typically within ~1s).
+- This allows users to speak even before the bot is fully ready or the WebRTC connection is fully established.
+
+## Quick Start
+
+### 1. Start the Bot Server
+
+1. Navigate to the server directory:
+   ```bash
+   cd server
+   ```
+2. Create and activate a virtual environment:
+   ```bash
+   python3 -m venv venv
+   source venv/bin/activate  # On Windows: venv\Scripts\activate
+   ```
+3. Install dependencies:
+   ```bash
+   pip install -r requirements.txt
+   ```
+4. Copy the `.env.example` file to `.env` and configure it:
+    - Add your API keys.
+5. Start the server:
+   ```bash
+   python src/server.py
+   ```
+
+### 2. Connect Using the Client App
+
+For client-side setup, refer to the [JavaScript Guide](client/javascript/README.md).
+
+## Important Notes
+- The bot server **must** be running before using the client implementation.
+- Ensure your environment variables are correctly set up.
+
+## Requirements
+- **Python 3.10+**
+- **Node.js 16+** (for JavaScript/React client)
+- **Daily API key**
+- **Google API key**
+- **Modern web browser with WebRTC support**
diff --git a/examples/instant-voice/client/javascript/README.md b/examples/instant-voice/client/javascript/README.md
@@ -0,0 +1,27 @@
+# JavaScript Implementation
+
+Basic implementation using the [Pipecat JavaScript SDK](https://docs.pipecat.ai/client/js/introduction).
+
+## Setup
+
+1. Run the bot server. See the [server README](../../README).
+
+2. Navigate to the `client/javascript` directory:
+
+```bash
+cd client/javascript
+```
+
+3. Install dependencies:
+
+```bash
+npm install
+```
+
+4. Run the client app:
+
+```
+npm run dev
+```
+
+5. Visit http://localhost:5173 in your browser.
diff --git a/examples/instant-voice/client/javascript/index.html b/examples/instant-voice/client/javascript/index.html
@@ -0,0 +1,37 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <title>AI Chatbot</title>
+</head>
+
+<body>
+<div class="container">
+  <div class="status-bar">
+    <div class="status">
+      Buffering audio: <span id="buffering-status">No</span>
+    </div>
+    <div class="status">
+      Transport: <span id="connection-status">Disconnected</span>
+    </div>
+    <div class="controls">
+      <button id="connect-btn">Connect</button>
+      <button id="disconnect-btn" disabled>Disconnect</button>
+    </div>
+  </div>
+
+  <audio id="bot-audio" autoplay></audio>
+
+  <div class="debug-panel">
+    <h3>Debug Info</h3>
+    <div id="debug-log"></div>
+  </div>
+</div>
+
+<script type="module" src="/src/app.ts"></script>
+<link rel="stylesheet" href="/src/style.css">
+</body>
+
+</html>