Init v1.0

rgryta · Nov 7, 2022 · 5bf6fa7 · 5bf6fa7
commit 5bf6fa7
Show file tree

Hide file tree

Showing 9 changed files with 207 additions and 0 deletions.
diff --git a/contentScript.js b/contentScript.js
@@ -0,0 +1,31 @@
+var clownSelector = '[d="M22.25 12c0-1.43-.88-2.67-2.19-3.34.46-1.39.2-2.9-.81-3.91s-2.52-1.27-3.91-.81c-.66-1.31-1.91-2.19-3.34-2.19s-2.67.88-3.33 2.19c-1.4-.46-2.91-.2-3.92.81s-1.26 2.52-.8 3.91c-1.31.67-2.2 1.91-2.2 3.34s.89 2.67 2.2 3.34c-.46 1.39-.21 2.9.8 3.91s2.52 1.26 3.91.81c.67 1.31 1.91 2.19 3.34 2.19s2.68-.88 3.34-2.19c1.39.45 2.9.2 3.91-.81s1.27-2.52.81-3.91c1.31-.67 2.19-1.91 2.19-3.34zm-11.71 4.2L6.8 12.46l1.41-1.42 2.26 2.26 4.8-5.23 1.47 1.36-6.2 6.77z"]';
+
+const config = { childList: true, subtree: true };
+
+function updateVerification(el){
+	chrome.storage.sync.get({
+    toggle: true,
+    replacer: "🤡"
+	  }, function(items) {
+		if (items.toggle) {
+			el.parentElement.parentElement.parentElement.appendChild(document.createTextNode(items.replacer))
+			el.parentElement.parentElement.remove()
+		}
+	});
+
+}
+
+function selectClowns(el) {
+	let clowns = el.querySelectorAll(clownSelector);
+	clowns.forEach( clown  => updateVerification(clown));
+}
+
+var observer = new MutationObserver(function (mutations) {
+  mutations.forEach(function (mutation) {
+	selectClowns(mutation.target);
+  })
+});
+
+
+selectClowns(document.body);
+observer.observe(document.body, config);
diff --git a/icons/icon128.png b/icons/icon128.png
diff --git a/icons/icon16.png b/icons/icon16.png
diff --git a/icons/icon32.png b/icons/icon32.png
diff --git a/icons/icon48.png b/icons/icon48.png
diff --git a/manifest.json b/manifest.json
@@ -0,0 +1,35 @@
+{
+	"manifest_version": 3,
+	"name": "Verified Bird",
+	"version": "1.0",
+	"author": "Radosław Gryta",
+	"description": "Tell me who paid for useless 'verified' icon?",
+	"action": {
+		"default_popup": "settings.html",
+		"default_icon": "icons/icon32.png"
+	},
+	 "icons": {
+		"16": "icons/icon16.png",
+		"32": "icons/icon32.png",
+		"48": "icons/icon48.png",
+		"128": "icons/icon128.png"
+	  },
+	"permissions": [
+		"storage",
+		"activeTab",
+		"scripting"
+	],
+	"content_scripts": [
+		{
+			"matches": [
+				"http://*/*",
+				"https://*/*"
+			],
+			"js": [
+				"contentScript.js"
+			],
+			"run_at": "document_end",
+			"all_frames": true
+		}
+	]
+}
diff --git a/settings.css b/settings.css
@@ -0,0 +1,74 @@
+body {
+    width: 300px;
+    display: flex;
+    flex-direction: column;
+	padding: 20px;
+}
+
+body > div > div {
+	font-size: large;
+	display: flex;
+    align-items: center;
+    justify-content: center;
+	margin-top: 10px;
+}
+
+.switch {
+  position: relative;
+  display: inline-block;
+  width: 60px;
+  height: 34px;
+}
+
+.switch input {
+  opacity: 0;
+  width: 0;
+  height: 0;
+}
+
+.slider {
+  position: absolute;
+  cursor: pointer;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  background-color: #ccc;
+  -webkit-transition: .4s;
+  transition: .4s;
+}
+
+.slider:before {
+  position: absolute;
+  content: "";
+  height: 26px;
+  width: 26px;
+  left: 4px;
+  bottom: 4px;
+  background-color: white;
+  -webkit-transition: .4s;
+  transition: .4s;
+}
+
+input:checked + .slider {
+  background-color: #2196F3;
+}
+
+input:focus + .slider {
+  box-shadow: 0 0 1px #2196F3;
+}
+
+input:checked + .slider:before {
+  -webkit-transform: translateX(26px);
+  -ms-transform: translateX(26px);
+  transform: translateX(26px);
+}
+
+/* Rounded sliders */
+.slider.round {
+  border-radius: 34px;
+}
+
+.slider.round:before {
+  border-radius: 50%;
+}
diff --git a/settings.html b/settings.html
@@ -0,0 +1,28 @@
+<!DOCTYPE html>
+<html>
+    <head>
+        <title>Bird Verifier Settings</title>
+		<meta charset="UTF-8">
+        <link rel="stylesheet" href="settings.css">
+        <script src="settings.js"></script>
+    </head>
+    <body>
+        <div>
+            <div>
+                <b>Toggle:</b>&nbsp; 
+				<label class="switch">
+                    <input id="toggle" type="checkbox">
+                    <span class="slider round"></span>
+                </label>
+            </div>
+            <div>
+                <b>Replace:</b>&nbsp; 
+				<input type="text" id="replacer" value="🤡"><br>
+            </div>
+            <div id="status"></div>
+			<div><button id="reset">Reset</button>&nbsp;<button id="save">Save</button></div>
+
+        </div>
+		<div style="text-align: right;"><i>By RG</i></div>
+    </body>
+</html>
diff --git a/settings.js b/settings.js
@@ -0,0 +1,39 @@
+// Saves options to chrome.storage
+function save_options() {
+
+  var toggle = document.getElementById('toggle').checked;
+  var replacer = document.getElementById('replacer').value;
+
+  chrome.storage.sync.set({
+    toggle: toggle,
+    replacer: replacer
+  }, function() {
+
+    var status = document.getElementById('status');
+    status.textContent = 'Options saved.';
+    setTimeout(function() {
+      status.textContent = '';
+    }, 750);
+
+  });
+}
+
+function restore_options() {
+  chrome.storage.sync.get({
+    toggle: true,
+    replacer: "🤡"
+  }, function(items) {
+    document.getElementById('toggle').checked = items.toggle;
+    document.getElementById('replacer').value = items.replacer;
+  });
+
+  document.getElementById('reset').addEventListener('click', function(){
+	  document.getElementById('toggle').checked = true;
+	  document.getElementById('replacer').value = '🤡';
+	  save_options();
+  });
+  document.getElementById('save').addEventListener('click', save_options);
+}
+
+
+document.addEventListener('DOMContentLoaded', restore_options);