adding and removing tags from the exclusion list. see #183

This commit is contained in:
Mic 2024-12-15 23:08:00 +01:00
parent a3d92e5663
commit 0cd33185ef
3 changed files with 76 additions and 8 deletions

View file

@ -830,5 +830,9 @@
"addtags_dialog_title": {
"message": "Add tags to the email",
"description": ""
},
"addtags_exclude_tag": {
"message": "Exclude tag",
"description": ""
}
}

17
images/exclude-tag.svg Normal file
View file

@ -0,0 +1,17 @@
<svg width="128" height="128" style="enable-background:new 0 0 128 128;" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<g>
<linearGradient id="SVGID_1_" gradientUnits="userSpaceOnUse" x1="64" x2="64" y1="18.6667" y2="124.8554">
<stop offset="0" style="stop-color:#FF5252"/>
<stop offset="0.324" style="stop-color:#F33B3B"/>
<stop offset="1" style="stop-color:#D50000"/>
</linearGradient>
<circle cx="64" cy="64" r="60" style="fill:url(#SVGID_1_);"/>
<g style="opacity:0.2;">
<path d="M64,7c31.43,0,57,25.57,57,57s-25.57,57-57,57S7,95.43,7,64S32.57,7,64,7 M64,4 C30.86,4,4,30.86,4,64s26.86,60,60,60s60-26.86,60-60S97.14,4,64,4L64,4z" style="fill:#424242;"/>
</g>
<g style="opacity:0.2;">
<path d="M104,56c2.21,0,4,1.79,4,4v8c0,2.21-1.79,4-4,4H24c-2.21,0-4-1.79-4-4v-8c0-2.21,1.79-4,4-4H104 M104,53H24c-3.86,0-7,3.14-7,7v8c0,3.86,3.14,7,7,7h80c3.86,0,7-3.14,7-7v-8C111,56.14,107.86,53,104,53L104,53z" style="fill:#424242;"/>
</g>
<path d="M104,72H24c-2.21,0-4-1.79-4-4v-8c0-2.21,1.79-4,4-4h80c2.21,0,4,1.79,4,4v8 C108,70.21,106.21,72,104,72z" style="fill:#FAFAFA;"/>
</g>
</svg>

After

Width:  |  Height:  |  Size: 1.1 KiB

View file

@ -166,6 +166,19 @@ switch (message.command) {
case "getTags":
console.log(">>>>>>>>>>>>>> getTags: " + JSON.stringify(message.tags));
// These methods are also defined in the file /js/mzta-addatags-exclusion-list.js
async function addTags_getExclusionList() {
let prefs_excluded_tags = await browser.storage.local.get({add_tags_exclusions: []});
console.log(">>>>>>>>>>>>>>> addTags_getExclusionList prefs_excluded_tags: " + JSON.stringify(prefs_excluded_tags));
return prefs_excluded_tags.add_tags_exclusions;
}
function addTags_setExclusionList(add_tags_exclusions) {
browser.storage.local.set({add_tags_exclusions: add_tags_exclusions});
}
// ================================================================================
// Create and append the styles
const style = document.createElement('style');
style.textContent = `
@ -240,6 +253,16 @@ switch (message.command) {
text-align: center;
}
img.exclude-tag-icon{
width: 16px;
height: 16px;
margin-right: 2px;
margin-left: 2px;
position: relative;
top: 3px;
cursor: pointer;
}
@media (prefers-color-scheme: dark) {
:root {
--dialog-bg-color: #2e2e2e;
@ -269,14 +292,12 @@ switch (message.command) {
console.log(">>>>>>>>>>>>> words: " + JSON.stringify(words));
let prefs_tags = await browser.storage.sync.get({add_tags_hide_exclusions: false});
let prefs_excluded_tags = await browser.storage.local.get({add_tags_exclusions: []});
let add_tags_exclusions_list = await addTags_getExclusionList();
console.log(" >>>>>>>>>>>>> prefs_excluded_tags: " + JSON.stringify(prefs_excluded_tags));
// prefs_excluded_tags.add_tags_exclusions = ['recipient','test'];
console.log(">>>>>>>>>>>>> add_tags_exclusions_list: " + JSON.stringify(add_tags_exclusions_list));
const words_final = words.map(word => {
const isExcluded = prefs_excluded_tags.add_tags_exclusions.some(exclusion =>
const isExcluded = add_tags_exclusions_list.some(exclusion =>
word.includes(exclusion)
);
@ -298,7 +319,31 @@ switch (message.command) {
checkbox.type = 'checkbox';
checkbox.checked = true; // Checked by default
checkbox.value = word.tag;
// Add an image to the checkbox label
const img = document.createElement('img');
img.src = browser.runtime.getURL("/images/exclude-tag.svg");
img.alt = browser.i18n.getMessage("addtags_exclude_tag");
img.title = browser.i18n.getMessage("addtags_exclude_tag");
img.className = 'exclude-tag-icon';
img.addEventListener('click', () => {
if (!label.classList.contains('tag_excluded')) {
label.classList.add('tag_excluded');
if (!add_tags_exclusions_list.includes(word.tag)) {
add_tags_exclusions_list.push(word.tag);
addTags_setExclusionList(add_tags_exclusions_list);
}
} else {
label.classList.remove('tag_excluded');
const idx = add_tags_exclusions_list.indexOf(word.tag);
if (idx > -1) {
add_tags_exclusions_list.splice(idx, 1);
addTags_setExclusionList(add_tags_exclusions_list);
}
}
});
label.appendChild(checkbox);
label.appendChild(img);
label.appendChild(document.createTextNode(` ${word.tag}`));
if(!word.excluded || (word.excluded && !prefs_tags.add_tags_hide_exclusions)){
form.appendChild(label);
@ -316,6 +361,7 @@ switch (message.command) {
// Add the close button
const closeButton = document.createElement('button');
closeButton.type = 'button';
closeButton.id = 'mzta_dialog_close';
closeButton.textContent = 'Close';
closeButton.className = 'mzta_dialog_btn mzta_dialog_btn_margin';
closeButton.addEventListener('click', closeDialog);
@ -324,6 +370,7 @@ switch (message.command) {
// Add the submit button
const submitButton = document.createElement('button');
submitButton.type = 'button';
submitButton.id = 'mzta_dialog_submit';
submitButton.textContent = 'Submit';
submitButton.className = 'mzta_dialog_btn';
submitButton.addEventListener('click', () => {