Upload folder using huggingface_hub
Browse files- app.py +3 -2
- index.html +29 -2
app.py
CHANGED
@@ -15,7 +15,7 @@ from fastrtc import (
|
|
15 |
Stream,
|
16 |
WebRTCError,
|
17 |
get_twilio_turn_credentials,
|
18 |
-
|
19 |
)
|
20 |
from gradio.utils import get_space
|
21 |
from pydantic import BaseModel
|
@@ -29,6 +29,7 @@ client = openai.OpenAI(
|
|
29 |
api_key=os.environ.get("SAMBANOVA_API_KEY"),
|
30 |
base_url="https://api.sambanova.ai/v1",
|
31 |
)
|
|
|
32 |
|
33 |
|
34 |
def response(
|
@@ -39,7 +40,7 @@ def response(
|
|
39 |
gradio_chatbot = gradio_chatbot or []
|
40 |
conversation_state = conversation_state or []
|
41 |
|
42 |
-
text = stt(audio)
|
43 |
sample_rate, array = audio
|
44 |
gradio_chatbot.append(
|
45 |
{"role": "user", "content": gr.Audio((sample_rate, array.squeeze()))}
|
|
|
15 |
Stream,
|
16 |
WebRTCError,
|
17 |
get_twilio_turn_credentials,
|
18 |
+
get_stt_model,
|
19 |
)
|
20 |
from gradio.utils import get_space
|
21 |
from pydantic import BaseModel
|
|
|
29 |
api_key=os.environ.get("SAMBANOVA_API_KEY"),
|
30 |
base_url="https://api.sambanova.ai/v1",
|
31 |
)
|
32 |
+
stt_model = get_stt_model()
|
33 |
|
34 |
|
35 |
def response(
|
|
|
40 |
gradio_chatbot = gradio_chatbot or []
|
41 |
conversation_state = conversation_state or []
|
42 |
|
43 |
+
text = stt_model.stt(audio)
|
44 |
sample_rate, array = audio
|
45 |
gradio_chatbot.append(
|
46 |
{"role": "user", "content": gr.Audio((sample_rate, array.squeeze()))}
|
index.html
CHANGED
@@ -183,8 +183,6 @@
|
|
183 |
top: 20px;
|
184 |
left: 50%;
|
185 |
transform: translateX(-50%);
|
186 |
-
background-color: #f44336;
|
187 |
-
color: white;
|
188 |
padding: 16px 24px;
|
189 |
border-radius: 4px;
|
190 |
font-size: 14px;
|
@@ -192,6 +190,16 @@
|
|
192 |
display: none;
|
193 |
box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
|
194 |
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
195 |
</style>
|
196 |
</head>
|
197 |
|
@@ -279,6 +287,7 @@
|
|
279 |
function showError(message) {
|
280 |
const toast = document.getElementById('error-toast');
|
281 |
toast.textContent = message;
|
|
|
282 |
toast.style.display = 'block';
|
283 |
|
284 |
// Hide toast after 5 seconds
|
@@ -319,6 +328,18 @@
|
|
319 |
const config = __RTC_CONFIGURATION__;
|
320 |
peerConnection = new RTCPeerConnection(config);
|
321 |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
322 |
try {
|
323 |
const stream = await navigator.mediaDevices.getUserMedia({
|
324 |
audio: true
|
@@ -352,6 +373,11 @@
|
|
352 |
|
353 |
peerConnection.addEventListener('connectionstatechange', () => {
|
354 |
console.log('connectionstatechange', peerConnection.connectionState);
|
|
|
|
|
|
|
|
|
|
|
355 |
updateButtonState();
|
356 |
});
|
357 |
|
@@ -387,6 +413,7 @@
|
|
387 |
addMessage(eventJson.message.role, eventJson.audio ?? eventJson.message.content);
|
388 |
});
|
389 |
} catch (err) {
|
|
|
390 |
console.error('Error setting up WebRTC:', err);
|
391 |
showError('Failed to establish connection. Please try again.');
|
392 |
stop();
|
|
|
183 |
top: 20px;
|
184 |
left: 50%;
|
185 |
transform: translateX(-50%);
|
|
|
|
|
186 |
padding: 16px 24px;
|
187 |
border-radius: 4px;
|
188 |
font-size: 14px;
|
|
|
190 |
display: none;
|
191 |
box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
|
192 |
}
|
193 |
+
|
194 |
+
.toast.error {
|
195 |
+
background-color: #f44336;
|
196 |
+
color: white;
|
197 |
+
}
|
198 |
+
|
199 |
+
.toast.warning {
|
200 |
+
background-color: #ffd700;
|
201 |
+
color: black;
|
202 |
+
}
|
203 |
</style>
|
204 |
</head>
|
205 |
|
|
|
287 |
function showError(message) {
|
288 |
const toast = document.getElementById('error-toast');
|
289 |
toast.textContent = message;
|
290 |
+
toast.className = 'toast error';
|
291 |
toast.style.display = 'block';
|
292 |
|
293 |
// Hide toast after 5 seconds
|
|
|
328 |
const config = __RTC_CONFIGURATION__;
|
329 |
peerConnection = new RTCPeerConnection(config);
|
330 |
|
331 |
+
const timeoutId = setTimeout(() => {
|
332 |
+
const toast = document.getElementById('error-toast');
|
333 |
+
toast.textContent = "Connection is taking longer than usual. Are you on a VPN?";
|
334 |
+
toast.className = 'toast warning';
|
335 |
+
toast.style.display = 'block';
|
336 |
+
|
337 |
+
// Hide warning after 5 seconds
|
338 |
+
setTimeout(() => {
|
339 |
+
toast.style.display = 'none';
|
340 |
+
}, 5000);
|
341 |
+
}, 5000);
|
342 |
+
|
343 |
try {
|
344 |
const stream = await navigator.mediaDevices.getUserMedia({
|
345 |
audio: true
|
|
|
373 |
|
374 |
peerConnection.addEventListener('connectionstatechange', () => {
|
375 |
console.log('connectionstatechange', peerConnection.connectionState);
|
376 |
+
if (peerConnection.connectionState === 'connected') {
|
377 |
+
clearTimeout(timeoutId);
|
378 |
+
const toast = document.getElementById('error-toast');
|
379 |
+
toast.style.display = 'none';
|
380 |
+
}
|
381 |
updateButtonState();
|
382 |
});
|
383 |
|
|
|
413 |
addMessage(eventJson.message.role, eventJson.audio ?? eventJson.message.content);
|
414 |
});
|
415 |
} catch (err) {
|
416 |
+
clearTimeout(timeoutId);
|
417 |
console.error('Error setting up WebRTC:', err);
|
418 |
showError('Failed to establish connection. Please try again.');
|
419 |
stop();
|