diff --git a/src/css/popup.css b/src/css/popup.css index d5f3295..f18294f 100644 --- a/src/css/popup.css +++ b/src/css/popup.css @@ -974,3 +974,9 @@ span ~ .panel-header-text { .amo-rate-cta { background: #0f1126; } + +.no-sync { + margin-left: 160px; + line-height: 0px; + text-decoration: underline; +} \ No newline at end of file diff --git a/src/js/popup.js b/src/js/popup.js index d4ec8c9..9fd9e2e 100644 --- a/src/js/popup.js +++ b/src/js/popup.js @@ -17,6 +17,7 @@ const P_ONBOARDING_2 = "onboarding2"; const P_ONBOARDING_3 = "onboarding3"; const P_ONBOARDING_4 = "onboarding4"; const P_ONBOARDING_5 = "onboarding5"; +const P_ONBOARDING_6 = "onboarding6"; const P_CONTAINERS_LIST = "containersList"; const P_CONTAINERS_EDIT = "containersEdit"; const P_CONTAINER_INFO = "containerInfo"; @@ -99,9 +100,12 @@ const Logic = { } switch (onboarded) { - case 5: + case 6: this.showAchievementOrContainersListPanel(); break; + case 5: + this.showPanel(P_ONBOARDING_6); + break; case 4: this.showPanel(P_ONBOARDING_5); break; @@ -503,6 +507,39 @@ Logic.registerPanel(P_ONBOARDING_5, { // Let's move to the containers list panel. Logic.addEnterHandler(document.querySelector("#onboarding-longpress-button"), async () => { await Logic.setOnboardingStage(5); + Logic.showPanel(P_ONBOARDING_6); + }); + }, + + // This method is called when the panel is shown. + prepare() { + return Promise.resolve(null); + }, +}); + +// P_ONBOARDING_6: Sixth page for Onboarding: new tab long-press behavior +// ---------------------------------------------------------------------------- + +Logic.registerPanel(P_ONBOARDING_6, { + panelSelector: ".onboarding-panel-6", + + // This method is called when the object is registered. + initialize() { + // Let's move to the containers list panel. + Logic.addEnterHandler(document.querySelector("#start-sync-button"), async () => { + await Logic.setOnboardingStage(6); + await browser.storage.local.set({syncEnabled: true}); + await browser.runtime.sendMessage({ + method: "resetSync" + }); + Logic.showPanel(P_CONTAINERS_LIST); + }); + Logic.addEnterHandler(document.querySelector("#no-sync"), async () => { + await Logic.setOnboardingStage(6); + await browser.storage.local.set({syncEnabled: false}); + await browser.runtime.sendMessage({ + method: "resetSync" + }); Logic.showPanel(P_CONTAINERS_LIST); }); }, diff --git a/src/popup.html b/src/popup.html index cf9878f..8f438c6 100644 --- a/src/popup.html +++ b/src/popup.html @@ -64,7 +64,15 @@ Long-press the New Tab button to create a new container tab.

Container tabs when you need them.

Long-press the New Tab button to create a new container tab.

- Done + Next + + +
+ Click below to start syncing +

Container and site assignments everywhere.

+

Now containers will sync between installs of the add-on.

+ Start Syncing +
No Thanks