Spaces:
Sleeping
Sleeping
Update templates/chat.html
Browse files- templates/chat.html +49 -0
templates/chat.html
CHANGED
@@ -77,6 +77,39 @@
|
|
77 |
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
|
78 |
}
|
79 |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
80 |
.input-container {
|
81 |
display: flex;
|
82 |
gap: 12px;
|
@@ -263,6 +296,7 @@
|
|
263 |
messageDiv.textContent = message;
|
264 |
chatContainer.appendChild(messageDiv);
|
265 |
chatContainer.scrollTop = chatContainer.scrollHeight;
|
|
|
266 |
}
|
267 |
|
268 |
function updateSources(sources) {
|
@@ -284,6 +318,16 @@
|
|
284 |
addMessage(message, true);
|
285 |
messageInput.value = '';
|
286 |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
287 |
try {
|
288 |
const response = await fetch('/chat', {
|
289 |
method: 'POST',
|
@@ -295,6 +339,9 @@
|
|
295 |
|
296 |
const data = await response.json();
|
297 |
|
|
|
|
|
|
|
298 |
if (data.error) {
|
299 |
addMessage(data.error, false);
|
300 |
return;
|
@@ -317,6 +364,8 @@
|
|
317 |
updateSources(data.answer[1]);
|
318 |
}
|
319 |
} catch (error) {
|
|
|
|
|
320 |
console.error('Error:', error);
|
321 |
addMessage('Sorry, there was an error processing your message.', false);
|
322 |
}
|
|
|
77 |
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
|
78 |
}
|
79 |
|
80 |
+
.loading-dots {
|
81 |
+
display: inline-block;
|
82 |
+
}
|
83 |
+
|
84 |
+
@keyframes dots {
|
85 |
+
0% {
|
86 |
+
content: '';
|
87 |
+
}
|
88 |
+
|
89 |
+
25% {
|
90 |
+
content: '.';
|
91 |
+
}
|
92 |
+
|
93 |
+
50% {
|
94 |
+
content: '..';
|
95 |
+
}
|
96 |
+
|
97 |
+
75% {
|
98 |
+
content: '...';
|
99 |
+
}
|
100 |
+
|
101 |
+
100% {
|
102 |
+
content: '';
|
103 |
+
}
|
104 |
+
}
|
105 |
+
|
106 |
+
.loading-dots::after {
|
107 |
+
content: '';
|
108 |
+
animation: dots 2s infinite;
|
109 |
+
display: inline-block;
|
110 |
+
width: 1em;
|
111 |
+
}
|
112 |
+
|
113 |
.input-container {
|
114 |
display: flex;
|
115 |
gap: 12px;
|
|
|
296 |
messageDiv.textContent = message;
|
297 |
chatContainer.appendChild(messageDiv);
|
298 |
chatContainer.scrollTop = chatContainer.scrollHeight;
|
299 |
+
return messageDiv;
|
300 |
}
|
301 |
|
302 |
function updateSources(sources) {
|
|
|
318 |
addMessage(message, true);
|
319 |
messageInput.value = '';
|
320 |
|
321 |
+
// Add loading message
|
322 |
+
const loadingDiv = document.createElement('div');
|
323 |
+
loadingDiv.className = 'message bot-message';
|
324 |
+
const loadingSpan = document.createElement('span');
|
325 |
+
loadingSpan.className = 'loading-dots';
|
326 |
+
loadingSpan.textContent = 'Thinking';
|
327 |
+
loadingDiv.appendChild(loadingSpan);
|
328 |
+
chatContainer.appendChild(loadingDiv);
|
329 |
+
chatContainer.scrollTop = chatContainer.scrollHeight;
|
330 |
+
|
331 |
try {
|
332 |
const response = await fetch('/chat', {
|
333 |
method: 'POST',
|
|
|
339 |
|
340 |
const data = await response.json();
|
341 |
|
342 |
+
// Remove loading message
|
343 |
+
chatContainer.removeChild(loadingDiv);
|
344 |
+
|
345 |
if (data.error) {
|
346 |
addMessage(data.error, false);
|
347 |
return;
|
|
|
364 |
updateSources(data.answer[1]);
|
365 |
}
|
366 |
} catch (error) {
|
367 |
+
// Remove loading message
|
368 |
+
chatContainer.removeChild(loadingDiv);
|
369 |
console.error('Error:', error);
|
370 |
addMessage('Sorry, there was an error processing your message.', false);
|
371 |
}
|