Spaces:
Runtime error
Runtime error
Upload folder using huggingface_hub
Browse files- index.html +43 -1
index.html
CHANGED
|
@@ -176,10 +176,28 @@
|
|
| 176 |
transform: scale(1.2);
|
| 177 |
}
|
| 178 |
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 179 |
</style>
|
| 180 |
</head>
|
| 181 |
|
| 182 |
<body>
|
|
|
|
|
|
|
| 183 |
<div class="container">
|
| 184 |
<div class="logo">
|
| 185 |
<h1>Talk to Sambanova 🗣️</h1>
|
|
@@ -258,11 +276,24 @@
|
|
| 258 |
updateAudioLevel();
|
| 259 |
}
|
| 260 |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 261 |
function handleMessage(event) {
|
| 262 |
const eventJson = JSON.parse(event.data);
|
| 263 |
const typingIndicator = document.getElementById('typing-indicator');
|
| 264 |
|
| 265 |
-
if (eventJson.type === "
|
|
|
|
|
|
|
| 266 |
fetch('/input_hook', {
|
| 267 |
method: 'POST',
|
| 268 |
headers: {
|
|
@@ -337,6 +368,15 @@
|
|
| 337 |
});
|
| 338 |
|
| 339 |
const serverResponse = await response.json();
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 340 |
await peerConnection.setRemoteDescription(serverResponse);
|
| 341 |
|
| 342 |
eventSource = new EventSource('/outputs?webrtc_id=' + webrtc_id);
|
|
@@ -348,6 +388,8 @@
|
|
| 348 |
});
|
| 349 |
} catch (err) {
|
| 350 |
console.error('Error setting up WebRTC:', err);
|
|
|
|
|
|
|
| 351 |
}
|
| 352 |
}
|
| 353 |
|
|
|
|
| 176 |
transform: scale(1.2);
|
| 177 |
}
|
| 178 |
}
|
| 179 |
+
|
| 180 |
+
/* Add styles for toast notifications */
|
| 181 |
+
.toast {
|
| 182 |
+
position: fixed;
|
| 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;
|
| 191 |
+
z-index: 1000;
|
| 192 |
+
display: none;
|
| 193 |
+
box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
|
| 194 |
+
}
|
| 195 |
</style>
|
| 196 |
</head>
|
| 197 |
|
| 198 |
<body>
|
| 199 |
+
<!-- Add toast element after body opening tag -->
|
| 200 |
+
<div id="error-toast" class="toast"></div>
|
| 201 |
<div class="container">
|
| 202 |
<div class="logo">
|
| 203 |
<h1>Talk to Sambanova 🗣️</h1>
|
|
|
|
| 276 |
updateAudioLevel();
|
| 277 |
}
|
| 278 |
|
| 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
|
| 285 |
+
setTimeout(() => {
|
| 286 |
+
toast.style.display = 'none';
|
| 287 |
+
}, 5000);
|
| 288 |
+
}
|
| 289 |
+
|
| 290 |
function handleMessage(event) {
|
| 291 |
const eventJson = JSON.parse(event.data);
|
| 292 |
const typingIndicator = document.getElementById('typing-indicator');
|
| 293 |
|
| 294 |
+
if (eventJson.type === "error") {
|
| 295 |
+
showError(eventJson.message);
|
| 296 |
+
} else if (eventJson.type === "send_input") {
|
| 297 |
fetch('/input_hook', {
|
| 298 |
method: 'POST',
|
| 299 |
headers: {
|
|
|
|
| 368 |
});
|
| 369 |
|
| 370 |
const serverResponse = await response.json();
|
| 371 |
+
|
| 372 |
+
if (serverResponse.status === 'failed') {
|
| 373 |
+
showError(serverResponse.meta.error === 'concurrency_limit_reached'
|
| 374 |
+
? `Too many connections. Maximum limit is ${serverResponse.meta.limit}`
|
| 375 |
+
: serverResponse.meta.error);
|
| 376 |
+
stop();
|
| 377 |
+
return;
|
| 378 |
+
}
|
| 379 |
+
|
| 380 |
await peerConnection.setRemoteDescription(serverResponse);
|
| 381 |
|
| 382 |
eventSource = new EventSource('/outputs?webrtc_id=' + webrtc_id);
|
|
|
|
| 388 |
});
|
| 389 |
} catch (err) {
|
| 390 |
console.error('Error setting up WebRTC:', err);
|
| 391 |
+
showError('Failed to establish connection. Please try again.');
|
| 392 |
+
stop();
|
| 393 |
}
|
| 394 |
}
|
| 395 |
|