commit f15173c12214d9fdb06e86d15dc9ef4c3bd3bc0b Author: mcolonna Date: Sat May 4 11:09:12 2024 +0200 release: v3.0 (v3.0.1 on Firefox) diff --git a/.gitignore b/.gitignore new file mode 100644 index 0000000..198748e --- /dev/null +++ b/.gitignore @@ -0,0 +1 @@ +/local/ diff --git a/background.js b/background.js new file mode 100644 index 0000000..948ed98 --- /dev/null +++ b/background.js @@ -0,0 +1,19 @@ +"use strict"; + +if (typeof hasPermissions == 'undefined') + self.importScripts("permissions.js"); + +if (chrome) + var browser = chrome; +if (!browser) + throw Error("wtf"); + +function checkPermissions() { + hasPermissions(browser).then((hasPerm) => { + if (!hasPerm) + browser.tabs.create({url: "/missing_permissions/index.html", active: true}); + }); +} + +checkPermissions(); +browser.permissions.onRemoved.addListener(checkPermissions); diff --git a/content.js b/content.js new file mode 100644 index 0000000..52e0d83 --- /dev/null +++ b/content.js @@ -0,0 +1,130 @@ +"use strict"; + +if (chrome) + window.browser = chrome; +if (!browser) + throw Error("wtf"); + +// REMOVE THE BUTTON IF IT ALREADY EXISTS +{ + let buttonEl = document.getElementById("fdtransparentbutton"); + if(buttonEl) + buttonEl.parentNode.removeChild(buttonEl); +} + +if([...document.getElementsByClassName("principal")].length > 0) { + class FDTransparent { + static createButton() { + // STYLESHEET + var styleText = ` + img#fdtransparentbutton { + position: fixed; + bottom: 20px; + left: 20px; + z-index: 9; + width: 48px; + height: 48px; + + border-radius: 50%; + filter: drop-shadow(0 0 6px rgba(0, 0, 0, 0.22)); + + background: #fff; + + transition: background 0.5s; + } + + img#fdtransparentbutton.on { + background: none; + } + + @media screen and (min-width: 1201px) { + img#fdtransparentbutton { + left: 325px; + } + } + + .principal.post + { + box-shadow: none !important; + } + + .principal { + transition: background-color 0.5s, box-shadow 0.5s; + box-shadow: none !important; + filter: drop-shadow(0 0 6px rgba(0, 0, 0, 0.22)); + } + + .principal.transparent { + background-color: #0000; + } + `; + var styleEl = document.createElement("style"); + if (styleEl.styleSheet) { + styleEl.styleSheet.cssText = styleText; + } else { + styleEl.appendChild(document.createTextNode(styleText)); + } + document.head.appendChild(styleEl); + // CREATE BUTTON + FDTransparent.button = document.createElement('img'); + FDTransparent.button.id = "fdtransparentbutton"; + FDTransparent.button.src = browser.runtime.getURL('icon96.png'); + // button click + FDTransparent.button.addEventListener("click", () => { + FDTransparent.isOn = !FDTransparent.isOn; + FDTransparent.setTransparent(FDTransparent.isOn); + }); + // append button + document.body.appendChild(FDTransparent.button); + // SYNC TRANSPARENCY FROM STORAGE + FDTransparent.isTransparent() + .then((v) => + { + FDTransparent.isOn = v; + FDTransparent.setTransparent(FDTransparent.isOn); + } + ); + } + + static changeButtonDisplay(value) { + if(value) + FDTransparent.button.className = "on"; + else + FDTransparent.button.className = ""; + } + + static isOn = false; + + static isTransparent() { + return new Promise((resolve, reject) => { + browser.storage.local.get("transparent") + .then((v) => { + resolve(Boolean(v.transparent)); + }); + }); + } + + static setTransparent(value) { + // CHANGE SAVED VALUE + browser.storage.local.set({"transparent": value }); + + // CHANGE TRANSPARENCY + [...document.getElementsByClassName("principal")].forEach((el) => { + if (value) + el.classList.add("transparent"); + else + el.classList.remove("transparent"); + }); + + // CHANGE BUTTON + FDTransparent.changeButtonDisplay(value); + } + } + + FDTransparent.createButton(); + + console.info('Extension FDTransparent chargée !'); +} +else { + console.info('L\'extension FDTransparent est inutile sur cette page.'); +} diff --git a/icon48.png b/icon48.png new file mode 100644 index 0000000..1230c5b Binary files /dev/null and b/icon48.png differ diff --git a/icon96.png b/icon96.png new file mode 100644 index 0000000..37f5687 Binary files /dev/null and b/icon96.png differ diff --git a/manifest.chrome.json b/manifest.chrome.json new file mode 100644 index 0000000..934cef3 --- /dev/null +++ b/manifest.chrome.json @@ -0,0 +1,32 @@ +{ + "manifest_version": 3, + "name": "FD transparent", + "version": "3.0", + + "description": "Ajoute un bouton pour activer et désactiver la transparence des images sur le Forum Dessiné (https://forum-dessine.fr).", + + "icons": { + "48": "icon48.png", + "96": "icon96.png" + }, + + "content_scripts": [ + { + "matches": ["*://*.forum-dessine.fr/*"], + "js": ["content.js"] + } + ], + + "background": { + "service_worker": "background.js" + }, + + "permissions": [ + "storage" + ], + + "web_accessible_resources": [{ + "resources": ["*"], + "matches": ["*://*.forum-dessine.fr/*"] + }] +} diff --git a/manifest.firefox.json b/manifest.firefox.json new file mode 100644 index 0000000..668b91f --- /dev/null +++ b/manifest.firefox.json @@ -0,0 +1,34 @@ +{ + "manifest_version": 2, + "name": "FD transparent", + "version": "3.0.1", + + "description": "Ajoute un bouton pour activer et désactiver la transparence des images sur le Forum Dessiné (https://forum-dessine.fr).", + + "icons": { + "48": "icon48.png", + "96": "icon96.png" + }, + + "content_scripts": [ + { + "matches": ["*://*.forum-dessine.fr/*"], + "js": ["content.js"] + } + ], + + "background": { + "scripts": ["permissions.js", "background.js"] + }, + + "permissions": [ + "storage", + "*://*.forum-dessine.fr/*" + ], + + "browser_specific_settings": { + "gecko": { + "id": "{9bf41bb9-68ed-49b8-9866-5caf0725e153}" + } + } +} diff --git a/manifest.firefox.v3.json b/manifest.firefox.v3.json new file mode 100644 index 0000000..a1d469d --- /dev/null +++ b/manifest.firefox.v3.json @@ -0,0 +1,37 @@ +{ + "manifest_version": 3, + "name": "FD transparent", + "version": "3.0", + + "description": "Ajoute un bouton pour activer et désactiver la transparence des images sur le Forum Dessiné (https://forum-dessine.fr).", + + "icons": { + "48": "icon48.png", + "96": "icon96.png" + }, + + "content_scripts": [ + { + "matches": ["*://*.forum-dessine.fr/*"], + "js": ["content.js"] + } + ], + + "background": { + "scripts": ["permissions.js", "background.js"] + }, + + "permissions": [ + "storage" + ], + + "web_accessible_resources": [{ + "resources": ["*"], + "matches": ["*://*.forum-dessine.fr/*"] + }], + "browser_specific_settings": { + "gecko": { + "id": "{9bf41bb9-68ed-49b8-9866-5caf0725e153}" + } + } +} diff --git a/manifest.json b/manifest.json new file mode 100644 index 0000000..668b91f --- /dev/null +++ b/manifest.json @@ -0,0 +1,34 @@ +{ + "manifest_version": 2, + "name": "FD transparent", + "version": "3.0.1", + + "description": "Ajoute un bouton pour activer et désactiver la transparence des images sur le Forum Dessiné (https://forum-dessine.fr).", + + "icons": { + "48": "icon48.png", + "96": "icon96.png" + }, + + "content_scripts": [ + { + "matches": ["*://*.forum-dessine.fr/*"], + "js": ["content.js"] + } + ], + + "background": { + "scripts": ["permissions.js", "background.js"] + }, + + "permissions": [ + "storage", + "*://*.forum-dessine.fr/*" + ], + + "browser_specific_settings": { + "gecko": { + "id": "{9bf41bb9-68ed-49b8-9866-5caf0725e153}" + } + } +} diff --git a/missing_permissions/index.html b/missing_permissions/index.html new file mode 100644 index 0000000..a7fc9ef --- /dev/null +++ b/missing_permissions/index.html @@ -0,0 +1,57 @@ + + + + + FD Transparent - Permissions Manquantes + + + +
+

+ ... +

+

+ + <- bouton moche +

+
+ + + + diff --git a/missing_permissions/script.js b/missing_permissions/script.js new file mode 100644 index 0000000..f6cfc87 --- /dev/null +++ b/missing_permissions/script.js @@ -0,0 +1,31 @@ +{ + function hideBouton() { + document.getElementById('boutonbox').style.display = "none"; + } + + function showBouton() { + document.getElementById('boutonbox').style.display = "block"; + } + + document.getElementById('bouton').addEventListener("click", () => { + askPermissions(browser).then((hello) => { + updateMsg(); + }); + }); + + function updateMsg() { + hasPermissions(browser).then((hasPerm) => { + let txt; + if (hasPerm) { + hideBouton(); + txt = "permission accordée ! "; + } + else { + showBouton(); + txt = " pour que FD Transparent puisse fonctionner, il faut que vous permettiez à l'extension l'accès aux pages du Forum Dessiné en appuyant sur le bouton moche"; + } + document.getElementById("msg").innerHTML = txt; + }); + } + updateMsg(); +} diff --git a/missing_permissions/zy_awaiting.png b/missing_permissions/zy_awaiting.png new file mode 100644 index 0000000..d30db05 Binary files /dev/null and b/missing_permissions/zy_awaiting.png differ diff --git a/missing_permissions/zy_lezgo.png b/missing_permissions/zy_lezgo.png new file mode 100644 index 0000000..d79020f Binary files /dev/null and b/missing_permissions/zy_lezgo.png differ diff --git a/package-lock.json b/package-lock.json new file mode 100644 index 0000000..4aaafce --- /dev/null +++ b/package-lock.json @@ -0,0 +1,47 @@ +{ + "name": "fd_transparent", + "lockfileVersion": 2, + "requires": true, + "packages": { + "": { + "dependencies": { + "node": "^22.1.0" + } + }, + "node_modules/node": { + "version": "22.1.0", + "resolved": "https://registry.npmjs.org/node/-/node-22.1.0.tgz", + "integrity": "sha512-eeRKoLhxcx3DEzsdU1XxbJlDfVX2rvobe24YT9+jzXa5heKMCadyWjYwAEgevi1+r4WU/weKr5DUoNJbI5OKmw==", + "hasInstallScript": true, + "dependencies": { + "node-bin-setup": "^1.0.0" + }, + "bin": { + "node": "bin/node" + }, + "engines": { + "npm": ">=5.0.0" + } + }, + "node_modules/node-bin-setup": { + "version": "1.1.3", + "resolved": "https://registry.npmjs.org/node-bin-setup/-/node-bin-setup-1.1.3.tgz", + "integrity": "sha512-opgw9iSCAzT2+6wJOETCpeRYAQxSopqQ2z+N6BXwIMsQQ7Zj5M8MaafQY8JMlolRR6R1UXg2WmhKp0p9lSOivg==" + } + }, + "dependencies": { + "node": { + "version": "22.1.0", + "resolved": "https://registry.npmjs.org/node/-/node-22.1.0.tgz", + "integrity": "sha512-eeRKoLhxcx3DEzsdU1XxbJlDfVX2rvobe24YT9+jzXa5heKMCadyWjYwAEgevi1+r4WU/weKr5DUoNJbI5OKmw==", + "requires": { + "node-bin-setup": "^1.0.0" + } + }, + "node-bin-setup": { + "version": "1.1.3", + "resolved": "https://registry.npmjs.org/node-bin-setup/-/node-bin-setup-1.1.3.tgz", + "integrity": "sha512-opgw9iSCAzT2+6wJOETCpeRYAQxSopqQ2z+N6BXwIMsQQ7Zj5M8MaafQY8JMlolRR6R1UXg2WmhKp0p9lSOivg==" + } + } +} diff --git a/package.json b/package.json new file mode 100644 index 0000000..f7a3378 --- /dev/null +++ b/package.json @@ -0,0 +1,5 @@ +{ + "dependencies": { + "node": "^22.1.0" + } +} diff --git a/permissions.js b/permissions.js new file mode 100644 index 0000000..f77cad4 --- /dev/null +++ b/permissions.js @@ -0,0 +1,13 @@ +"use strict"; + +const REQUIRED_PERMISSIONS = {origins: ["*://*.forum-dessine.fr/*"]}; + +function hasPermissions(browser) { + return new Promise((success) => { + browser.permissions.contains(REQUIRED_PERMISSIONS, success); + }); +} + +function askPermissions(browser) { + return browser.permissions.request(REQUIRED_PERMISSIONS); +}