Typing indicator for GUI
This commit is contained in:
parent
0ab585943f
commit
16c1d680cb
|
@ -72,3 +72,22 @@ body {
|
|||
background-color: #2980b9;
|
||||
color: #ecf0f1;
|
||||
}
|
||||
@keyframes ellipsis {
|
||||
0%, 20% {
|
||||
content: '';
|
||||
}
|
||||
40% {
|
||||
content: '.';
|
||||
}
|
||||
60% {
|
||||
content: '..';
|
||||
}
|
||||
80%, 100% {
|
||||
content: '...';
|
||||
}
|
||||
}
|
||||
|
||||
.ellipsis::after {
|
||||
content: '';
|
||||
animation: ellipsis 2s infinite;
|
||||
}
|
||||
|
|
|
@ -30,6 +30,8 @@ document.addEventListener('DOMContentLoaded', () => {
|
|||
|
||||
displayMessage(userInput, 'user');
|
||||
|
||||
const typingIndicator = displayTypingIndicator();
|
||||
|
||||
try {
|
||||
const response = await window.electronAPI.sendPrompt(userInput);
|
||||
const assistantMessage = response.choices[0].message.content.trim();
|
||||
|
@ -38,6 +40,8 @@ document.addEventListener('DOMContentLoaded', () => {
|
|||
console.error(`Error sending prompt: ${error.message}`);
|
||||
displayMessage(`Error: ${error.message}`, 'assistant');
|
||||
} finally {
|
||||
typingIndicator.remove();
|
||||
|
||||
sendButton.disabled = false;
|
||||
promptInput.disabled = false;
|
||||
promptInput.focus();
|
||||
|
@ -46,4 +50,14 @@ document.addEventListener('DOMContentLoaded', () => {
|
|||
} else {
|
||||
console.error('chatForm or promptInput elements not found!');
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
function displayTypingIndicator() {
|
||||
const chatHistory = document.getElementById('chatHistory');
|
||||
const typingIndicator = document.createElement('div');
|
||||
typingIndicator.classList.add('message', 'assistantMessage', 'ellipsis');
|
||||
typingIndicator.textContent = 'Processing';
|
||||
chatHistory.appendChild(typingIndicator);
|
||||
chatHistory.scrollTop = chatHistory.scrollHeight;
|
||||
return typingIndicator;
|
||||
}
|
Loading…
Reference in New Issue