From 6bfeeca90d198470c3d874052c599a7a53fea85a Mon Sep 17 00:00:00 2001 From: mic Date: Tue, 24 Mar 2026 23:36:25 +0100 Subject: [PATCH] summary butoon with an ai sumamry icon added. see #580 --- _locales/en/messages.json | 4 ++++ images/ai_summary.png | Bin 0 -> 306 bytes js/mzta-compose-script.js | 48 ++++++++++++++++++++------------------ 3 files changed, 29 insertions(+), 23 deletions(-) create mode 100644 images/ai_summary.png diff --git a/_locales/en/messages.json b/_locales/en/messages.json index 51bb7091..7bbd2509 100644 --- a/_locales/en/messages.json +++ b/_locales/en/messages.json @@ -1968,6 +1968,10 @@ "message": "ThunderAI Overview", "description": "" }, + "get_ai_summary": { + "message": "AI Summary", + "description": "" + }, "summarize_collapse": { "message": "Collapse summary", "description": "" diff --git a/images/ai_summary.png b/images/ai_summary.png new file mode 100644 index 0000000000000000000000000000000000000000..1a13f7d41a6837c621aa507ba641c706b567ceb8 GIT binary patch literal 306 zcmeAS@N?(olHy`uVBq!ia0vp^3LwnE1|*BCs=fdz&H|6fVg?5GL=a}2dU(e+prB-l zYeY$Kep*R+Vo@qXd3m{BW?pu2a$-TMUVc&f>~}U&Kt=mKT^vIqTHj9bjiI}JY8ou zFnx29^F82sVsQbB6dSkH0*<>OjOhm$%2)5yJyc@)$VX@CuS*}or##4KyXBFt_EPu4 zp5OV=3pi5_s;wDFPMVR(N3EytFPueOFh@92IIG}XD!Bwz8L)A+SozN6aY?Fy3qHx4e^C-@-#B+x4ip00i_>zopr0K>a? AGynhq literal 0 HcmV?d00001 diff --git a/js/mzta-compose-script.js b/js/mzta-compose-script.js index 27b3a905..4b3e90e2 100644 --- a/js/mzta-compose-script.js +++ b/js/mzta-compose-script.js @@ -819,8 +819,8 @@ switch (message.command) { const generatingBanner = document.getElementById('mzta-summary-generating'); if(generatingBanner) generatingBanner.remove(); - const triggerBtn = document.getElementById('mzta-summary-trigger'); - if(triggerBtn) triggerBtn.remove(); + const existingTriggerBtn = document.getElementById('mzta-summary-trigger'); + if(existingTriggerBtn) existingTriggerBtn.remove(); const summaryBanner = document.getElementById('mzta-summary-banner'); if(summaryBanner) summaryBanner.remove(); @@ -834,13 +834,11 @@ switch (message.command) { let bgColorSummary = isDarkSummary ? '#2a2a2a' : '#f0f0f0'; let textColorSummary = isDarkSummary ? '#e0e0e0' : '#333'; let borderColorSummary = isDarkSummary ? '#444' : '#ddd'; - let titleColor = isDarkSummary ? '#ff6b6b' : '#d70022'; if (summaryData.error) { bgColorSummary = isDarkSummary ? '#3a1a1a' : '#f7e6e6'; textColorSummary = isDarkSummary ? '#ffcccc' : '#660000'; borderColorSummary = '#660000'; - titleColor = isDarkSummary ? '#ffcccc' : '#660000'; } summaryContainer.className = 'thunderai-summary-pane'; @@ -943,36 +941,40 @@ switch (message.command) { if(existingButton) return Promise.resolve(true); const isDarkBtn = window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches; - + let bgColorBtn = isDarkBtn ? '#2a2a2a' : '#f0f0f0'; let textColorBtn = isDarkBtn ? '#e0e0e0' : '#333'; let borderColorBtn = isDarkBtn ? '#444' : '#ddd'; - let titleColorBtn = isDarkBtn ? '#ff6b6b' : '#d70022'; - - const triggerContainer = document.createElement('div'); - triggerContainer.id = 'mzta-summary-trigger'; - triggerContainer.className = 'thunderai-summary-pane'; - triggerContainer.style.cssText = `background-color: ${bgColorBtn}; color: ${textColorBtn}; padding: 0.5rem; margin-bottom: 1rem; border-radius: 4px; border: 1px solid ${borderColorBtn}; cursor: pointer; font-family: system-ui, -apple-system, sans-serif; font-size: 14px;`; - const triggerText = document.createElement('div'); - triggerText.className = 'thunderai-summary-title'; - triggerText.textContent = browser.i18n.getMessage("summarize_click_to_generate"); - triggerText.style.cssText = `font-weight: bold; font-size: 14px; margin-bottom: 0; color: ${titleColorBtn};`; + const triggerBtn = document.createElement('div'); + triggerBtn.id = 'mzta-summary-trigger'; + triggerBtn.title = browser.i18n.getMessage("summarize_click_to_generate"); + triggerBtn.style.cssText = `position: fixed; top: 8px; right: 8px; z-index: 9998; background-color: ${bgColorBtn}; border: 1px solid ${borderColorBtn}; border-radius: 4px; padding: 6px 10px; cursor: pointer; font-family: system-ui, -apple-system, sans-serif; font-size: 12px; font-style: italic; opacity: 0.7; transition: opacity 0.2s; color: ${textColorBtn}; display: flex; align-items: center; gap: 6px;`; - triggerContainer.appendChild(triggerText); - triggerContainer.onclick = async () => { - triggerContainer.onclick = null; - triggerContainer.id = 'mzta-summary-generating'; - triggerContainer.style.cursor = 'default'; - triggerText.textContent = browser.i18n.getMessage("summarize_generating"); + const triggerIcon = document.createElement('img'); + triggerIcon.src = browser.runtime.getURL("/images/ai_summary.png"); + triggerIcon.style.cssText = `height: 14px; width: 14px;${isDarkBtn ? ' filter: invert(1);' : ''}`; + triggerBtn.appendChild(triggerIcon); + + const triggerLabel = document.createElement('span'); + triggerLabel.textContent = browser.i18n.getMessage("get_ai_summary"); + triggerBtn.appendChild(triggerLabel); + triggerBtn.onmouseover = () => { triggerBtn.style.opacity = '1'; }; + triggerBtn.onmouseout = () => { triggerBtn.style.opacity = '0.7'; }; + triggerBtn.onclick = async () => { + triggerBtn.onclick = null; + triggerBtn.style.cursor = 'default'; + triggerBtn.style.opacity = '0.7'; + triggerBtn.onmouseover = null; + triggerBtn.onmouseout = null; + triggerBtn.remove(); browser.runtime.sendMessage({ command: message.webchat ? "triggerSummaryWebchat" : "triggerSummaryGeneration", headerMessageId: message.headerMessageId }); }; - const spamBannerTrigger = document.getElementById('mzta-spam-report-banner') || document.getElementById('mzta-spam-check-progress'); - document.body.insertBefore(triggerContainer, spamBannerTrigger ? spamBannerTrigger.nextSibling : document.body.firstChild); + document.body.appendChild(triggerBtn); return Promise.resolve(true); default: