mirror of
https://github.com/Ximi1970/systray-x.git
synced 2025-11-09 14:56:07 +01:00
Add control logic
This commit is contained in:
@@ -9,9 +9,7 @@
|
||||
<h3>Background</h3>
|
||||
<p>Background HTML</p>
|
||||
|
||||
<div id="accounts" data-accounts="[]">
|
||||
<div id="filters" data-filters=undefined></div>
|
||||
</div>
|
||||
<div id="filters" data-filters="undefined"></div>
|
||||
|
||||
<script src="js/defaults.js"></script>
|
||||
<div id="icon" data-icon-mime="" data-icon=""></div>
|
||||
|
||||
@@ -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();
|
||||
|
||||
|
||||
@@ -88,7 +88,7 @@ ul,
|
||||
}
|
||||
|
||||
/* Style the caret/arrow filler */
|
||||
.noncaret::before {
|
||||
.caretfiller::before {
|
||||
user-select: none; /* Prevent text selection */
|
||||
content: "\25B6";
|
||||
visibility: hidden;
|
||||
|
||||
@@ -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(
|
||||
|
||||
@@ -176,6 +176,8 @@
|
||||
</table>
|
||||
</form>
|
||||
|
||||
<div id="filters" data-filters="undefined"></div>
|
||||
|
||||
<script src="js/options_mailform.js"></script>
|
||||
</div>
|
||||
|
||||
|
||||
@@ -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
|
||||
//
|
||||
|
||||
Reference in New Issue
Block a user