showing the reply type in the api webchat. see #372

This commit is contained in:
Mic 2025-06-09 21:07:00 +02:00
parent 6515f7364a
commit 4330abce63
2 changed files with 26 additions and 8 deletions

View file

@ -137,7 +137,7 @@ switch (llm) {
//let prefs_ph = await browser.storage.sync.get({placeholders_use_default_value: false}); //let prefs_ph = await browser.storage.sync.get({placeholders_use_default_value: false});
// Event listeners for worker messages // Event listeners for worker messages
worker.onmessage = function(event) { worker.onmessage = async function(event) {
const { type, payload } = event.data; const { type, payload } = event.data;
switch (type) { switch (type) {
case 'messageSent': case 'messageSent':
@ -148,7 +148,7 @@ worker.onmessage = function(event) {
messageInput.setStatusMessage(browser.i18n.getMessage("apiwebchat_receiving_data") + '...'); messageInput.setStatusMessage(browser.i18n.getMessage("apiwebchat_receiving_data") + '...');
break; break;
case 'tokensDone': case 'tokensDone':
messagesArea.handleTokensDone(promptData); await messagesArea.handleTokensDone(promptData);
messageInput.enableInput(); messageInput.enableInput();
break; break;
case 'error': case 'error':

View file

@ -57,7 +57,9 @@ messagesAreaStyle.textContent = `
} }
.action-buttons { .action-buttons {
line-height: 1.3; line-height: 1.3;
text-align: center; display: flex;
align-items: center;
justify-content: center;
} }
.action-buttons button { .action-buttons button {
display: inline; display: inline;
@ -66,6 +68,11 @@ messagesAreaStyle.textContent = `
border-radius: 5px; border-radius: 5px;
cursor: pointer; cursor: pointer;
} }
.action_btn_info {
font-size: 0.6rem;
color: gray;
display: inline-block;
}
@keyframes fadeIn { @keyframes fadeIn {
to { to {
opacity: 1; opacity: 1;
@ -94,6 +101,8 @@ messagesAreaStyle.textContent = `
color: gray; color: gray;
margin-top: 5px; margin-top: 5px;
display: none; display: none;
width: 100%;
text-align: center;
} }
/* diff viewer */ /* diff viewer */
.added { .added {
@ -158,9 +167,9 @@ class MessagesArea extends HTMLElement {
this.llmName = llmName; this.llmName = llmName;
} }
handleTokensDone(promptData = null) { async handleTokensDone(promptData = null) {
this.flushAccumulatingMessage(); this.flushAccumulatingMessage();
this.addActionButtons(promptData); await this.addActionButtons(promptData);
this.addDivider(); this.addDivider();
} }
@ -238,7 +247,7 @@ class MessagesArea extends HTMLElement {
this.messages.scrollTop = this.messages.scrollHeight; this.messages.scrollTop = this.messages.scrollHeight;
} }
addActionButtons(promptData = null) { async addActionButtons(promptData = null) {
if(promptData == null) { return; } if(promptData == null) { return; }
const actionButtons = document.createElement('div'); const actionButtons = document.createElement('div');
actionButtons.classList.add('action-buttons'); actionButtons.classList.add('action-buttons');
@ -246,7 +255,15 @@ class MessagesArea extends HTMLElement {
selectionInfo.textContent = browser.i18n.getMessage("apiwebchat_selection_info"); selectionInfo.textContent = browser.i18n.getMessage("apiwebchat_selection_info");
selectionInfo.classList.add('sel_info'); selectionInfo.classList.add('sel_info');
const actionButton = document.createElement('button'); const actionButton = document.createElement('button');
actionButton.textContent = browser.i18n.getMessage("apiwebchat_use_this_answer"); const actionButton_line1 = document.createElement('span');
actionButton_line1.textContent = browser.i18n.getMessage("apiwebchat_use_this_answer");
const actionButton_line2 = document.createElement('span');
actionButton_line2.classList.add('action_btn_info');
let reply_type_pref = await browser.storage.sync.get({reply_type: 'reply_all'});
actionButton_line2.textContent = reply_type_pref.reply_type == 'reply_all' ? browser.i18n.getMessage("prefs_OptionText_reply_all") : browser.i18n.getMessage("prefs_OptionText_reply_sender");
actionButton.appendChild(actionButton_line1);
actionButton.appendChild(document.createElement('br'));
actionButton.appendChild(actionButton_line2);
const fullTextHTMLAtAssignment = this.fullTextHTML.trim().replace(/^"|"$/g, '').replace(/^<p>&quot;/, '<p>').replace(/&quot;<\/p>$/, '</p>'); // strip quotation marks const fullTextHTMLAtAssignment = this.fullTextHTML.trim().replace(/^"|"$/g, '').replace(/^<p>&quot;/, '<p>').replace(/&quot;<\/p>$/, '</p>'); // strip quotation marks
//console.log(">>>>>>>>>>>> fullTextHTMLAtAssignment: " + fullTextHTMLAtAssignment); //console.log(">>>>>>>>>>>> fullTextHTMLAtAssignment: " + fullTextHTMLAtAssignment);
actionButton.addEventListener('click', async () => { actionButton.addEventListener('click', async () => {
@ -299,8 +316,9 @@ class MessagesArea extends HTMLElement {
} }
actionButtons.appendChild(closeButton); actionButtons.appendChild(closeButton);
actionButtons.appendChild(selectionInfo); //actionButtons.appendChild(selectionInfo);
this.messages.appendChild(actionButtons); this.messages.appendChild(actionButtons);
this.messages.appendChild(selectionInfo);
this.scrollToBottom(); this.scrollToBottom();
} }