From 5860d2c1ad41128e5b0fdb0f6e08f17baae48aa9 Mon Sep 17 00:00:00 2001 From: Ximi1970 Date: Sun, 3 May 2020 23:39:02 +0200 Subject: [PATCH] Add control logic --- webext/background.html | 4 +- webext/background.js | 78 ++++++++++---------- webext/css/options.css | 2 +- webext/js/options_accounts.js | 62 +++++++--------- webext/options.html | 2 + webext/options.js | 131 ++++++++++++++++++++++++++++------ 6 files changed, 179 insertions(+), 100 deletions(-) diff --git a/webext/background.html b/webext/background.html index 8295beb..088805e 100644 --- a/webext/background.html +++ b/webext/background.html @@ -9,9 +9,7 @@

Background

Background HTML

-
-
-
+
diff --git a/webext/background.js b/webext/background.js index 240c0ac..54f6354 100644 --- a/webext/background.js +++ b/webext/background.js @@ -1,6 +1,4 @@ var SysTrayX = { - debugAccounts: false, - startupState: undefined, pollTiming: { @@ -16,14 +14,11 @@ var SysTrayX = { }; SysTrayX.Messaging = { - unreadFiltersTest: [ - { unread: true }, - { unread: true, folder: { accountId: "account1", path: "/INBOX" } }, - ], + accounts: [], init: function () { - // Get the accounts from the storage - SysTrayX.Messaging.getAccounts(); + // Get the filters from the storage + SysTrayX.Messaging.getFilters(); // Lookout for storage changes browser.storage.onChanged.addListener(SysTrayX.Messaging.storageChanged); @@ -43,8 +38,7 @@ SysTrayX.Messaging = { // Send preferences to app SysTrayX.Messaging.sendPreferences(); - // this.unReadMessages(this.unreadFiltersTest).then(this.unreadCb); - // window.setInterval(SysTrayX.Messaging.pollAccounts, 1000); + // Start polling the accounts window.setTimeout( SysTrayX.Messaging.pollAccounts, SysTrayX.pollTiming.pollStartupDelay * 1000 @@ -59,7 +53,7 @@ SysTrayX.Messaging = { // storageChanged: function (changes, area) { // Get the new preferences - SysTrayX.Messaging.getAccounts(); + SysTrayX.Messaging.getFilters(); if ("pollStartupDelay" in changes && changes["pollStartupDelay"].newValue) { SysTrayX.pollTiming = { @@ -109,9 +103,34 @@ SysTrayX.Messaging = { SysTrayX.Link.postSysTrayXMessage({ unreadMail: 0 }); } } else { - SysTrayX.Messaging.unReadMessages([{ unread: true }]).then( - SysTrayX.Messaging.unreadCb - ); + // Never saved anything, construct temporary filters + if (SysTrayX.Messaging.accounts.length > 0) { + // Construct inbox filters for all accounts + let filters = []; + SysTrayX.Messaging.accounts.forEach((account) => { + const inbox = account.folders.filter( + (folder) => folder.type == "inbox" + ); + + if (inbox.length > 0) { + filters.push({ + unread: true, + folder: inbox[0], + }); + } + }); + + // Store them in the background HTML + const filtersDiv = document.getElementById("filters"); + filtersDiv.setAttribute("data-filters", JSON.stringify(filters)); + + SysTrayX.Messaging.unReadMessages(filters).then( + SysTrayX.Messaging.unreadCb + ); + } else { + // No accounts, no mail + SysTrayX.Link.postSysTrayXMessage({ unreadMail: 0 }); + } } // Next round... @@ -227,34 +246,18 @@ SysTrayX.Messaging = { }, // - // Get the accounts from the storage + // Get the filters from the storage // - getAccounts: function () { - const getter = browser.storage.sync.get(["accounts", "filters"]); - getter.then(this.getAccountsStorage, this.onGetAccountsStorageError); - - if (SysTrayX.debugAccounts) { - const accountsDiv = document.getElementById("accounts"); - - const accountsAttr = accountsDiv.getAttribute("data-accounts"); - console.debug(`Accounts attr: ${accountsAttr}`); - - const accounts = JSON.parse(accountsAttr); - console.debug(`Accounts poll: ${accounts.length}`); - } + getFilters: function () { + const getter = browser.storage.sync.get("filters"); + getter.then(this.getFiltersStorage, this.onGetFiltersStorageError); }, // - // Get the accounts from the storage and + // Get the filters from the storage and // make them available in the background HTML // - getAccountsStorage: function (result) { - const accounts = result.accounts || undefined; - - // Store them in the background HTML - const accountsDiv = document.getElementById("accounts"); - accountsDiv.setAttribute("data-accounts", JSON.stringify(accounts)); - + getFiltersStorage: function (result) { const filters = result.filters || undefined; // Store them in the background HTML @@ -448,6 +451,9 @@ async function start() { .getCurrent() .then((currentWindow) => currentWindow); + // Get all accounts + SysTrayX.Messaging.accounts = await browser.accounts.list(); + // Setup the link first SysTrayX.Link.init(); diff --git a/webext/css/options.css b/webext/css/options.css index ef654e4..83f66dd 100644 --- a/webext/css/options.css +++ b/webext/css/options.css @@ -88,7 +88,7 @@ ul, } /* Style the caret/arrow filler */ -.noncaret::before { +.caretfiller::before { user-select: none; /* Prevent text selection */ content: "\25B6"; visibility: hidden; diff --git a/webext/js/options_accounts.js b/webext/js/options_accounts.js index 70c6644..88488b4 100644 --- a/webext/js/options_accounts.js +++ b/webext/js/options_accounts.js @@ -30,7 +30,12 @@ SysTrayX.Accounts = { .reduce((r, name, i, a) => { if (!r[name]) { r[name] = { result: [] }; - r.result.push({ name: folder.name, children: r[name].result }); + r.result.push({ + name: folder.name, + accountId: folder.accountId, + path: folder.path, + children: r[name].result, + }); } return r[name]; @@ -43,7 +48,7 @@ SysTrayX.Accounts = { let accounts = new Object(); for (let i = 0; i < mailAccount.length; i++) { - if (true) { + if (false) { console.debug("SysTrayX accounts id: " + mailAccount[i].id); console.debug("SysTrayX accounts name: " + mailAccount[i].name); console.debug("SysTrayX accounts type: " + mailAccount[i].type); @@ -98,11 +103,8 @@ SysTrayX.Accounts = { const typeInput = document.createElement("input"); typeInput.setAttribute("type", "checkbox"); - typeInput.setAttribute("name", accounts[prop][i].id); typeInput.setAttribute("value", JSON.stringify(accounts[prop][i])); - - // typeInput.setAttribute("checked", "true"); - // typeInput.setAttribute("indeterminate", "true"); + typeInput.setAttribute("name", accounts[prop][i].id); typeLi.appendChild(typeInput); const typeText = document.createTextNode( @@ -119,23 +121,31 @@ SysTrayX.Accounts = { typeLevelUl.setAttribute("class", "nested"); level.forEach((element) => { - console.debug("Name: " + element.name); - const typeEleLi = document.createElement("li"); const typeEleSpan = document.createElement("span"); if (element.children.length > 0) { typeEleSpan.setAttribute("class", "caret"); } else { - typeEleSpan.setAttribute("class", "noncaret"); + typeEleSpan.setAttribute("class", "caretfiller"); } typeEleLi.appendChild(typeEleSpan); const typeEleInput = document.createElement("input"); typeEleInput.setAttribute("type", "checkbox"); - typeEleInput.setAttribute("name", element.name); - // typeEleInput.setAttribute("value", JSON.stringify(element.name)); - // typeEleInput.setAttribute("checked", "true"); + typeEleInput.setAttribute( + "value", + JSON.stringify({ + accountId: element.accountId, + path: element.path, + }) + ); + if (element.children.length > 0) { + typeEleInput.setAttribute("name", "parent-" + element.name); + } else { + typeEleInput.setAttribute("name", "child-" + element.name); + } + typeEleLi.appendChild(typeEleInput); const typeEleText = document.createTextNode(" " + element.name); typeEleLi.appendChild(typeEleText); @@ -160,35 +170,11 @@ SysTrayX.Accounts = { treeBase.appendChild(typeLi); - // Restore saved selection - - function setAccounts(result) { - const treeBase = document.getElementById("accountsTree"); - const accounts = result.accounts || []; - for (let i = 0; i < accounts.length; ++i) { - const checkbox = treeBase.querySelector( - `input[name=${accounts[i].id}]` - ); - if (checkbox) { - checkbox.checked = accounts[i].checked; - } - } - } - - function onError(error) { - console.log(`GetAccounts Error: ${error}`); - } - /* - const getAccounts = browser.storage.sync.get("accounts"); - getAccounts.then(setAccounts, onError); - */ - - let checkboxes = document.querySelectorAll('input[type="checkbox"]'); + // Setup checkbox control + let checkboxes = treeBase.querySelectorAll('input[type="checkbox"]'); for (let x = 0; x < checkboxes.length; x++) { checkboxes[x].addEventListener("change", function (e) { - console.debug("Change detect"); - let parentNode = this.parentNode; const cbDescendants = parentNode.querySelectorAll( diff --git a/webext/options.html b/webext/options.html index ca7c78c..294fe27 100644 --- a/webext/options.html +++ b/webext/options.html @@ -176,6 +176,8 @@ +
+ diff --git a/webext/options.js b/webext/options.js index 0fa547f..c8cd102 100644 --- a/webext/options.js +++ b/webext/options.js @@ -12,33 +12,38 @@ SysTrayX.SaveOptions = { // Save accounts and filters // const treeBase = document.getElementById("accountsTree"); - const inputs = treeBase.querySelectorAll("input"); - let accounts = []; - let filters = []; - for (let i = 0; i < inputs.length; ++i) { - const account = JSON.parse(inputs[i].value); - const checked = inputs[i].checked; - accounts.push({ ...account, checked: checked }); + const accounts = treeBase.querySelectorAll( + 'input[type="checkbox"][name*="account"]' + ); - if (checked) { - let inboxMailFolder = account.folders.find( - (obj) => obj.type === "inbox" - ); + let checkedFolders = []; + accounts.forEach((account) => { + if (account.checked || account.indeterminate) { + // Find all selected folders + const folders = Array.from( + account.parentNode.querySelectorAll( + 'input[type="checkbox"]:not([name^="account"]):not([name^="parent-"])' + ) + ).filter((folder) => folder.checked); - if (inboxMailFolder) { - filters.push({ - unread: true, - folder: inboxMailFolder, - }); - } + checkedFolders = checkedFolders.concat(folders); } - } - - // Store accounts - browser.storage.sync.set({ - accounts: accounts, }); + let filters = []; + checkedFolders.forEach((folder) => { + const mailFolder = JSON.parse(folder.value); + + filters.push({ + unread: true, + folder: mailFolder, + }); + }); + + // Store them in the options HTML + const filtersDiv = document.getElementById("filters"); + filtersDiv.setAttribute("data-filters", JSON.stringify(filters)); + // Store query filters browser.storage.sync.set({ filters: filters, @@ -186,6 +191,15 @@ SysTrayX.RestoreOptions = { SysTrayX.RestoreOptions.onIconError ); + // + // Restore filters + // + const getFilters = browser.storage.sync.get("filters"); + getFilters.then( + SysTrayX.RestoreOptions.setFilters, + SysTrayX.RestoreOptions.onFiltersError + ); + // // Restore poll startup delay state // @@ -373,6 +387,79 @@ SysTrayX.RestoreOptions = { console.log(`numberColor Error: ${error}`); }, + // + // Restore filters callbacks + // + setFilters: function (result) { + let filters = result.filters || undefined; + + // No filters stored? + if (filters == undefined) { + // Create default filters + + const treeBase = document.getElementById("accountsTree"); + const accountsBoxes = treeBase.querySelectorAll( + 'input[type="checkbox"][name*="account"]' + ); + + let accounts = []; + accountsBoxes.forEach((acoountbox) => { + const value = JSON.parse(acoountbox.value); + accounts.push({ folders: value.folders }); + }); + + filters = []; + accounts.forEach((account) => { + const inbox = account.folders.filter( + (folder) => folder.type == "inbox" + ); + + if (inbox.length > 0) { + filters.push({ + unread: true, + folder: inbox[0], + }); + } + }); + } + + if (filters) { + const treeBase = document.getElementById("accountsTree"); + + filters.forEach((filter) => { + const folder = filter.folder; + + const account = treeBase.querySelector( + `input[name=${folder.accountId}]` + ); + const checkboxes = Array.from( + account.parentNode.querySelectorAll( + 'input[type="checkbox"]:not([name^="account"]):not([name^="parent-"])' + ) + ); + + checkboxes.forEach((checkbox) => { + const value = JSON.parse(checkbox.value); + if (value.path === folder.path) { + checkbox.checked = true; + + const event = document.createEvent("HTMLEvents"); + event.initEvent("change", false, true); + checkbox.dispatchEvent(event); + } + }); + }); + } + + // Store them in the options HTML + const filtersDiv = document.getElementById("filters"); + filtersDiv.setAttribute("data-filters", JSON.stringify(filters)); + }, + + onFiltersError: function (error) { + console.log(`Filters Error: ${error}`); + }, + // // Restore poll startup delay state callbacks //