Added ability to load static assets from extension's assets.

8 files changed, 90 insertions, 63 deletions

diff --git a/config/webpack/plugins/create-manifest-webpack-plugin/index.js b/config/webpack/plugins/create-manifest-webpack-plugin/index.js
index 3a16770..a1a21a8 100644
--- a/config/webpack/plugins/create-manifest-webpack-plugin/index.js
+++ b/config/webpack/plugins/create-manifest-webpack-plugin/index.js
@@ -14,7 +14,7 @@ class CreateManifestPlugin {
 					stage: compiler.webpack.Compilation.PROCESS_ASSETS_ADDITIONAL,
 					additionalAssets: true
 				},
-				() => {
+				assets => {
 					const scripts = formatScripts(require(path.resolve(SOURCE_DIR, "scripts.json")));
 					const manifest = webpackRequire("plugins/create-manifest-webpack-plugin/manifest-template.json");
 					manifest.version = require(path.resolve(ROOT_DIR, "package.json")).version;
@@ -30,6 +30,23 @@ class CreateManifestPlugin {
 						}
 					}
 
+					const resources = [];
+
+					for (const assetName in assets) {
+						if (/^assets\/.*\.(jpg|png|gif)$/.test(assetName)) {
+							resources.push(assetName);
+						}
+					}
+
+					if (resources.length > 0) {
+						manifest.web_accessible_resources = [
+							{
+								resources,
+								matches: [ "<all_urls>" ]
+							}
+						];
+					}
+
 					compilation.emitAsset(
 						"manifest.json",
 						new sources.RawSource(JSON.stringify(manifest))
diff --git a/package.json b/package.json
index 2085ef6..a40aa42 100644
--- a/package.json
+++ b/package.json
@@ -12,6 +12,7 @@
 		"build:dev": "webpack build  --config config/webpack.config.js --mode development"
 	},
 	"devDependencies": {
+		"@types/chrome": "^0.0.213",
 		"@types/jquery": "^3.5.16",
 		"copy-webpack-plugin": "^11.0.0",
 		"terser": "^5.16.3",
diff --git a/src/scripts/optimize/home-page.ts b/src/scripts/optimize/home-page.ts
index 2affea7..4c1f21f 100644
--- a/src/scripts/optimize/home-page.ts
+++ b/src/scripts/optimize/home-page.ts
@@ -1,32 +1,7 @@
-import observeDOM from "@/utils/observe-dom";
+import { replaceAttributes } from "@/utils/replace-attributes";
 
-const replace: (any[] | undefined)[] = [
-	["#slider > img", { src: "" }],
-	["#slider > img.nivo-main-image", { src: "" }]
-];
-let count = 0;
+const bannerImageUrl = chrome.runtime.getURL("assets/banner.jpg");
 
-observeDOM(() => {
-	for (let i = 0; i < replace.length; i++) {
-		if (replace[i]) {
-			const element = document.querySelector(replace[i]![0]) as HTMLElement | null;
-			if (element) {
-				const attributes = replace[i]![1];
-				if (attributes.innerHTML) {
-					element.innerHTML = attributes.innerHTML;
-				}
-				delete attributes.innerHTML;
-				for (const attribute in attributes) {
-					element.setAttribute(attribute, attributes[attribute]);
-				}
-				replace[i] = undefined;
-				count++;
-				if (count >= replace.length) {
-					return true;
-				}
-			}
-		}
-	}
-
-	return false;
-});
+replaceAttributes([
+	["#form_MainMenuPage > div > div:nth-child(13)", { innerHTML: `<img src="${bannerImageUrl}" style="width: 100vw" />` }]
+]);
diff --git a/src/scripts/optimize/index.ts b/src/scripts/optimize/index.ts
index 37ae12e..70cbac3 100644
--- a/src/scripts/optimize/index.ts
+++ b/src/scripts/optimize/index.ts
@@ -1,32 +1,7 @@
-import observeDOM from "@/utils/observe-dom";
+import { replaceAttributes } from "@/utils/replace-attributes";
 
-const replace: (any[] | undefined)[] = [
-	["head > script:nth-child(34)", { src: "" }],
-	["head > script:nth-child(43)", { src: "" }]
-];
-let count = 0;
-
-observeDOM(() => {
-	for (let i = 0; i < replace.length; i++) {
-		if (replace[i]) {
-			const element = document.querySelector(replace[i]![0]) as HTMLElement | null;
-			if (element) {
-				const attributes = replace[i]![1];
-				if (attributes.innerHTML) {
-					element.innerHTML = attributes.innerHTML;
-				}
-				delete attributes.innerHTML;
-				for (const attribute in attributes) {
-					element.setAttribute(attribute, attributes[attribute]);
-				}
-				replace[i] = undefined;
-				count++;
-				if (count >= replace.length) {
-					return true;
-				}
-			}
-		}
-	}
-
-	return false;
-});
+replaceAttributes([
+	["head > script:nth-child(34)", { src: null }],
+	["head > script:nth-child(36)", { src: null, innerHTML: "$.prototype.nivoSlider = () => {};" }],
+	["head > script:nth-child(43)", { src: null }]
+]);
diff --git a/src/utils/observe-dom.ts b/src/utils/observe-dom.ts
index e375326..30a07b4 100644
--- a/src/utils/observe-dom.ts
+++ b/src/utils/observe-dom.ts
@@ -1,4 +1,4 @@
-export default (callback: () => boolean) => {
+export const observeDOM = (callback: () => boolean) => {
 	const observer = new MutationObserver(() => {
 		if (callback()) {
 			observer.disconnect();
diff --git a/src/utils/replace-attributes.ts b/src/utils/replace-attributes.ts
new file mode 100644
index 0000000..443c1d0
--- /dev/null
+++ b/src/utils/replace-attributes.ts
@@ -0,0 +1,34 @@
+import { observeDOM } from "@/utils/observe-dom";
+
+export const replaceAttributes = (elements: any[]) => {
+	let count = 0;
+
+	observeDOM(() => {
+		for (let i = 0; i < elements.length; i++) {
+			if (elements[i]) {
+				const element = document.querySelector(elements[i]![0]) as HTMLElement | null;
+				if (element) {
+					const attributes = elements[i]![1];
+					if (attributes.innerHTML) {
+						element.innerHTML = attributes.innerHTML;
+					}
+					delete attributes.innerHTML;
+					for (const attribute in attributes) {
+						if (attributes[attribute] === null) {
+							element.removeAttribute(attribute);
+						} else {
+							element.setAttribute(attribute, attributes[attribute]);
+						}
+					}
+					elements[i] = undefined;
+					count++;
+					if (count >= elements.length) {
+						return true;
+					}
+				}
+			}
+		}
+
+		return false;
+	});
+};
diff --git a/static/assets/banner.jpg b/static/assets/banner.jpg
new file mode 100644
index 0000000..79d3b8f
--- /dev/null
+++ b/static/assets/banner.jpg
diff --git a/yarn.lock b/yarn.lock
index 6179dc9..f63da3b 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -68,6 +68,14 @@
     "@nodelib/fs.scandir" "2.1.5"
     fastq "^1.6.0"
 
+"@types/chrome@^0.0.213":
+  version "0.0.213"
+  resolved "https://registry.yarnpkg.com/@types/chrome/-/chrome-0.0.213.tgz#f1e421f76ce7986d2886bafc6c359575e599471e"
+  integrity sha512-oDF+AGr2gcHzxX5xq8TjmLtnMnV3nL1ci4Y6CjhDqIKI8Ar36JOWnmQx6eGVBBYEX824OIN0NQwDo2cevEBbQQ==
+  dependencies:
+    "@types/filesystem" "*"
+    "@types/har-format" "*"
+
 "@types/eslint-scope@^3.7.3":
   version "3.7.4"
   resolved "https://registry.yarnpkg.com/@types/eslint-scope/-/eslint-scope-3.7.4.tgz#37fc1223f0786c39627068a12e94d6e6fc61de16"
@@ -94,6 +102,23 @@
   resolved "https://registry.yarnpkg.com/@types/estree/-/estree-0.0.51.tgz#cfd70924a25a3fd32b218e5e420e6897e1ac4f40"
   integrity sha512-CuPgU6f3eT/XgKKPqKd/gLZV1Xmvf1a2R5POBOGQa6uv82xpls89HU5zKeVoyR8XzHd1RGNOlQlvUe3CFkjWNQ==
 
+"@types/filesystem@*":
+  version "0.0.32"
+  resolved "https://registry.yarnpkg.com/@types/filesystem/-/filesystem-0.0.32.tgz#307df7cc084a2293c3c1a31151b178063e0a8edf"
+  integrity sha512-Yuf4jR5YYMR2DVgwuCiP11s0xuVRyPKmz8vo6HBY3CGdeMj8af93CFZX+T82+VD1+UqHOxTq31lO7MI7lepBtQ==
+  dependencies:
+    "@types/filewriter" "*"
+
+"@types/filewriter@*":
+  version "0.0.29"
+  resolved "https://registry.yarnpkg.com/@types/filewriter/-/filewriter-0.0.29.tgz#a48795ecadf957f6c0d10e0c34af86c098fa5bee"
+  integrity sha512-BsPXH/irW0ht0Ji6iw/jJaK8Lj3FJemon2gvEqHKpCdDCeemHa+rI3WBGq5z7cDMZgoLjY40oninGxqk+8NzNQ==
+
+"@types/har-format@*":
+  version "1.2.10"
+  resolved "https://registry.yarnpkg.com/@types/har-format/-/har-format-1.2.10.tgz#7b4e1e0ada4d17684ac3b05d601a4871cfab11fc"
+  integrity sha512-o0J30wqycjF5miWDKYKKzzOU1ZTLuA42HZ4HE7/zqTOc/jTLdQ5NhYWvsRQo45Nfi1KHoRdNhteSI4BAxTF1Pg==
+
 "@types/jquery@^3.5.16":
   version "3.5.16"
   resolved "https://registry.yarnpkg.com/@types/jquery/-/jquery-3.5.16.tgz#632131baf30951915b0317d48c98e9890bdf051d"