v0.2.3 Long-Lived Branch (#38)

* bump manifest versions to 0.2.3 * revert firefox manifest to v2 * add block interval timeout config and slider * update makefile zip commands to not be single line and more readable * fix slider thumb on chrome * stop processing queue when the user is logged out * add a logstr to the start of every log
kheina-com · May 1, 2023 · a46d1f3 · a46d1f3
1 parent 7066be9
commit a46d1f3
Show file tree

Hide file tree

Showing 10 changed files with 239 additions and 96 deletions.
diff --git a/.gitignore b/.gitignore
@@ -0,0 +1,2 @@
+# built package files
+*.zip
diff --git a/firefox-manifest.json b/firefox-manifest.json
@@ -1,27 +1,23 @@
 {
-	"manifest_version": 3,
+	"manifest_version": 2,
 	"name": "Blue Blocker",
-	"version": "0.2.2",
+	"version": "0.2.3",
 	"description": "Blocks all Twitter Blue verified users on twitter.com",
 	"icons": {
 		"128": "assets/icon-128.png"
 	},
 	"web_accessible_resources": [
-		{
-			"resources": [
-				"script.js",
-				"shared.js",
-				"inject.js"
-			],
-			"matches": [
-				"*://*.twitter.com/*",
-				"*://twitter.com/*"
-			]
-		}
+		"script.js",
+		"shared.js",
+		"inject.js"
 	],
-	"action": {
-		"default_popup": "popup.html",
-		"default_icon": "assets/icon.png"
+	"browser_action": {
+		"browser_style": true,
+		"default_icon": {
+			"128": "assets/icon-128.png"
+		},
+		"default_title": "Blue Blocker",
+		"default_popup": "popup.html"
 	},
 	"permissions": [
 		"storage"

diff --git a/makefile b/makefile
@@ -9,7 +9,19 @@ firefox:
 
 	mv manifest.json chrome-manifest.json
 	mv firefox-manifest.json manifest.json
-	zip "blue-blocker-firefox-${VERSION}.zip" manifest.json LICENSE readme.md popup.html style.css inject.js main.js options.js script.js service_worker.js shared.js assets/*
+	zip "blue-blocker-firefox-${VERSION}.zip" \
+		manifest.json \
+		LICENSE \
+		readme.md \
+		popup.html \
+		style.css \
+		inject.js \
+		main.js \
+		options.js \
+		script.js \
+		service_worker.js \
+		shared.js \
+		assets/*
 	mv manifest.json firefox-manifest.json
 	mv chrome-manifest.json manifest.json
 
@@ -18,4 +30,16 @@ chrome:
 	# ifneq (,$(wildcard blue-blocker-chrome-$(VERSION).zip))
 	# 	rm "blue-blocker-chrome-${VERSION}.zip"
 	# endif
-	zip "blue-blocker-chrome-${VERSION}.zip" manifest.json LICENSE readme.md popup.html style.css inject.js main.js options.js script.js service_worker.js shared.js assets/*
+	zip "blue-blocker-chrome-${VERSION}.zip" \
+		manifest.json \
+		LICENSE \
+		readme.md \
+		popup.html \
+		style.css \
+		inject.js \
+		main.js \
+		options.js \
+		script.js \
+		service_worker.js \
+		shared.js \
+		assets/*
diff --git a/manifest.json b/manifest.json
@@ -1,7 +1,7 @@
 {
 	"manifest_version": 3,
 	"name": "Blue Blocker",
-	"version": "0.2.2",
+	"version": "0.2.3",
 	"description": "Blocks all Twitter Blue verified users on twitter.com",
 	"icons": {
 		"128": "assets/icon-128.png"

diff --git a/options.js b/options.js
@@ -10,6 +10,8 @@ document.addEventListener("DOMContentLoaded", () => {
 		document.getElementById("skip-affiliated").checked = items.skipAffiliated;
 		document.getElementById("skip-1mplus").checked = items.skip1Mplus;
 		document.getElementById("block-nft-avatars").checked = items.blockNftAvatars;
+		document.getElementById("block-interval").value = items.blockInterval;
+		document.getElementById("block-interval-value").innerText = items.blockInterval.toString() + "s";
 	});
 });
 
@@ -19,18 +21,18 @@ api.storage.local.get({ BlockCounter: 0, BlockQueue: [] }).then(items => {
 	document.getElementById("blocked-user-queue-length").innerText = commafy(items.BlockQueue.length);
 });
 api.storage.local.onChanged.addListener(items => {
-	if (items.hasOwnProperty('BlockCounter')) {
+	if (items.hasOwnProperty("BlockCounter")) {
 		document.getElementById("blocked-users-count").innerText = commafy(items.BlockCounter.newValue);
 	}
-	if (items.hasOwnProperty('BlockQueue')) {
+	if (items.hasOwnProperty("BlockQueue")) {
 		document.getElementById("blocked-user-queue-length").innerText = commafy(items.BlockQueue.newValue.length);
 	}
 	// if we want to add other values, add them here
 });
 
-document.getElementById("mute-instead-of-block").addEventListener("input", () => {
+document.getElementById("mute-instead-of-block").addEventListener("input", e => {
 	api.storage.sync.set({
-		mute: document.getElementById("mute-instead-of-block").checked,
+		mute: e.target.checked,
 	}, () => {
 		// Update status to let user know options were saved.
 		const status = document.getElementById("mute-instead-of-block-status");
@@ -39,9 +41,9 @@ document.getElementById("mute-instead-of-block").addEventListener("input", () =>
 	});
 });
 
-document.getElementById("block-following").addEventListener("input", () => {
+document.getElementById("block-following").addEventListener("input", e => {
 	api.storage.sync.set({
-		blockFollowing: document.getElementById("block-following").checked,
+		blockFollowing: e.target.checked,
 	}, () => {
 		// Update status to let user know options were saved.
 		const status = document.getElementById("block-following-status");
@@ -50,9 +52,9 @@ document.getElementById("block-following").addEventListener("input", () => {
 	});
 });
 
-document.getElementById("block-followers").addEventListener("input", () => {
+document.getElementById("block-followers").addEventListener("input", e => {
 	api.storage.sync.set({
-		blockFollowers: document.getElementById("block-followers").checked,
+		blockFollowers: e.target.checked,
 	}, () => {
 		// Update status to let user know options were saved.
 		const status = document.getElementById("block-followers-status");
@@ -61,9 +63,9 @@ document.getElementById("block-followers").addEventListener("input", () => {
 	});
 });
 
-document.getElementById("skip-verified").addEventListener("input", () => {
+document.getElementById("skip-verified").addEventListener("input", e => {
 	api.storage.sync.set({
-		skipVerified: document.getElementById("skip-verified").checked,
+		skipVerified: e.target.checked,
 	}, () => {
 		// Update status to let user know options were saved.
 		const status = document.getElementById("skip-verified-status");
@@ -72,9 +74,9 @@ document.getElementById("skip-verified").addEventListener("input", () => {
 	});
 });
 
-document.getElementById("skip-affiliated").addEventListener("input", () => {
+document.getElementById("skip-affiliated").addEventListener("input", e => {
 	api.storage.sync.set({
-		skipAffiliated: document.getElementById("skip-affiliated").checked,
+		skipAffiliated: e.target.checked,
 	}, () => {
 		// Update status to let user know options were saved.
 		const status = document.getElementById("skip-affiliated-status");
@@ -83,9 +85,9 @@ document.getElementById("skip-affiliated").addEventListener("input", () => {
 	});
 });
 
-document.getElementById("skip-1mplus").addEventListener("input", () => {
+document.getElementById("skip-1mplus").addEventListener("input", e => {
 	api.storage.sync.set({
-		skip1Mplus: document.getElementById("skip-1mplus").checked,
+		skip1Mplus: e.target.checked,
 	}, () => {
 		// Update status to let user know options were saved.
 		const status = document.getElementById("skip-1mplus-status");
@@ -94,13 +96,29 @@ document.getElementById("skip-1mplus").addEventListener("input", () => {
 	});
 });
 
-document.getElementById("block-nft-avatars").addEventListener("input", () => {
+document.getElementById("block-nft-avatars").addEventListener("input", e => {
 	api.storage.sync.set({
-		blockNftAvatars: document.getElementById("block-nft-avatars").checked,
+		blockNftAvatars: e.target.checked,
 	}, () => {
 		// Update status to let user know options were saved.
 		const status = document.getElementById("block-nft-avatars-status");
 		status.textContent = "saved";
 		setTimeout(() => status.textContent = null, 1000);
 	});
 });
+
+const blockIntervalValueElement = document.getElementById("block-interval-value");
+document.getElementById("block-interval").addEventListener("input", e => {
+	blockIntervalValueElement.innerText = e.target.value.toString() + "s";
+});
+
+document.getElementById("block-interval").addEventListener("change", e => {
+	api.storage.sync.set({
+		blockInterval: parseInt(e.target.value),
+	}, () => {
+		// Update status to let user know options were saved.
+		const status = document.getElementById("block-interval-status");
+		status.textContent = "saved";
+		setTimeout(() => status.textContent = null, 1000);
+	});
+});
diff --git a/popup.html b/popup.html
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
-<html>
+<html lang='en'>
 	<head>
+		<meta charset='utf-8'/>
 		<title>Blue Blocker</title>
 		<link href="./style.css" rel="stylesheet">
 	</head>
@@ -67,7 +68,7 @@ <h2><img src="./assets/icon.png" alt="🅱️">lue Blocker</h2>
 			</label>
 			<span id="skip-1mplus-status"></span>
 		</div>
-		<div class="last option">
+		<div class="option">
 			<input type="checkbox" id="block-nft-avatars">
 			<label ref="label" for="block-nft-avatars" >
 				<div class="checkmark">
@@ -77,6 +78,16 @@ <h2><img src="./assets/icon.png" alt="🅱️">lue Blocker</h2>
 			</label>
 			<span id="block-nft-avatars-status"></span>
 		</div>
+		<div class="last">
+			<div class="last option">
+				<p>block interval</p>
+				<span id="block-interval-status"></span>
+			</div>
+			<div class="slider">
+				<input type="range" min="5" max="60" value="5" id="block-interval">
+				<span id="block-interval-value"></span>
+			</div>
+		</div>
 	</body>
 	<script src="options.js" type="module"></script>
 </html>
diff --git a/script.js b/script.js
@@ -1,23 +1,17 @@
-import { api, ClearCache, DefaultOptions, SetOptions, HandleInstructionsResponse, HandleHomeTimeline } from './shared.js';
+import { logstr, ClearCache, HandleInstructionsResponse, HandleHomeTimeline } from './shared.js';
 
 document.addEventListener("blue-blocker-event", function (e) {
 	ClearCache();
-
-	// retrieve option
-	api.storage.sync.get(DefaultOptions, items => {
-		SetOptions(items);
-		const body = JSON.parse(e.detail.body);
-
-		switch (e.detail.parsedUrl[1]) {
-			case "HomeLatestTimeline":
-			case "HomeTimeline":
-			case "UserTweets":
-			case "TweetDetail":
-				return HandleInstructionsResponse(e, body);
-			case "timeline/home.json":
-				return HandleHomeTimeline(e, body);
-			default:
-				console.error("found an unexpected url that we don't know how to handle:", e.detail.url);
-		}
-	});
+	const body = JSON.parse(e.detail.body);
+	switch (e.detail.parsedUrl[1]) {
+		case "HomeLatestTimeline":
+		case "HomeTimeline":
+		case "UserTweets":
+		case "TweetDetail":
+			return HandleInstructionsResponse(e, body);
+		case "timeline/home.json":
+			return HandleHomeTimeline(e, body);
+		default:
+			console.error(logstr, "found an unexpected url that we don't know how to handle:", e.detail.url);
+	}
 });
diff --git a/service_worker.js b/service_worker.js
@@ -1,7 +1,16 @@
 // we can't import things from shared, so re-initialize the api
-const api = chrome || browser;
+let _api = null;
+try {
+	_api = browser;
+	// manifest v2 has the action api stored in browserAction, so manually assign it to action
+	_api.action = browser.browserAction;
+}
+catch (ReferenceError) {
+	_api = chrome;
+}
+const api = _api;
 
-export function abbreviate(value) {
+function abbreviate(value) {
 	if (value >= 1000000000)
 	{ return `${Math.round(value / 100000000) / 10}B`; }
 	if (value >= 1000000)