diff --git a/mzta-background.js b/mzta-background.js index 0f8b5420..a1634c16 100644 --- a/mzta-background.js +++ b/mzta-background.js @@ -26,6 +26,17 @@ import { mzta_specialCommand } from './js/mzta-special-commands.js'; import { getSpamFilterPrompt } from './js/mzta-prompts.js'; import { taSpamReport } from './js/mzta-spamreport.js'; +browser.runtime.onInstalled.addListener(({ reason, previousVersion }) => { + console.log(">>>>>>>>>>> onInstalled: " + JSON.stringify(reason) + ", previousVersion: " + previousVersion); + if (reason === "install" + || (reason === "update" && (previousVersion.startsWith("2.") || previousVersion.startsWith("1."))) + || (reason === "update" && ((previousVersion.startsWith("3.") && parseInt(previousVersion.split(".")[1]) <= 2))) + //|| (reason === "update") // only for testing + ) { + browser.tabs.create({ url: "/pages/onboarding/onboarding.html" }); + } +}); + await migrateCustomPromptsStorage(); await migrateDefaultPromptsPropStorage(); diff --git a/pages/onboarding/images/autospamfilter.png b/pages/onboarding/images/autospamfilter.png new file mode 100644 index 00000000..b82f4553 Binary files /dev/null and b/pages/onboarding/images/autospamfilter.png differ diff --git a/pages/onboarding/images/customprompts.png b/pages/onboarding/images/customprompts.png new file mode 100644 index 00000000..f93e4479 Binary files /dev/null and b/pages/onboarding/images/customprompts.png differ diff --git a/pages/onboarding/images/prompts-button.png b/pages/onboarding/images/prompts-button.png new file mode 100644 index 00000000..9b521226 Binary files /dev/null and b/pages/onboarding/images/prompts-button.png differ diff --git a/pages/onboarding/onboarding.css b/pages/onboarding/onboarding.css new file mode 100644 index 00000000..d3404775 --- /dev/null +++ b/pages/onboarding/onboarding.css @@ -0,0 +1,183 @@ +/* This Source Code Form is subject to the terms of the Mozilla Public + * License, v. 2.0. If a copy of the MPL was not distributed with this + * file, You can obtain one at http://mozilla.org/MPL/2.0/. + * Portions Copyright (C) Philipp Kewisch + * This is a modified version of the original file of Quick Folder Move: + * https://github.com/kewisch/quickmove-extension/blob/v3.1.0/src/onboarding/onboarding.html */ + +* { + box-sizing: border-box; + margin: 0; + padding: 0; +} + +html, +body { + color-scheme: light dark; + background-color: light-dark(#f4f4f4, #151516); + color: light-dark(#666, #f4f4f5); +} + +body { + font-family: sans-serif; + line-height: 1.6; + width: 960px; + margin: 0 auto; + padding: 20px; + font-size: 18px; +} + +body.platform-mac .platform-default, +body:not(.platform-mac) .platform-mac { + display: none; +} + +h1, +h2 { + color: light-dark(#333, #fff); +} + +.content { + display: flex; + flex-direction: column; + justify-content: center; + align-items: center; + margin-top: 2em; + padding: 2em; + background: light-dark(#fff, #27272a); + box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.1); + border-radius: 10px; +} + +.section { + justify-content: space-between; + align-items: start; + width: 100%; + margin-bottom: 2em; + text-align: left; + padding: 1ex 0 0; +} +.section:not(:last-child) { + border-bottom: 1px solid #c4c4c4; + padding: 1ex 0; +} +.section.header, +.section.footer { + flex-direction: column; + z-index: 1; + position: relative; +} + +.title-icon{ + margin-right: 20px; + position: relative; + top: 12px; +} + +.section.image-right img { + float: right; + margin: 15px 0 35px 35px; +} +.section.image-left img { + float: left; + margin: 15px 35px 45px 0; +} +.section ul { + padding-inline-start: 2em; +} + +.section.image-left ul { + padding-inline-start: calc(50% + 2em); +} + +.clear { + clear: both; +} + +.section > img { + border-radius: 10px; + box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.1); + margin-top: 15px; +} + +.section p.warning { + border: 1px solid #eed936; + background: #fff7b8; + border-radius: 3px; + padding-inline-start: 90px; + padding-top: 4px; + padding-bottom: 4px; + position: relative; +} +.section p.warning::before { + content: "⚠️"; + font-size: 50px; + display: block; + position: absolute; + top: calc(50% - 0.5em); + left: 20px; + line-height: 1; +} + +.section p { + color: light-dark(#666, #ddd); +} +.section p.donatebutton { + text-align: center; + width: 100%; + margin-top: 3ex; +} +.section p.donatebutton .button { + padding: 20px; + border-radius: 30px; +} +.section p.donatebutton .button .icon-box { + background-color: light-dark(#fff, #27272a); + padding: 7px 5px 3px; + border-radius: 20px; +} + +.section form { + display: flex; + flex-direction: column; + width: 90%; + margin: 0 auto 1em; +} + +.section input[type="text"] { + padding: 10px; + margin-bottom: 1em; + border: 1px solid #ddd; + border-radius: 5px; +} +.section input[type="radio"] { + width: 16px; + height: 16px; +} + +.section input[type="submit"], +.section .button { + padding: 10px; + color: #fff; + background-color: #0a84ff; + border: none; + border-radius: 5px; + cursor: pointer; + text-decoration: none; + transition: + 0.3s background-color, + 0.3s box-shadow, + 0.3s margin; +} + +.section .button:hover { + box-shadow: inset 4px 2px 5px rgba(0, 0, 0, 0.3); +} + +.section .button img { + vertical-align: middle; +} + +.section .button:active { + box-shadow: inset 5px 2px 5px rgba(0, 0, 0, 0.3); +} diff --git a/pages/onboarding/onboarding.html b/pages/onboarding/onboarding.html new file mode 100644 index 00000000..8ab0c1d0 --- /dev/null +++ b/pages/onboarding/onboarding.html @@ -0,0 +1,86 @@ + + + + + Welcome to ThunderAI! + + + + + +
+
+

ThunderAI

+

+ Welcome to ThunderAI! +
This add-on is designed to enhance your email management with the power of AI. +
With ThunderAI, you can streamline your inbox, generate smart replies, summarize emails, and much more—all with the help of artificial intelligence. +

On this page, you'll find an overview of the key features available to help you make the most of ThunderAI. +
Get ready to experience a smarter, more efficient way to handle your emails! +

Let's see how to make best use of this add-on! +

+
+
+

Using Prompts

+ Prompts menu button +

+ On each message, there is a button that will allow you to open the prompts menu. +
Here you can choose the prompt in different ways: +

+ In the ThunderAI options page you could find some option regarding this menu. +
The first two prompts are special ones, that are available only when using an API integration. They work directly without opening the AI Chat webpage. +

+
+
+

Defining your Custom Prompts

+ Managing Custom Prompts +

+ From the options page you can open the Custom Prompts page. +
From there you can add your prompts, and also disable the default ones. +
You can find more info here. +

+

+ While defining your own prompts you can also use data placeholders, that will be substituted with the corresponding information when using the prompt. +
You can find more info here. +

+

+ For example, you can use the placeholder {%mail_subject%} to refer to the subject of the email or {%tags_current_email%} to refer to the tags of the current email. +

+
+
+

Automatic features

+ Auto spam filter +

+ There are also two automatic features available when using an API integration, which can be activated from the options page: +

+

+
For each of these features, there is an options page to specify the settings and the custom prompt to be used. +

+
+
+

+ If you have any questions or suggestions, please open an issue on the GitHub page. +

+


+ Do you enjoy ThunderAI? +

+

+ Make a donation! +

+
+
+ +