From ad6ae0be930113a0c35af819458c31e2b9484488 Mon Sep 17 00:00:00 2001 From: buzz-lightsnack-2007 <73412182+buzz-lightsnack-2007@users.noreply.github.com> Date: Mon, 6 May 2024 14:29:41 +0800 Subject: [PATCH 01/11] accomodate for light mode changes --- styles/colors/defaults.results.css | 18 +++++++++++++----- 1 file changed, 13 insertions(+), 5 deletions(-) diff --git a/styles/colors/defaults.results.css b/styles/colors/defaults.results.css index 75352a7..259c6ce 100644 --- a/styles/colors/defaults.results.css +++ b/styles/colors/defaults.results.css @@ -1,13 +1,21 @@ :root { --color-results_bad_dark: #AF3119; --color-results_bad_light: #EC6342; - --color-results_bad_gradient: linear-gradient(43deg, var(--color-results_bad_dark) 0%, var(--color-results_bad_light) 100%); + --color-results_bad_gradient: linear-gradient(43deg, var(--color-results_bad_dark) 100%, var(--color-results_bad_light) 0%); - --color-results_ok_dark: #E8A87C; - --color-results_ok_light: #F6C7A1; - --color-results_ok_gradient: linear-gradient(43deg, var(--color-results_ok_dark) 0%, var(--color-results_ok_light) 100%); + --color-results_ok_dark: rgba(221, 106, 59); + --color-results_ok_light: rgba(255, 134, 57); + --color-results_ok_gradient: linear-gradient(43deg, var(--color-results_ok_dark) 100%, var(--color-results_ok_light) 0%); --color-results_good_dark: #487858; --color-results_good_light: #5BBF4B; - --color-results_good_gradient: linear-gradient(43deg, var(--color-results_good_dark) 0%, var(--color-results_good_light) 100%); + --color-results_good_gradient: linear-gradient(43deg, var(--color-results_good_dark) 100%, var(--color-results_good_light) 0%); +} + +@media (prefers-color-scheme: dark) { + :root { + --color-results_bad_gradient: linear-gradient(43deg, var(--color-results_bad_dark) 0%, var(--color-results_bad_light) 100%); + --color-results_ok_gradient: linear-gradient(43deg, var(--color-results_ok_dark) 0%, var(--color-results_ok_light) 100%); + --color-results_good_gradient: linear-gradient(43deg, var(--color-results_good_dark) 0%, var(--color-results_good_light) 100%); + } } \ No newline at end of file From ee8cc4d0a275c1bfa212aeb4d4d384aa47fa87d2 Mon Sep 17 00:00:00 2001 From: buzz-lightsnack-2007 <73412182+buzz-lightsnack-2007@users.noreply.github.com> Date: Mon, 6 May 2024 14:37:35 +0800 Subject: [PATCH 02/11] set light mode colors --- styles/colors/defaults.css | 27 ++++++++++++++++++++++++++- 1 file changed, 26 insertions(+), 1 deletion(-) diff --git a/styles/colors/defaults.css b/styles/colors/defaults.css index 9f2a884..4e93e85 100644 --- a/styles/colors/defaults.css +++ b/styles/colors/defaults.css @@ -1,5 +1,5 @@ :root { - --surface-color: rgba(252, 162, 133) !important; + --surface-color: rgba(255, 134, 57, .1) !important; --font-color-main: rgba(0, 0, 0) !important; --font-color-medium: rgba(25, 25, 25) !important; @@ -12,14 +12,39 @@ --primary-color-numeric: 255, 134, 57 !important; --primary-color-raised-hover-solid: rgba(252, 162, 133) !important; --primary-color-raised-focus-solid: rgba(221, 106, 59) !important; + --primary-color-gradient: linear-gradient( + 43deg, + var(--primary-color-dark) 0%, + var(--primary-color) 62%, + var(--primary-color-raised-hover-solid) 100% + ) !important; + --background-color-disabled: rgba(125, 125, 125) !important; + --background-color-level-4dp: rgba(229, 229, 229) !important; --background-color-level-16dp-solid: rgba(255, 238, 235) !important; + --background-color-card: rgba(242, 242, 242) !important; + --background-color-slight-emphasis: rgba(252, 162, 133) !important; + --secondary-color: rgba(221, 106, 59, 1) !important; --secondary-color-hover-solid: rgba(252, 162, 133) !important; --secondary-color-focus-solid: rgba(221, 106, 59) !important; --secondary-container-color: rgba(252, 162, 133) !important; + --secondary-color-lighter: rgba(221, 106, 59) !important; + --secondary-color: rgba(190, 80, 1) !important; + --secondary-color-dark: rgba(159, 55, 0) !important; + --secondary-color-hover-solid: rgba(252, 162, 133) !important; + --secondary-color-focus-solid: rgba(159, 55, 0) !important; + --font-on-secondary-container-color: rgba(255, 255, 255) !important; + + --hover-color: rgba(255, 255, 255, 0.3) !important; + --focus-color: rgba(255, 255, 255, 0.3) !important; + --focus-color-solid: rgb(76.5, 76.5, 76.5) !important; + --active-color: rgba(255, 255, 255, 0.3) !important; + + --separator-color: rgba(178,178,178) !important; + --error-color: #cf6679 !important; } @media (prefers-color-scheme: dark) { From b7bbbeb48674d16538c89c1ea97dc028236d3d7a Mon Sep 17 00:00:00 2001 From: buzz-lightsnack-2007 <73412182+buzz-lightsnack-2007@users.noreply.github.com> Date: Tue, 7 May 2024 09:28:35 +0800 Subject: [PATCH 03/11] collect text and icon elements --- scripts/GUI/builder/windowman.js | 22 ++++++++++++++-------- 1 file changed, 14 insertions(+), 8 deletions(-) diff --git a/scripts/GUI/builder/windowman.js b/scripts/GUI/builder/windowman.js index 5027f5c..8d40138 100644 --- a/scripts/GUI/builder/windowman.js +++ b/scripts/GUI/builder/windowman.js @@ -86,9 +86,9 @@ export default class windowman { } function icons() { - let target_elements = document.querySelectorAll(`[data-icon]`); - - target_elements.forEach((element) => { + let TARGET_ELEMENTS = document.querySelectorAll(`[data-icon]`); + + (TARGET_ELEMENTS).forEach((element) => { // Get the content before removing it. let element_data = {}; @@ -122,6 +122,8 @@ export default class windowman { iconify(); clean(); }); + + return TARGET_ELEMENTS; } function text() { @@ -151,9 +153,8 @@ export default class windowman { } }); - delete text_elements[`content`]; Object.keys(text_elements).forEach((key) => { - if (text_elements[key]) { + if (text_elements[key] && !key.includes(`content`)) { text_elements[key].forEach((text_element) => { let text_inserted = texts.localized( text_element.getAttribute(key.concat(`-for`)), @@ -175,11 +176,16 @@ export default class windowman { }); } }); - } + return text_elements; + }; + + let ELEMENTS = {}; elements(); - text(); - icons(); + ELEMENTS[`text`] = text(); + ELEMENTS[`icons`] = icons(); + + return (ELEMENTS); } // Adds events to the window. From 569030df1a6755c4a8269e793010ed127fd9c04d Mon Sep 17 00:00:00 2001 From: buzz-lightsnack-2007 <73412182+buzz-lightsnack-2007@users.noreply.github.com> Date: Tue, 7 May 2024 09:39:46 +0800 Subject: [PATCH 04/11] add placeholder for details in the error page --- pages/popup/error.htm | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/pages/popup/error.htm b/pages/popup/error.htm index fc8feef..9720d90 100644 --- a/pages/popup/error.htm +++ b/pages/popup/error.htm @@ -5,8 +5,10 @@ -

:(

+

+ + \ No newline at end of file From 1370cd6624f56fb8bb3a7f067762e1772568c9c7 Mon Sep 17 00:00:00 2001 From: buzz-lightsnack-2007 <73412182+buzz-lightsnack-2007@users.noreply.github.com> Date: Tue, 7 May 2024 10:07:04 +0800 Subject: [PATCH 05/11] Attempt to fix display of error by setting to string --- scripts/external/processor.js | 7 ++++++- 1 file changed, 6 insertions(+), 1 deletion(-) diff --git a/scripts/external/processor.js b/scripts/external/processor.js index e2ca942..bc07213 100644 --- a/scripts/external/processor.js +++ b/scripts/external/processor.js @@ -32,7 +32,12 @@ export default class processor { await this.product.analyze(); } catch(err) { logging.error(err.name, err.message, err.stack, false); - this.product.status[`error`] = err; + + // Convert the error to an object. + this.product.status[`error`] = {}; + [`name`, `message`, `stack`].forEach((KEY) => { + this.product.status.error[KEY] = String(err[KEY]); + }) }; // Indicate that the process is done. From 77ad3e5cb0dd4bc9b43b92b6aa09563f7f16085c Mon Sep 17 00:00:00 2001 From: buzz-lightsnack-2007 <73412182+buzz-lightsnack-2007@users.noreply.github.com> Date: Tue, 7 May 2024 10:07:41 +0800 Subject: [PATCH 06/11] Show all error components --- pages/popup/error.htm | 9 +++++---- 1 file changed, 5 insertions(+), 4 deletions(-) diff --git a/pages/popup/error.htm b/pages/popup/error.htm index 9720d90..d2bf86d 100644 --- a/pages/popup/error.htm +++ b/pages/popup/error.htm @@ -1,14 +1,15 @@ - +

- + - - + + + \ No newline at end of file From 0f39fbdc1248b6734477fd7340b4d8cadc449d14 Mon Sep 17 00:00:00 2001 From: buzz-lightsnack-2007 <73412182+buzz-lightsnack-2007@users.noreply.github.com> Date: Tue, 7 May 2024 11:49:14 +0800 Subject: [PATCH 07/11] remove results summary height to automatically be resized --- styles/layouts/popup.css | 4 ---- 1 file changed, 4 deletions(-) diff --git a/styles/layouts/popup.css b/styles/layouts/popup.css index cd9e0fa..63e69c0 100644 --- a/styles/layouts/popup.css +++ b/styles/layouts/popup.css @@ -11,7 +11,3 @@ margin-bottom: auto; } -#results:not(:has(details[open])) summary { - height: 80vh; -} - From f98a70b714109db9519697263e47274895d56b98 Mon Sep 17 00:00:00 2001 From: buzz-lightsnack-2007 <73412182+buzz-lightsnack-2007@users.noreply.github.com> Date: Tue, 7 May 2024 11:49:48 +0800 Subject: [PATCH 08/11] create error page script --- scripts/pages/error.js | 122 +++++++++++++++++++++++++++++++++++++++++ 1 file changed, 122 insertions(+) create mode 100644 scripts/pages/error.js diff --git a/scripts/pages/error.js b/scripts/pages/error.js new file mode 100644 index 0000000..266de3c --- /dev/null +++ b/scripts/pages/error.js @@ -0,0 +1,122 @@ +/* +Display the error screen details. +*/ + +import Page from "/scripts/pages/page.js"; +import Tabs from "/scripts/GUI/tabs.js"; + +import {global, observe} from "/scripts/secretariat.js"; +import pointer from "/scripts/data/pointer.js"; + +import logging from "/scripts/logging.js"; + +class Page_Error extends Page { + constructor() { + super(); + this.content(); + this.background(); + this.events(); + }; + + async background() { + // Wait until a change in the session storage. + observe(async (changes) => { + await this.update(); + this.fill(); + }); + } + + /* + Update the data. + */ + async update() { + // Set the reference website when overriding or unset. + if (!this[`ref`]) {this[`ref`] = await pointer.read(`URL`)}; + + // Get all the data to be used here. + let STORAGE_DATA = await global.read([`sites`, this[`ref`], `status`], -1) + + // Update all other data. + this[`status`] = ((STORAGE_DATA != null && (typeof STORAGE_DATA).includes(`obj`)) ? (Object.keys(STORAGE_DATA).length) : false) + ? STORAGE_DATA + // Accomodate data erasure. + : ((this[`status`]) + ? this[`status`] + : {}); + } + + /* + Extract the contents of the page. + */ + content () { + this[`elements`] = (this[`elements`]) ? this[`elements`] : {}; + + const error_display = () => { + this[`elements`][`error display`] = {}; + let ERROR_CONTENTS = document.querySelectorAll(`[data-error]`); + + ERROR_CONTENTS.forEach((ELEMENT) => { + let PROPERTY = ELEMENT.getAttribute(`data-error`).trim(); + this[`elements`][`error display`][PROPERTY] = ELEMENT; + + // Remove properties used to construct since it is already saved. + ELEMENT.removeAttribute(`data-error`); + }); + }; + + error_display(); + this.fill(); + }; + + /* + Fill in the content of the page. + */ + fill () { + this.update(); + + console.log(this); + + (this[`elements`][`error display`] && this[`status`][`error`]) + ? (Object.keys(this[`elements`][`error display`]).forEach((KEY) => { + this[`elements`][`error display`][KEY].innerText = String(this[`status`][`error`][KEY]) + })) + : false; + } + + /* + Add event listeners to the page. + */ + events () { + this[`elements`] = (this[`elements`]) ? this[`elements`] : {}; + this[`elements`][`button`] = {}; + + document.querySelectorAll(`[data-action]`).forEach((ELEMENT) => { + let ACTION = ELEMENT.getAttribute(`data-action`); + this[`elements`][`button`][ACTION] = ELEMENT; + + // Remove the data-action attribute. + ELEMENT.removeAttribute(`data-action`); + }) + + // Add an event listener to the refresh button. + this[`elements`][`button`][`refresh`].addEventListener(`click`, () => { + this.send(); + }); + }; + + /* + Send a request to the content script to scrape the page. + */ + send() { + try { + // Send a message to the content script. + Tabs.query(null, 0).then((TAB) => { + chrome.tabs.sendMessage(TAB.id, {"refresh": true}); + }); + } catch(err) { + logging.error(err.name, err.message, err.stack); + }; + }; +} + +new Page_Error() \ No newline at end of file From c7a262bd1de0f3c2dbaf9b7f449d069b4961fb78 Mon Sep 17 00:00:00 2001 From: buzz-lightsnack-2007 <73412182+buzz-lightsnack-2007@users.noreply.github.com> Date: Tue, 7 May 2024 11:50:06 +0800 Subject: [PATCH 09/11] Test: remove set height of popup --- styles/layouts/all.css | 1 - 1 file changed, 1 deletion(-) diff --git a/styles/layouts/all.css b/styles/layouts/all.css index 18baa1d..fe25727 100644 --- a/styles/layouts/all.css +++ b/styles/layouts/all.css @@ -89,7 +89,6 @@ iframe.viewer { body[role="window"] { width: 300pt; - height: 300pt; } *:has(summary + details) summary:not(:last-child) { From 2a4e60420de5ea9149f6f86195e4b98321162cf8 Mon Sep 17 00:00:00 2001 From: buzz-lightsnack-2007 <73412182+buzz-lightsnack-2007@users.noreply.github.com> Date: Tue, 7 May 2024 11:50:39 +0800 Subject: [PATCH 10/11] attempt: rewrite events and trashed data --- scripts/pages/popup.js | 47 ++++++++++++++++++++++++++---------------- 1 file changed, 29 insertions(+), 18 deletions(-) diff --git a/scripts/pages/popup.js b/scripts/pages/popup.js index 22c26fb..23f8a61 100644 --- a/scripts/pages/popup.js +++ b/scripts/pages/popup.js @@ -13,9 +13,9 @@ import logging from "/scripts/logging.js"; class Page_Popup extends Page { constructor() { super(); - (this.events) ? this.events() : false; this.content(); this.background(); + this.events(); }; async background() { @@ -83,25 +83,21 @@ class Page_Popup extends Page { : `loading`)]; // Replace the iframe src with the new page. - this.elements[`frame`].forEach((frame) => { - frame.src = PAGE; - }) + this.elements[`frame`].src = PAGE; // The results page has its own container. - this.elements[`container`].forEach((CONTAINER) => { - CONTAINER.classList[(PAGE.includes(`results`)) ? `remove` : `add`](`container`); - }); + this.elements[`container`].classList[(PAGE.includes(`results`)) ? `remove` : `add`](`container`); }; }; async content() { this.elements = {}; - this.elements[`container`] = document.querySelectorAll(`main`); - this.elements[`frame`] = document.querySelectorAll(`main > iframe.viewer`); - + this.elements[`container`] = document.querySelector(`main`); + this.elements[`frame`] = document.querySelector(`main > iframe.viewer`); + this.elements[`nav`] = document.querySelector(`nav`); // Check if the frame is available. - if (this.elements[`frame`].length) { + if (this.elements[`frame`]) { await this.switch(); this.background(); } else { @@ -119,18 +115,33 @@ class Page_Popup extends Page { logging.error(err.name, err.message, err.stack); throw (err); }; - } + }; events() { - (document.querySelector(`[data-action="open,settings"]`)) ? document.querySelector(`[data-action="open,settings"]`).addEventListener("click", () => { + this[`elements`] = (this[`elements`]) ? this[`elements`] : {}; + this[`elements`][`button`] = {}; + + document.querySelectorAll(`[data-action]`).forEach((ELEMENT) => { + let ACTION = ELEMENT.getAttribute(`data-action`).trim(); + this[`elements`][`button`][ACTION] = ELEMENT; + + // Remove the data-action attribute. + ELEMENT.removeAttribute(`data-action`); + }); + + console.log(this[`elements`]); + + this[`elements`][`button`][`open,settings`].addEventListener("click", () => { chrome.runtime.openOptionsPage(); - }) : false; - (document.querySelector(`[data-action="open,help"]`)) ? document.querySelector(`[data-action="open,help"]`).addEventListener("click", () => { + }); + + this[`elements`][`button`][`open,help`].addEventListener("click", () => { new Window(`help.htm`); - }) : false; - (document.querySelector(`[data-action="analysis,reload"]`)) ? document.querySelector(`[data-action="analysis,reload"]`).addEventListener("click", () => { + }); + + this[`elements`][`button`][`analysis,reload`].addEventListener("click", () => { this.send(); - }) : false; + }); } } From 44f0bf94201692623a91c32adf3d571e807b431a Mon Sep 17 00:00:00 2001 From: buzz-lightsnack-2007 <73412182+buzz-lightsnack-2007@users.noreply.github.com> Date: Tue, 7 May 2024 11:50:53 +0800 Subject: [PATCH 11/11] attempt: fixed trash data being loaded anyway --- scripts/pages/results.js | 126 ++++++++++++++++++++------------------- 1 file changed, 66 insertions(+), 60 deletions(-) diff --git a/scripts/pages/results.js b/scripts/pages/results.js index c24eabd..3bdd702 100644 --- a/scripts/pages/results.js +++ b/scripts/pages/results.js @@ -35,13 +35,15 @@ class Page_Results extends Page { // Set the reference website when overriding or unset. if (override || !this[`ref`]) {this[`ref`] = await global.read([`last`])}; - // Get all the data. - let DATA = { - "data": await global.read([`sites`, this[`ref`]]) - } - - // Set the data. - this[`data`] = (DATA[`data`]) ? DATA[`data`] : (this[`data`] ? this[`data`] : {}); + if (this[`ref`]) { + // Get all the data. + let DATA = { + "data": await global.read([`sites`, this[`ref`]]) + } + + // Set the data. + this[`data`] = (DATA[`data`] && (typeof DATA[`data`]).includes(`obj`)) ? DATA[`data`] : (this[`data`] ? this[`data`] : {}); + } } async content() { @@ -78,59 +80,63 @@ class Page_Results extends Page { Populate the contents. */ async fill() { - (this.elements) - ? (Object.keys(this.elements)).forEach(async (SOURCE) => { - if (SOURCE.indexOf(`*`) < SOURCE.length - 1) { - let DATA = (nested.dictionary.get(this[`data`][`analysis`], SOURCE)); - - this.elements[SOURCE][(this.elements[SOURCE].nodeName.toLowerCase().includes(`input`) || this.elements[SOURCE].nodeName.toLowerCase().includes(`progress`)) ? `value` : `innerHTML`] = (DATA) - ? (((typeof DATA).includes(`obj`) && !Array.isArray(DATA)) - ? JSON.stringify(DATA) - : String(DATA)) - : null; - } else if (SOURCE.indexOf(`*`) >= SOURCE.length - 1) { - let DATA = (nested.dictionary.get(this[`data`][`analysis`], SOURCE.split(`,`).slice(0, -1))); - - (!Array.isArray(DATA) && (typeof DATA).includes(`obj`) && DATA != null) - - let ELEMENT_TYPES = { - "container": "section", - "content": "article", - "title": "p", - "body": "p" - }; - - (Object.keys(DATA)).forEach((ITEM) => { - let ELEMENTS = {}; - - // Create the elements. - (Object.keys(ELEMENT_TYPES)).forEach((TYPE) => { - ELEMENTS[TYPE] = document.createElement(ELEMENT_TYPES[TYPE]); - - (([`content`, `action`, `title`].includes(TYPE) || TYPE.includes(`container`)) && this.elements[SOURCE][`target element type`]) - ? ELEMENTS[TYPE].classList.add(this.elements[SOURCE][`target element type`].concat((!TYPE.includes(`container`)) - ? `-${TYPE}` - : ``)) - : false; - }); - - ELEMENTS[`title`].innerText = String(ITEM).trim(); - ELEMENTS[`title`].classList.add(`flow-text`); - ELEMENTS[`body`].innerText = String(DATA[ITEM]).trim(); - - // Inject the elements. - [`title`, `body`].forEach((CONTENT) => { - ELEMENTS[`content`].appendChild(ELEMENTS[CONTENT]); - }); - ELEMENTS[`container`].appendChild(ELEMENTS[`content`]); - this.elements[SOURCE].appendChild(ELEMENTS[`container`]); - }) - } - }) - : false; - - // Set the color. - (nested.dictionary.get(this[`data`][`analysis`], [`Rating`, `Trust`]) && document.querySelector(`summary`)) ? document.querySelector(`summary`).setAttribute(`result`, (nested.dictionary.get(this[`data`][`analysis`], [`Rating`, `Trust`]))) : false; + if (this.data) { + (this.elements) + ? (Object.keys(this.elements)).forEach(async (SOURCE) => { + if (SOURCE.indexOf(`*`) < SOURCE.length - 1) { + let DATA = (nested.dictionary.get(this[`data`][`analysis`], SOURCE)); + + this.elements[SOURCE][(this.elements[SOURCE].nodeName.toLowerCase().includes(`input`) || this.elements[SOURCE].nodeName.toLowerCase().includes(`progress`)) ? `value` : `innerHTML`] = (DATA) + ? (((typeof DATA).includes(`obj`) && !Array.isArray(DATA)) + ? JSON.stringify(DATA) + : String(DATA)) + : null; + } else if (SOURCE.indexOf(`*`) >= SOURCE.length - 1) { + let DATA = (nested.dictionary.get(this[`data`][`analysis`], SOURCE.split(`,`).slice(0, -1))); + + (!Array.isArray(DATA) && (typeof DATA).includes(`obj`) && DATA != null) + + let ELEMENT_TYPES = { + "container": "section", + "content": "article", + "title": "p", + "body": "p" + }; + + (DATA) + ? (Object.keys(DATA)).forEach((ITEM) => { + let ELEMENTS = {}; + + // Create the elements. + (Object.keys(ELEMENT_TYPES)).forEach((TYPE) => { + ELEMENTS[TYPE] = document.createElement(ELEMENT_TYPES[TYPE]); + + (([`content`, `action`, `title`].includes(TYPE) || TYPE.includes(`container`)) && this.elements[SOURCE][`target element type`]) + ? ELEMENTS[TYPE].classList.add(this.elements[SOURCE][`target element type`].concat((!TYPE.includes(`container`)) + ? `-${TYPE}` + : ``)) + : false; + }); + + ELEMENTS[`title`].innerText = String(ITEM).trim(); + ELEMENTS[`title`].classList.add(`flow-text`); + ELEMENTS[`body`].innerText = String(DATA[ITEM]).trim(); + + // Inject the elements. + [`title`, `body`].forEach((CONTENT) => { + ELEMENTS[`content`].appendChild(ELEMENTS[CONTENT]); + }); + ELEMENTS[`container`].appendChild(ELEMENTS[`content`]); + this.elements[SOURCE].appendChild(ELEMENTS[`container`]); + }) + : false + } + }) + : false; + + // Set the color. + (nested.dictionary.get(this[`data`][`analysis`], [`Rating`, `Trust`]) && document.querySelector(`summary`)) ? document.querySelector(`summary`).setAttribute(`result`, (nested.dictionary.get(this[`data`][`analysis`], [`Rating`, `Trust`]))) : false; + } }; }