jason/ThunderAI
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

svg added when receiving text. see #671

Browse source
This commit is contained in:
mic 2026-02-22 22:53:36 +01:00
parent 470b78ce90
commit 9894c2114c
1 changed files with 20 additions and 3 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

23
api_webchat/messageInput.js
View file

@ -66,6 +66,13 @@ messagesInputStyle.textContent = `
border-radius: 5px; border-radius: 5px;
padding: 5px; padding: 5px;
background: #F2F2F2; background: #F2F2F2;
display: flex;
align-items: center;
gap: 3px;
}
#statusLoggerImg{
display: none;
vertical-align: middle;
} }
#mzta-custom_text{ #mzta-custom_text{
padding:10px; padding:10px;
@ -183,8 +190,14 @@ messageInputTemplate.content.appendChild(stopButton);
const statusLogger = document.createElement('div'); const statusLogger = document.createElement('div');
statusLogger.id = 'statusLogger'; statusLogger.id = 'statusLogger';
statusLogger.textContent = '';
statusLogger.style.display = 'none'; statusLogger.style.display = 'none';
const statusLoggerImg = document.createElement('img');
statusLoggerImg.id = 'statusLoggerImg';
statusLoggerImg.src = browser.runtime.getURL('/popup/mzta-loading.svg');
statusLogger.appendChild(statusLoggerImg);
const statusLoggerText = document.createElement('span');
statusLoggerText.id = 'statusLoggerText';
statusLogger.appendChild(statusLoggerText);
messageInputTemplate.content.appendChild(statusLogger); messageInputTemplate.content.appendChild(statusLogger);
//div per custom text //div per custom text
@ -227,6 +240,8 @@ class MessageInput extends HTMLElement {
this._sendButton = shadowRoot.querySelector('#sendButton'); this._sendButton = shadowRoot.querySelector('#sendButton');
this._stopButton = shadowRoot.querySelector('#stopButton'); this._stopButton = shadowRoot.querySelector('#stopButton');
this._statusLogger = shadowRoot.querySelector('#statusLogger'); this._statusLogger = shadowRoot.querySelector('#statusLogger');
this._statusLoggerImg = shadowRoot.querySelector('#statusLoggerImg');
this._statusLoggerText = shadowRoot.querySelector('#statusLoggerText');
this._messageInputField.addEventListener('keydown', this._handleKeyDown.bind(this)); this._messageInputField.addEventListener('keydown', this._handleKeyDown.bind(this));
this._sendButton.addEventListener('click', this._handleClick.bind(this)); this._sendButton.addEventListener('click', this._handleClick.bind(this));
@ -284,15 +299,16 @@ class MessageInput extends HTMLElement {
} }
setStatusMessage(message) { setStatusMessage(message) {
this._statusLogger.textContent = message; this._statusLoggerText.textContent = message;
} }
showStatusMessage() { showStatusMessage() {
this._statusLogger.style.display = 'block'; this._statusLogger.style.display = 'flex';
} }
hideStatusMessage() { hideStatusMessage() {
this._statusLogger.style.display = 'none'; this._statusLogger.style.display = 'none';
this._statusLoggerImg.style.display = 'none';
} }
_handleKeyDown(event) { _handleKeyDown(event) {
@ -328,6 +344,7 @@ class MessageInput extends HTMLElement {
this.messagesAreaComponent.appendUserMessage(messageContent); this.messagesAreaComponent.appendUserMessage(messageContent);
} }
this.setStatusMessage(browser.i18n.getMessage('WaitingServerResponse') + '...'); this.setStatusMessage(browser.i18n.getMessage('WaitingServerResponse') + '...');
this._statusLoggerImg.style.display = 'inline';
this.showStatusMessage(); this.showStatusMessage();
this.worker.postMessage({ type: 'chatMessage', message: messageContent }); this.worker.postMessage({ type: 'chatMessage', message: messageContent });
} }