diff --git a/.eslintrc.js b/.eslintrc.js
index 68705ff..f2a7957 100644
--- a/.eslintrc.js
+++ b/.eslintrc.js
@@ -1,4 +1,7 @@
module.exports = {
+ "parserOptions": {
+ "ecmaVersion": 8
+ },
"env": {
"browser": true,
"es6": true,
diff --git a/webextension/background.js b/webextension/background.js
index 93bdd78..72bd8b8 100644
--- a/webextension/background.js
+++ b/webextension/background.js
@@ -1,3 +1,5 @@
+const MAJOR_VERSIONS = ["2.3.0"];
+
const assignManager = {
CLOSEABLE_WINDOWS: new Set([
"about:startpage",
@@ -551,3 +553,22 @@ function disableAddon(tabId) {
browser.browserAction.disable(tabId);
browser.browserAction.setTitle({ tabId, title: "Containers disabled in Private Browsing Mode" });
}
+
+async function getExtensionInfo() {
+ const manifestPath = browser.extension.getURL("manifest.json");
+ const response = await fetch(manifestPath);
+ const extensionInfo = await response.json();
+ return extensionInfo;
+}
+
+async function displayBrowserActionBadge() {
+ const extensionInfo = await getExtensionInfo();
+ const storage = await browser.storage.local.get({browserActionBadgesClicked: []});
+
+ if (MAJOR_VERSIONS.indexOf(extensionInfo.version) > -1 &&
+ storage.browserActionBadgesClicked.indexOf(extensionInfo.version) < 0) {
+ browser.browserAction.setBadgeBackgroundColor({color: "rgba(0,217,0,255)"});
+ browser.browserAction.setBadgeText({text: "NEW"});
+ }
+}
+displayBrowserActionBadge();
diff --git a/webextension/img/onboarding-4.png b/webextension/img/onboarding-4.png
new file mode 100644
index 0000000..96e5068
Binary files /dev/null and b/webextension/img/onboarding-4.png differ
diff --git a/webextension/js/popup.js b/webextension/js/popup.js
index 3980f82..b1289ae 100644
--- a/webextension/js/popup.js
+++ b/webextension/js/popup.js
@@ -12,6 +12,7 @@ const DEFAULT_ICON = "circle";
const P_ONBOARDING_1 = "onboarding1";
const P_ONBOARDING_2 = "onboarding2";
const P_ONBOARDING_3 = "onboarding3";
+const P_ONBOARDING_4 = "onboarding4";
const P_CONTAINERS_LIST = "containersList";
const P_CONTAINERS_EDIT = "containersEdit";
const P_CONTAINER_INFO = "containerInfo";
@@ -54,6 +55,13 @@ function escaped(strings, ...values) {
return result.join("");
}
+async function getExtensionInfo() {
+ const manifestPath = browser.extension.getURL("manifest.json");
+ const response = await fetch(manifestPath);
+ const extensionInfo = await response.json();
+ return extensionInfo;
+}
+
// This object controls all the panels, identities and many other things.
const Logic = {
_identities: [],
@@ -63,14 +71,19 @@ const Logic = {
_panels: {},
init() {
+ // Remove browserAction "upgraded" badge when opening panel
+ this.clearBrowserActionBadge();
+
// Retrieve the list of identities.
this.refreshIdentities()
// Routing to the correct panel.
.then(() => {
// If localStorage is disabled, we don't show the onboarding.
- if (!localStorage || localStorage.getItem("onboarded3")) {
+ if (!localStorage || localStorage.getItem("onboarded4")) {
this.showPanel(P_CONTAINERS_LIST);
+ } else if (localStorage.getItem("onboarded3")) {
+ this.showPanel(P_ONBOARDING_4);
} else if (localStorage.getItem("onboarded2")) {
this.showPanel(P_ONBOARDING_3);
} else if (localStorage.getItem("onboarded1")) {
@@ -85,6 +98,15 @@ const Logic = {
});
},
+ async clearBrowserActionBadge() {
+ const extensionInfo = await getExtensionInfo();
+ const storage = await browser.storage.local.get({browserActionBadgesClicked: []});
+ browser.browserAction.setBadgeBackgroundColor({color: ""});
+ browser.browserAction.setBadgeText({text: ""});
+ storage.browserActionBadgesClicked.push(extensionInfo.version);
+ browser.storage.local.set({browserActionBadgesClicked: storage.browserActionBadgesClicked});
+ },
+
refreshIdentities() {
return browser.runtime.sendMessage({
method: "queryIdentities"
@@ -234,8 +256,29 @@ Logic.registerPanel(P_ONBOARDING_3, {
// This method is called when the object is registered.
initialize() {
// Let's move to the containers list panel.
- document.querySelector("#onboarding-done-button").addEventListener("click", () => {
+ document.querySelector("#onboarding-almost-done-button").addEventListener("click", () => {
localStorage.setItem("onboarded3", true);
+ Logic.showPanel(P_ONBOARDING_4);
+ });
+ },
+
+ // This method is called when the panel is shown.
+ prepare() {
+ return Promise.resolve(null);
+ },
+});
+
+// P_ONBOARDING_4: Fourth page for Onboarding.
+// ----------------------------------------------------------------------------
+
+Logic.registerPanel(P_ONBOARDING_4, {
+ panelSelector: ".onboarding-panel-4",
+
+ // This method is called when the object is registered.
+ initialize() {
+ // Let's move to the containers list panel.
+ document.querySelector("#onboarding-done-button").addEventListener("click", () => {
+ localStorage.setItem("onboarded4", true);
Logic.showPanel(P_CONTAINERS_LIST);
});
},
diff --git a/webextension/popup.html b/webextension/popup.html
index fafc66d..26c00ce 100644
--- a/webextension/popup.html
+++ b/webextension/popup.html
@@ -27,6 +27,13 @@
Start with the containers we've created, or create your own.
+ Next + + +