FediAct active indicator is now a clickable icon (fixed overlaying buttons), fix deny/allowlist wrong order, change settings descriptions

src/content_styles.css

@@ -2,6 +2,8 @@
     Normal stylings
 */
 
+/* Styles for the mute/block modal popup */
+
 .fediactmodal {
     position: fixed;
     z-index: 99999;
@@ -48,18 +50,24 @@
 	color: white;
 }
 
+/* Styles for "resolving..." indicator */
+
 .fediactprocessing {
     color: white;
 	padding-right: 10px;
 	padding-left: 10px
 }
 
+/* Styles for unresolved indicator */
+
 .fediactunresolved {
     color: orange;
     padding-right: 10px;
     padding-left: 10px
 }
 
+/* Styles for after a poll was voted */
+
 .fediactvoted {
     font-style: italic;
 }
@@ -69,23 +77,45 @@
     color: orange
 }
 
-.fediactrunning {
+/* Inserted in the bottom right of any external instance where FediAct is running */
+
+.fediacticon {
+    height: 32px;
+    width: 32px;
     position: fixed;
     z-index: 99998;
-    right: 0;
-    bottom: 0;
-    background-color: rgba(0,0,0,0.7);
-    color: white !important;
+    bottom: 15px;
+    right: 10px;
+    background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAAwCAYAAABXAvmHAAAAAXNSR0IArs4c6QAAAARzQklUCAgICHwIZIgAAA1ISURBVGhD1VoJdFTlFf7em0z2hYQlkEBYDCYsglCO4IIrKi5YVKpAFSUQNwixPbVae6QKIlg2RSKtK3hAj4KgoHVBqSIuBaQeoUKIYliyEQIh6ySZea/f/d97yWQykwCHnmP/k5fAm3+5393/e0fLGDjCREfD5BR5XC4gKgFadCLQqQcQ1w1aXBfrXVQ8EBEDhEVBc0cAehjn85FheAGfF6a3AWiqBxpqAU81zLpKmDUVQHU5zBNFAP+P+pNqLjTNejoYWkgAhg8IjwaS0qAl94fWtR+0Tt0BIZ6EakKgTkDOIQIQ9hOKJYoe+eVHnKzjWaaAbKxTIMzKYpjHCmGWFQDHDvI9ActZQUZwAN5GaL2GQvvVLdC69APIUU0IlcPkfFMIkL9BKG0mMthxIslgVMjegsv+nGeZsrevEWb5zzC/2wjz5+2ULiUbMAIAcCOKXRtyA1wjJ1pTfU2tOdaRTM/W50ptDdLjJjAdBkEYO9cCZK7/aA2ACPXRWdDSLyGDbVadgh6eLZqD7mNL2SQIs2AbjK9WWTZkjxYA5LQ2ejr0wddQkraqKD35hQzSZIpq5W+FsSWv2UFYAGhEWuYVcI2ZZXkJou1wODrrTHTsosOFYju2vp/uWmEs7dH3+Qswd3+oDNsC0CkFrusfgRaTZG3ZjtqIcfmommEuDVFhGtwuHU2GAU+TiSafCf7XMvggI9haL9fWn8JatZ2jTg018G2cC1QWEcCA4aY2YgL04fQ47RAvnzWS8mi3C9edG4vL+8WiZ4KbADRFeHGVF5/+VI2PC6pR02ginO8dhyNrZU4EAV+fEafW9rLXev3X/liDqgYDEX5r2/DBViVj13qYO9YRwKALTNf4J+gu+7bDeWoZqTm/RxRmX5mMjC7hbSVlc2dfeQMe33IUe0rrmyUhnB/YLRKPX5XMv7Yr9JeSvbagogFP/rMcO4vqoLfnjumdzIqD8G2aRwCXTjBd42ZDCyNR7Yj+hsx4/HF0VyRFS3Q120pLOGPpHyrqvJi9uQzbDtYqqV/SJ4bAu6F7HF1iB2urGnyY/9lRvL+vKjRD5Sy6U+OjRdAGTHzc1EdNtnxuEABCQNcYF1ZO6IVendzQSaAzzZCNlEHamYb9gY8v95R5MHNjETxeEy/d3BPndY8kVy3bkHVWILSOdN6roMyXhyubcN+7RTh8kp4xuDEpR+PbtQHawAfXmFq/kS35h98CWVzb5CPnu+GeC5KsJEBcmTIo+TFR12iANIJqiyi3TiO20Mic5V9XoM5rKMk59uWjLnqarDU0CbVGAWgO7tba13adwJwtZYgJd7UN3iovC4N58N8EMPtTU+vci9DbSkB0Nzpcx8Y7+yA51t2KG3UkYt2ek9hyoAbVHh9iI3Rc1jcWEwYnID7CylvqOUeIiSaRMmTNG99XYlthLU5yTXykC5dSvW4f0gkx9hybNyivbcK41w6itpEuPlAzlAQZ2E6WEMCCnaYWyUySwrPk2jK85NawlCisua1Xyya2a3lp53Es/KJceQz/ldNHJCH3ImaoQcbftlcg7xtmn5YA1WmN9EKzLuyMGaPsNQ4JJHLKuiPYfqQObsui/Ya12mRE1gYt2mMiTIyr7WiknMcNiMOi63qoA0XU4o2Ee3evO4yfKpiX+O0tc2IosQ/v6oPEKDuVtret9Hgx9tVC1FAKrcjhoh7xYXhrUm8kUCJCq9iIzPnzx6WUchXCRdeCDQnAg5bu5ezgkbeBAG4fkoC5Y5KbAYgO/3yiEdkbjuBYLdPggI0lVrwwvicu7cuU2/5M5nx1qA5T3z5MibU+S+YI6NWUct/EcGVDDoB5n5VjFW1B4kfQIUA7AjBpaAKeoP92JCAAfiTnBcCJ+tYA5JgaGvXi63tg/MD4VgD+kV+NmZuKEUdi/UHLmkgSuPq2NKR3bg3gqc/LsfLbdgDw4qMNeiY/kInNYEUCoQBM33AYlfWWkTpDbE0MeuF1Kbh1cGsAm/ZWY9Z7Rcpw/a8RAkA4vOYMAJhNnv9XALYR81pKFdpHRQquY79YCSg3Si/E+7Q2aMl/THUBDzJ+0QCYSpsVh8SN7qYbtZOzABBnCuCvY1NwS4ANvEcbyH3/LNmASEAAlOwjgIXfm3JJOFsSqKIRL7sxVcUPfzf64f4a3PfOESREnQUjdlKJA/+SSPwtI3Ec6W8biU9XAsIEiQMX945BelK4pH2KL5LdSOzYyhQiPEgcOG0vpCQQBuOHzQQwZ5upJXQLmgudCQAhWC4p/Gk1JMLK5SdwnJkbtbyQb/ubBPDYJ6bWJe2sAggeNoO/PWMADKi+LcsJ4JFNptYjU1XHAt2pSGCiRGLewlpF4uMSidsGstMhvDn42YFMRWKqnX8qMX9riEgs6TqDmG/Tk+3fBwSApMePXt6VF3kJF1Ixg9LnHKYFktSFDOOniMaRwIu89EguZBUApTigYfG2Y1jzXWXbXEgAVB0lgDm8kWXnmfp5Y60KXEBAk6QqkaE/hdmi6LQcJgRLCiy3pkA9P0Wag9pB70S3KgQ4Z4i5lFR7cZz5VptsWtxC4bcwPlnGctDEv5iuUb8NfaUUooOwWQ46W0U72T+YJNUZtn9sztvl6svh+2gxcHAXL/Vjs82wa39/asWsM2Vxu+sk93eKBC0TFShTR2qnQ7jynM30mh7ex3mX0JnNshyPgi9QeZw39IwLx5mum+eyph8VeCH7n5DbelMpkrnQ4OXZATLQNR/TbA+uzdyIx66Yw2spK4acI6Vmr8QsAjS8VLmMoaNN162sr8QnnwbBjsBDXDROaSepaGjo27kA4wev46WGDQ97nVx5dpcMxdu7JyMpqgJXZ36A2IZ8eo+vMWZMGc7pV6/CrooGGZnDTdcNf4LWc8jpS0AZhx8YhedUQFlrMrvtwbyxD7FKV8jg57Z2omHpmgvfFI1EzlsroB/bj6aC7TCZNtw9aR+y7y2GHknyDZY1+VeVFvWRk6Cff5ODqUP+mV6PIlSTDo7U71VBh3HElEcpr+UUQg1173Xhrgv+jpxRy7D1yMVYuTMXpmTFTWxqUMfL8o+h9LtC6OX57EZ5MDW7FA/MKEZUtIH589Iw/qYKpA/mpV6Ku1racOjX5JIkCo9G0tEwDuyA8eVKIDEVWhJLMgndoSUkQ4tlZcFNUG5mty55SJBy7H47EphGl200NSHrohWYdcnLWPjBZLy0fgzCawqtjkz5AeieE6wWsvrMTHnylFI89IfDqKp14dmlqXh9VTLWrv8B6QNtANKk0298FHoiiQmS1LUCRO4aJXthvL+AU2lSKoKzDiTAJS0XZyCtID6aVDtUH00e7uLjXIk3BsuCjY2YnrUfudkHsCQvBS8+1wPuMPbJVIWL3sVm5NTsEkydViL+B88s6omN67sonqx8bR8yHAmo/sCI38AlJUaG6HYdvERB3oR8G59g2e5Eiw04NUYViawbU/NwAonzjr0ww6ch+4Fi5PJZspwA8lLhdlui0vh5fb2Ou0n8jJxiREQZWEC12fAmK3zcVviQ82Ax0jPq7P6A6Cul4LptIVRqHUiAvwjsz3xbX4a5h02GEJehDtWQR7YASCWAFAKwUnoBcPsdZXj44SOoptosXZSKNSu7IyaWqYs0Uji8BCHK0rrFNOAq6JdlW3l8qDDrlPXqK+Hb/CxQ/EPIFmh7IAwSkn2/SKCIErAAhIezykEhTMkqpbcpUeFtCdXm3bW0LTF8ep6MAbXo19eDrVs7oa5WApnT6FZxm5Wxqx+E3nt4+x7JuVSzKW18tRrmj1+SJWxi2x1Fq0kd6AzsfEGpk8Eg5EP2jBLkzjzaDMBNAHFxPqx+Yy9SejXgqblpeGdtV9sH0MXoJpasKMCwjHrk/K4fvt8V6wfAYVdiT7jom5VHcdxHSGlwCo3N4N3U/OlrNqb3W912sSMxVum4N+9BQxaA4ezks1FuxqdiWtY+5N7ymW0DlgRk3HFXGcqOuvHOuq6IiWlRm7AwE3mv5OP8/vW4f1Y6du0IBkDsoUsfuEZPUx16VbW2LKutRihJCAi6SzFu6eGyf6UAyL8VAPuqKt5I7EUAMH4YeiSmjVqOnJHLsYQeyLEB0XEnlMg3G/yHAHj+1XwMO7cO987sHwKAWkHCWLHWL7oTWv/RKtlS7jKUbTSnq3YybCX19tkOcOsaaAVqeiFDR9bI5zBrVB4WL0vByyu6IyLCbpiEMB5RobxX9mM4vU8HAOwdSISWfjG0Yb+GxqAlUlA9ZCUR+1dgrh2YTrT53AInnM4a9Rxmjnweq9Z0xdKne6pQEuqCJNvG0gste3E/BqR5cF+OqBArHx1+W0XUIJKV5uQM1sEzofNLH5DEL5rfUFF9NYm2oin+eVEAGWLQjgrKfk11TBcqcFny65gzZTV8LgNFB9j/ZWxoL5OSeJDW24OjpeHInn4uSop5g+sQgCNOJzaILktDJLazSiPUw6/dQHrMkbGMxJFMzSOb8yP1FZt6NuzqjrOjUso0gelCRaH6io0btZh8Rymy7ilBJIkLxX2HBOHBoQOReHp+GnZ8w+Ix48V/AVFU3fKxDtrWAAAAAElFTkSuQmCC');
+    background-size: 32px 32px;
+    cursor: pointer;
+}
+
+.fediactsettings_onsite {
+    position: fixed;
+    z-index: 99998;
+    left: 0;
+    top: 0;
+    width: 100%;
+    height: 100%;
+    overflow: auto;
+    background-color: rgba(0,0,0,0.4);
     margin: 0;
+    padding: 0;
+    display: none;
+}
+
+.fediactsettings_onsite  .fediactsettings_onsite_inner {
+    position: absolute;
+    bottom: 15px;
+    right: 15px;
     padding: 10px 15px;
+    background: white;
+    border-radius: 5px;
 }
 
-.fediactrunning span {
-    color: green !important;
-}
-
-.fediactrunning a {
-    color: white !important;
+.fediactsettings_onsite  .fediactsettings_onsite_inner a {
+    color: blue !important;
 }
 
 

src/inject.js

@@ -7,7 +7,7 @@ const profileNamePaths = ["div.account__header__tabs__name small", "div.public-a
 const domainRegex = /^([a-z0-9]+(-[a-z0-9]+)*\.)+[a-z]{2,}$/
 const handleExtractUrlRegex = /^(?<domain>https?:\/\/(?:\.?[a-z0-9-]+)+(?:\.[a-z]+){1})?\/?@(?<handle>\w+)(?:@(?<handledomain>(?:[\w-]+\.)+?\w+))?(?:\/(?<tootid>\d+))?\/?$/
 const handleExtractUriRegex = /^(?<domain>https?:\/\/(?:\.?[a-z0-9-]+)+(?:\.[a-z]+){1})(?:\/users\/)(?<handle>\w+)(?:(?:\/statuses\/)(?<tootid>\d+))?\/?$/
-const enableConsoleLog = false
+const enableConsoleLog = true
 const logPrepend = "[FediAct]"
 const instanceApi = "/api/v1/instance"
 const statusApi = "/api/v1/statuses"
@@ -549,7 +549,7 @@ function showModal(settings) {
 		$(appendTo).append($(append))
 	}
 	$("body").append($(baseEl))
-	$("body").on("click", function(e) {
+	function handleModalEvent(e) {
 		if (e.originalEvent.isTrusted) {
 			if ($(e.target).is(".fediactmodal li, .fediactmodal li a")) {
 				if ($(e.target).is(".fediactmodal li")) {
@@ -566,15 +566,29 @@ function showModal(settings) {
 				}
 			} else {
 				$(baseEl).remove()
-				$("body").off()
+				$("body").off("click", handleModalEvent)
 			}
 		}
-	})
+	}
+	$("body").on("click", handleModalEvent)
 }
 
 function addFediElements() {
-	if (!$(".fediactrunning").length) {
-		$("body").append("<div class='fediactrunning'><span>FediAct running</span> - <a target='" + settings.fediact_target + "' href='https://" + settings.fediact_homeinstance + "'>Go home</a></div>")
+	if (!$(".fediacticon").length) {
+		$("body").append("<div class='fediacticon'></div>")
+		$("body").append("<div class='fediactsettings_onsite'><div class='fediactsettings_onsite_inner'><a href='https://" + settings.fediact_homeinstance + "' target='" + settings.fediact_target + "'>Go home</a></div></div>")
+		function fediSettingsHandler(e) {
+			if (e.originalEvent.isTrusted) {
+				if ($(e.target).is("div.fediacticon")) {
+					$("div.fediacticon").hide()
+					$("div.fediactsettings_onsite").show()
+				} else {
+					$("div.fediactsettings_onsite").hide()
+					$("div.fediacticon").show()
+				}
+			}
+		}
+		$("body").on("click", fediSettingsHandler)
 	}
 }
 
@@ -1437,7 +1451,9 @@ async function backgroundProcessor() {
 			tmpSettings.processed = []
 			tmpSettings.processedFollow = []
 			tmpSettings.isProcessing = []
-			$(".fediactrunning").remove()
+			$(".fediacticon").remove()
+			$(".fediactsettings_onsite").remove()
+			$("body").off("click", fediSettingsHandler)
 			// rerun getSettings to keep mutes/blocks up to date while not reloading the page
 			if (!await getSettings()) {
 				// but reload if settings are invalid

src/popup.html

@@ -28,7 +28,7 @@
 						<div class="row">
 							<label for="redirects">Enable
 								<span>
-									Redirect to home server on double-click
+									Redirect to home server on double-click / reply
 								</span>
 							</label>
 							<input type="checkbox" id="redirects" name="redirects">
@@ -62,7 +62,7 @@
 						<div class="row">
 							<label for="hidemuted">Hide muted/blocked
 								<span>
-									Note: May fail / decrease performance
+									Can fail / decrease performance in some cases
 								</span>
 							</label>
 							<input type="checkbox" id="hidemuted" name="hidemuted">
@@ -92,8 +92,8 @@
 						<div class="row">
 							<label for="mode">Mode</label>
 							<select name="mode" id="mode" selected="blacklist">
-								<option id="blacklist" value="blacklist">Allowlist</option>
-								<option id="whitelist" value="whitelist">Denylist</option>
+								<option id="blacklist" value="blacklist">Denylist</option>
+								<option id="whitelist" value="whitelist">Allowlist</option>
 							</select>
 						</div>
 						<div class="row">