diff options
| -rw-r--r-- | README.md | 7 | ||||
| -rw-r--r-- | _locales/en/messages.json | 98 | ||||
| -rw-r--r-- | _locales/fr/messages.json | 98 | ||||
| -rw-r--r-- | assets/images/Screen Shot Chrome 1.png (renamed from images/Screen Shot Chrome 1.png) | bin | 495422 -> 495422 bytes | |||
| -rw-r--r-- | assets/images/Screen Shot Chrome 2.png (renamed from images/Screen Shot Chrome 2.png) | bin | 882289 -> 882289 bytes | |||
| -rw-r--r-- | assets/images/Screen Shot Chrome 3.png (renamed from images/Screen Shot Chrome 3.png) | bin | 313416 -> 313416 bytes | |||
| -rw-r--r-- | assets/images/Screen Shot Chrome 4.png (renamed from images/Screen Shot Chrome 4.png) | bin | 1264130 -> 1264130 bytes | |||
| -rw-r--r-- | assets/images/Screen Shot Chrome 5.png (renamed from images/Screen Shot Chrome 5.png) | bin | 320255 -> 320255 bytes | |||
| -rw-r--r-- | assets/images/Screen Shot FF 1.png (renamed from images/Screen Shot FF 1.png) | bin | 696755 -> 696755 bytes | |||
| -rw-r--r-- | assets/images/Screen Shot FF 2.png (renamed from images/Screen Shot FF 2.png) | bin | 3036251 -> 3036251 bytes | |||
| -rw-r--r-- | assets/images/Screen Shot FF 3.png (renamed from images/Screen Shot FF 3.png) | bin | 530328 -> 530328 bytes | |||
| -rw-r--r-- | assets/images/Screen Shot FF 4.png (renamed from images/Screen Shot FF 4.png) | bin | 3646768 -> 3646768 bytes | |||
| -rw-r--r-- | assets/images/Screen Shot FF 5.png (renamed from images/Screen Shot FF 5.png) | bin | 542853 -> 542853 bytes | |||
| -rw-r--r-- | assets/images/amo-badge.png | bin | 0 -> 2827 bytes | |||
| -rw-r--r-- | assets/images/buy-me-a-coffee.png (renamed from images/buy-me-a-coffee.png) | bin | 5008 -> 5008 bytes | |||
| -rw-r--r-- | assets/images/chevron-down.svg | 3 | ||||
| -rw-r--r-- | assets/images/chrome-badge.png | bin | 0 -> 3762 bytes | |||
| -rw-r--r-- | assets/images/icon128.png (renamed from images/icon128.png) | bin | 3197 -> 3197 bytes | |||
| -rw-r--r-- | assets/images/icon16.png (renamed from images/icon16.png) | bin | 976 -> 976 bytes | |||
| -rw-r--r-- | assets/images/icon32.png (renamed from images/icon32.png) | bin | 1983 -> 1983 bytes | |||
| -rw-r--r-- | assets/images/icon48.png (renamed from images/icon48.png) | bin | 1063 -> 1063 bytes | |||
| -rw-r--r-- | assets/images/logo-small.png | bin | 0 -> 22050 bytes | |||
| -rw-r--r-- | assets/images/logo.png (renamed from images/logo.png) | bin | 39876 -> 39876 bytes | |||
| -rw-r--r-- | assets/images/small-tile.png (renamed from images/small-tile.png) | bin | 35583 -> 35583 bytes | |||
| -rw-r--r-- | assets/javascript/localise.js | 19 | ||||
| -rw-r--r-- | assets/javascript/persist-invidious-prefs.js (renamed from assets/persist-invidious-prefs.js) | 0 | ||||
| -rw-r--r-- | assets/javascript/remove-twitter-sw.js (renamed from assets/remove-twitter-sw.js) | 20 | ||||
| -rw-r--r-- | background.js | 85 | ||||
| -rw-r--r-- | manifest.json | 27 | ||||
| -rw-r--r-- | pages/options/options.html | 376 | ||||
| -rw-r--r-- | pages/options/options.js | 225 | ||||
| -rw-r--r-- | pages/popup/popup.html | 149 | ||||
| -rw-r--r-- | pages/popup/popup.js | 81 | ||||
| -rw-r--r-- | pages/styles.css | 149 | ||||
| -rw-r--r-- | web-ext-config.js | 4 |
35 files changed, 963 insertions, 378 deletions
diff --git a/README.md b/README.md index e5ee60f5..29ccd7b6 100644 --- a/README.md +++ b/README.md @@ -1,9 +1,8 @@ -#  Privacy Redirect +#  -[](https://liberapay.com/SimonBrazell/donate) [](https://www.buymeacoffee.com/SimonBrazell) +[](https://liberapay.com/SimonBrazell/donate) [](https://www.buymeacoffee.com/SimonBrazell) -- [Chrome Extension](https://chrome.google.com/webstore/detail/privacy-redirect/pmcmeagblkinmogikoikkdjiligflglb) -- [Firefox Add-on](https://addons.mozilla.org/en-US/firefox/addon/privacy-redirect/) +[](https://addons.mozilla.org/en-US/firefox/addon/privacy-redirect/) [](https://chrome.google.com/webstore/detail/privacy-redirect/pmcmeagblkinmogikoikkdjiligflglb) A web extension that redirects Twitter, YouTube, Instagram & Google Maps requests to privacy friendly alternatives - [Nitter](https://github.com/zedeus/nitter), [Invidious](https://github.com/omarroth/invidious), [Bibliogram](https://github.com/cloudrac3r/bibliogram) & [OpenStreetMap](https://www.openstreetmap.org/). diff --git a/_locales/en/messages.json b/_locales/en/messages.json new file mode 100644 index 00000000..2a34b8b7 --- /dev/null +++ b/_locales/en/messages.json @@ -0,0 +1,98 @@ +{ + "extensionName": { + "message": "Privacy Redirect", + "description": "Name of the extension." + }, + "extensionDescription": { + "message": "Redirects Twitter, YouTube, Instagram & Google Maps requests to privacy friendly alternatives.", + "description": "Description of the extension." + }, + "nitterInstance": { + "message": "Nitter Instance", + "description": "Label for Nitter instance field option (options)." + }, + "invidiousInstance": { + "message": "Invidious Instance", + "description": "Label for Invidious instance field option (options)." + }, + "bibliogramInstance": { + "message": "Bibliogram Instance", + "description": "Label for Bibliogram instance field option (options)." + }, + "osmInstance": { + "message": "OpenStreetMap Instance", + "description": "Label for OSM instance field option (options)." + }, + "disableNitter": { + "message": "Nitter Redirects", + "description": "Label for enable/disable Nitter redirects option (options & pop-up)." + }, + "disableInvidious": { + "message": "Invidious Redirects", + "description": "Label for enable/disable Invidious redirects option (options & pop-up)." + }, + "disableBibliogram": { + "message": "Bibliogram Redirects", + "description": "Label for enable/disable Bibliogram redirects option (options & pop-up)." + }, + "disableOsm": { + "message": "OpenStreetMap Redirects", + "description": "Label for enable/disable OSM redirects option (options & pop-up)." + }, + "alwaysProxy": { + "message": "Always proxy videos through Invidious", + "description": "Label for 'Always proxy videos through Invidious' option (options)." + }, + "onlyEmbeddedVideo": { + "message": "Only redirect embedded video to Invidious", + "description": "Label for 'Only redirect embedded video to Invidious' option (options)." + }, + "videoQuality": { + "message": "Invidious Video Quality", + "description": "Label for 'Invidious Video Quality' option (options)." + }, + "removeTwitterSW": { + "message": "Proactively remove Twitter service worker", + "description": "Label for 'Proactively remove Twitter service worker' option (options)." + }, + "invidiousDarkMode": { + "message": "Invidious dark mode always on", + "description": "Label for 'Invidious dark mode always on' option (options)." + }, + "persistInvidiousPrefs": { + "message": "Persist Invidious preferences (as cookie)", + "description": "Label for 'Persist Invidious preferences (as cookie)' option (options)." + }, + "generalTab": { + "message": "General", + "description": "General tab (options)." + }, + "advancedTab": { + "message": "Advanced", + "description": "Advanced tab (options)." + }, + "exceptionsTab": { + "message": "Exceptions", + "description": "Exceptions tab (options)." + }, + "exceptionsDescription": { + "message": "<p>Enter a URL or Regular Expression to be excluded from redirects.</p><p>All requests for or initiating from a URL that matches the exception will be excluded from redirects.</p><p><b>Note -</b> Supports JavaScript regular expressions, excluding the enclosing forward slashes.</p>", + "description": "A description of the 'Exceptions' feature (options)." + }, + "addException": { + "message": "Add Exception", + "description": "'Add Exceptions' button (options)." + }, + "moreOptions": { + "message": "More Options", + "description": "More Options button (pop-up)." + }, + "privacy": { + "message": "Privacy", + "description": "Extension title - Privacy (pop-up)." + }, + "redirect": { + "message": "Redirect", + "description": "Extension title - Redirect (pop-up)." + } +} \ No newline at end of file diff --git a/_locales/fr/messages.json b/_locales/fr/messages.json new file mode 100644 index 00000000..fe2eaaf6 --- /dev/null +++ b/_locales/fr/messages.json @@ -0,0 +1,98 @@ +{ + "extensionName": { + "message": "Privacy Redirect", + "description": "Nom du module complémentaire." + }, + "extensionDescription": { + "message": "Redirige les requêtes les demandes Twitter, YouTube, Instagram et Google Maps vers des alternatives respectueuses de la vie privée. pour Twitter, YouTube, Instagram et Google Maps vers des alternatives respectueuses de la vie privée.", + "description": "Description du module complémentaire." + }, + "nitterInstance": { + "message": "Instance de Nitter", + "description": "Étiquette pour l'option de champ d'instance Nitter (options)." + }, + "invidiousInstance": { + "message": "Instance de Invidious", + "description": "Étiquette pour l'option de champ d'instance Invidious (options)." + }, + "bibliogramInstance": { + "message": "Instance de Bibliogram", + "description": "Étiquette pour l'option de champ d'instance Bibliogram (options)." + }, + "osmInstance": { + "message": "Instance de OpenStreetMap", + "description": "Étiquette pour l'option de champ d'instance OpenStreetMap (options)." + }, + "disableNitter": { + "message": "Redirection vers Nitter", + "description": "Étiquette pour activer / désactiver l'option de redirection vers Nitter (options et pop-up)." + }, + "disableInvidious": { + "message": "Redirection vers Invidious", + "description": "Étiquette pour activer / désactiver l'option de redirection vers Invidious (options et pop-up)." + }, + "disableBibliogram": { + "message": "Redirection vers Bibliogram", + "description": "Étiquette pour activer / désactiver l'option de redirection vers Bibliogram (options et pop-up)." + }, + "disableOsm": { + "message": "Redirection vers OpenStreetMap", + "description": "Étiquette pour activer / désactiver l'option de redirection vers OpenStreetMap (options et pop-up)." + }, + "alwaysProxy": { + "message": "Toujours transiter par proxy les vidéos via Invidious", + "description": "Libellé pour l'option 'Toujours transiter par proxy les vidéos via Invidious' (options)." + }, + "onlyEmbeddedVideo": { + "message": "Rediriger uniquement les vidéos intégrées vers Invidious", + "description": "Libellé pour l'option 'Rediriger uniquement les vidéos intégrées vers Invidious' (options)." + }, + "videoQuality": { + "message": "Qualité des vidéos Invidious", + "description": "Libellé pour l'option 'Qualité des vidéos Invidious' (options)." + }, + "removeTwitterSW": { + "message": "Supprimer proactivement le service Twitter", + "description": "Libellé pour l'option 'Supprimer proactivement le service Twitter' (options)." + }, + "invidiousDarkMode": { + "message": "Mode sombre toujours activé pour Invidious", + "description": "Libellé pour l'option 'Mode sombre toujours activé pour Invidious' (options)." + }, + "persistInvidiousPrefs": { + "message": "Conserver les préférences malveillantes (sous forme de cookie)", + "description": "Libellé pour 'Conserver les préférences malveillantes (sous forme de cookie)' option (options)." + }, + "generalTab": { + "message": "Général", + "description": "Onglet général (options)." + }, + "advancedTab": { + "message": "Avancé", + "description": "Onglet avancé (options)." + }, + "exceptionsTab": { + "message": "Exceptions", + "description": "Onglet des Exceptions dans les options." + }, + "exceptionsDescription": { + "message": "<p>Entrez une adresse URL ou une expression régulière qui sera exclue des redirections.</p><p>All requests for or initiating from a URL that matches the exception will be excluded from redirects.</p><p><b>Note -</b> Supports JavaScript regular expressions, excluding the enclosing forward slashes.</p>", + "description": "Description pour la rubrique 'Exceptions' dans les options." + }, + "addException": { + "message": "Ajoutez une exception", + "description": "boutton 'Ajoutez une exception' dans les options." + }, + "moreOptions": { + "message": "Options supplémentaires", + "description": "Boutton des options supplémentaires (pop-up)." + }, + "privacy": { + "message": "Vie privée", + "description": "Titre du module complémentaire - Vie privée (pop-up)." + }, + "redirect": { + "message": "Redirection", + "description": "Titre du module complémentaire - Redirection (pop-up)." + } +} \ No newline at end of file diff --git a/images/Screen Shot Chrome 1.png b/assets/images/Screen Shot Chrome 1.png index 65e18e2a..65e18e2a 100644 --- a/images/Screen Shot Chrome 1.png +++ b/assets/images/Screen Shot Chrome 1.png Binary files differdiff --git a/images/Screen Shot Chrome 2.png b/assets/images/Screen Shot Chrome 2.png index 7bb98a4a..7bb98a4a 100644 --- a/images/Screen Shot Chrome 2.png +++ b/assets/images/Screen Shot Chrome 2.png Binary files differdiff --git a/images/Screen Shot Chrome 3.png b/assets/images/Screen Shot Chrome 3.png index 3a4fbd35..3a4fbd35 100644 --- a/images/Screen Shot Chrome 3.png +++ b/assets/images/Screen Shot Chrome 3.png Binary files differdiff --git a/images/Screen Shot Chrome 4.png b/assets/images/Screen Shot Chrome 4.png index 8954e923..8954e923 100644 --- a/images/Screen Shot Chrome 4.png +++ b/assets/images/Screen Shot Chrome 4.png Binary files differdiff --git a/images/Screen Shot Chrome 5.png b/assets/images/Screen Shot Chrome 5.png index bf0ffa08..bf0ffa08 100644 --- a/images/Screen Shot Chrome 5.png +++ b/assets/images/Screen Shot Chrome 5.png Binary files differdiff --git a/images/Screen Shot FF 1.png b/assets/images/Screen Shot FF 1.png index e4be8989..e4be8989 100644 --- a/images/Screen Shot FF 1.png +++ b/assets/images/Screen Shot FF 1.png Binary files differdiff --git a/images/Screen Shot FF 2.png b/assets/images/Screen Shot FF 2.png index 018789a3..018789a3 100644 --- a/images/Screen Shot FF 2.png +++ b/assets/images/Screen Shot FF 2.png Binary files differdiff --git a/images/Screen Shot FF 3.png b/assets/images/Screen Shot FF 3.png index 90d28bda..90d28bda 100644 --- a/images/Screen Shot FF 3.png +++ b/assets/images/Screen Shot FF 3.png Binary files differdiff --git a/images/Screen Shot FF 4.png b/assets/images/Screen Shot FF 4.png index f83e8f29..f83e8f29 100644 --- a/images/Screen Shot FF 4.png +++ b/assets/images/Screen Shot FF 4.png Binary files differdiff --git a/images/Screen Shot FF 5.png b/assets/images/Screen Shot FF 5.png index fc821639..fc821639 100644 --- a/images/Screen Shot FF 5.png +++ b/assets/images/Screen Shot FF 5.png Binary files differdiff --git a/assets/images/amo-badge.png b/assets/images/amo-badge.png new file mode 100644 index 00000000..9cb49bba --- /dev/null +++ b/assets/images/amo-badge.png Binary files differdiff --git a/images/buy-me-a-coffee.png b/assets/images/buy-me-a-coffee.png index 1bb2ad61..1bb2ad61 100644 --- a/images/buy-me-a-coffee.png +++ b/assets/images/buy-me-a-coffee.png Binary files differdiff --git a/assets/images/chevron-down.svg b/assets/images/chevron-down.svg new file mode 100644 index 00000000..7679f267 --- /dev/null +++ b/assets/images/chevron-down.svg @@ -0,0 +1,3 @@ +<svg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 512 512'> + <polyline points='112 184 256 328 400 184' style='fill:none;stroke:#FF5B56;stroke-linecap:round;stroke-linejoin:round;stroke-width:48px'/> +</svg> \ No newline at end of file diff --git a/assets/images/chrome-badge.png b/assets/images/chrome-badge.png new file mode 100644 index 00000000..4e48b8a6 --- /dev/null +++ b/assets/images/chrome-badge.png Binary files differdiff --git a/images/icon128.png b/assets/images/icon128.png index ccd689cc..ccd689cc 100644 --- a/images/icon128.png +++ b/assets/images/icon128.png Binary files differdiff --git a/images/icon16.png b/assets/images/icon16.png index 1c510cb7..1c510cb7 100644 --- a/images/icon16.png +++ b/assets/images/icon16.png Binary files differdiff --git a/images/icon32.png b/assets/images/icon32.png index d001aab6..d001aab6 100644 --- a/images/icon32.png +++ b/assets/images/icon32.png Binary files differdiff --git a/images/icon48.png b/assets/images/icon48.png index 4ddd22eb..4ddd22eb 100644 --- a/images/icon48.png +++ b/assets/images/icon48.png Binary files differdiff --git a/assets/images/logo-small.png b/assets/images/logo-small.png new file mode 100644 index 00000000..09e50d18 --- /dev/null +++ b/assets/images/logo-small.png Binary files differdiff --git a/images/logo.png b/assets/images/logo.png index ecb3e381..ecb3e381 100644 --- a/images/logo.png +++ b/assets/images/logo.png Binary files differdiff --git a/images/small-tile.png b/assets/images/small-tile.png index a3ed077b..a3ed077b 100644 --- a/images/small-tile.png +++ b/assets/images/small-tile.png Binary files differdiff --git a/assets/javascript/localise.js b/assets/javascript/localise.js new file mode 100644 index 00000000..e408025d --- /dev/null +++ b/assets/javascript/localise.js @@ -0,0 +1,19 @@ +window.browser = window.browser || window.chrome; + +function localizeHtmlPage() { + // Localize using __MSG_***__ data tags + var data = document.querySelectorAll('[data-localize]'); + + for (var i in data) if (data.hasOwnProperty(i)) { + var obj = data[i]; + var tag = obj.getAttribute('data-localize').toString(); + + var msg = tag.replace(/__MSG_(\w+)__/g, function (_match, v1) { + return v1 ? browser.i18n.getMessage(v1) : null; + }); + + if (msg && msg !== tag) obj.innerHTML = msg; + } +} + +localizeHtmlPage(); \ No newline at end of file diff --git a/assets/persist-invidious-prefs.js b/assets/javascript/persist-invidious-prefs.js index 4c13a310..4c13a310 100644 --- a/assets/persist-invidious-prefs.js +++ b/assets/javascript/persist-invidious-prefs.js diff --git a/assets/remove-twitter-sw.js b/assets/javascript/remove-twitter-sw.js index d1b30637..d9d3ce3e 100644 --- a/assets/remove-twitter-sw.js +++ b/assets/javascript/remove-twitter-sw.js @@ -5,17 +5,17 @@ const nitterDefault = 'https://nitter.net'; let disableNitter; let nitterInstance; let redirectBypassFlag; -let whitelist; +let exceptions; window.browser = window.browser || window.chrome; -function isNotWhitelisted(url) { - return !whitelist.some(regex => (regex.test(url.href))); +function isNotException(url) { + return !exceptions.some(regex => (regex.test(url.href))); } function shouldRedirect(url) { return !redirectBypassFlag && - isNotWhitelisted(url) && + isNotException(url) && !disableNitter && url.host !== nitterInstance && !url.pathname.includes('/home'); @@ -32,7 +32,13 @@ function redirectTwitter(url) { } browser.storage.sync.get( - ['nitterInstance', 'disableNitter', 'removeTwitterSW', 'redirectBypassFlag'], + [ + 'nitterInstance', + 'disableNitter', + 'removeTwitterSW', + 'redirectBypassFlag', + 'exceptions' + ], (result) => { redirectBypassFlag = result.redirectBypassFlag; browser.storage.sync.set({ @@ -41,8 +47,8 @@ browser.storage.sync.get( if (!result.removeTwitterSW) { disableNitter = result.disableNitter; nitterInstance = result.nitterInstance || nitterDefault; - whitelist = result.whitelist ? result.whitelist.map(e => { - return new RegExp(e.replace(/[-\/\\^$*+?.()|[\]{}]/g, '\\$&')); + exceptions = result.exceptions ? result.exceptions.map(e => { + return new RegExp(e); }) : []; navigator.serviceWorker.getRegistrations().then(registrations => { for (let registration of registrations) { diff --git a/background.js b/background.js index 5810f42a..021ccbb0 100644 --- a/background.js +++ b/background.js @@ -85,7 +85,11 @@ let alwaysProxy; let onlyEmbeddedVideo; let videoQuality; let invidiousDarkMode; -let whitelist; +let invidiousVolume; +let invidiousPlayerStyle; +let invidiousSubtitles; +let invidiousAutoplay; +let exceptions; window.browser = window.browser || window.chrome; @@ -103,7 +107,11 @@ browser.storage.sync.get( 'onlyEmbeddedVideo', 'videoQuality', 'invidiousDarkMode', - 'whitelist' + 'invidiousVolume', + 'invidiousPlayerStyle', + 'invidiousSubtitles', + 'invidiousAutoplay', + 'exceptions' ], result => { disableNitter = result.disableNitter; @@ -118,9 +126,13 @@ browser.storage.sync.get( onlyEmbeddedVideo = result.onlyEmbeddedVideo; videoQuality = result.videoQuality; invidiousDarkMode = result.invidiousDarkMode; - whitelist = result.whitelist ? result.whitelist.map(e => { - return new RegExp(e.replace(/[-\/\\^$*+?.()|[\]{}]/g, '\\$&')); + exceptions = result.exceptions ? result.exceptions.map(e => { + return new RegExp(e); }) : []; + invidiousVolume = result.invidiousVolume; + invidiousPlayerStyle = result.invidiousPlayerStyle; + invidiousSubtitles = result.invidiousSubtitles || ''; + invidiousAutoplay = !result.invidiousAutoplay; } ); @@ -161,9 +173,21 @@ browser.storage.onChanged.addListener(changes => { if ('invidiousDarkMode' in changes) { invidiousDarkMode = changes.invidiousDarkMode.newValue; } - if ('whitelist' in changes) { - whitelist = changes.whitelist.newValue.map(e => { - return new RegExp(e.replace(/[-\/\\^$*+?.()|[\]{}]/g, '\\$&')); + if ('invidiousVolume' in changes) { + invidiousVolume = changes.invidiousVolume.newValue; + } + if ('invidiousPlayerStyle' in changes) { + invidiousPlayerStyle = changes.invidiousPlayerStyle.newValue; + } + if ('invidiousSubtitles' in changes) { + invidiousSubtitles = changes.invidiousSubtitles.newValue; + } + if ('invidiousAutoplay' in changes) { + invidiousAutoplay = changes.invidiousAutoplay.newValue; + } + if ('exceptions' in changes) { + exceptions = changes.exceptions.newValue.map(e => { + return new RegExp(e); }); } }); @@ -194,9 +218,9 @@ function addressToLatLng(address, callback) { xmlhttp.send(); } -function isWhitelisted(url, initiator) { - return whitelist.some(regex => (regex.test(url.href))) || - (initiator && whitelist.some(regex => (regex.test(initiator.href)))); +function isException(url, initiator) { + return exceptions.some(regex => (regex.test(url.href))) || + (initiator && exceptions.some(regex => (regex.test(initiator.href)))); } function isFirefox() { @@ -204,7 +228,7 @@ function isFirefox() { } function redirectYouTube(url, initiator, type) { - if (disableInvidious || isWhitelisted(url, initiator)) { + if (disableInvidious || isException(url, initiator)) { return null; } if (initiator && (initiator.origin === invidiousInstance || youtubeDomains.includes(initiator.host))) { @@ -231,11 +255,24 @@ function redirectYouTube(url, initiator, type) { if (invidiousDarkMode) { url.searchParams.append('dark_mode', invidiousDarkMode); } + if (invidiousVolume) { + url.searchParams.append('volume', invidiousVolume); + } + if (invidiousPlayerStyle) { + url.searchParams.append('player_style', invidiousPlayerStyle); + } + if (invidiousSubtitles) { + url.searchParams.append('subtitles', invidiousSubtitles); + } + if (invidiousAutoplay) { + url.searchParams.append('autoplay', invidiousAutoplay); + } + return `${invidiousInstance}${url.pathname}${url.search}`; } function redirectTwitter(url, initiator) { - if (disableNitter || isWhitelisted(url, initiator)) { + if (disableNitter || isException(url, initiator)) { return null; } if (url.pathname.includes('/home')) { @@ -259,7 +296,7 @@ function redirectTwitter(url, initiator) { } function redirectInstagram(url, initiator, type) { - if (disableBibliogram || isWhitelisted(url, initiator)) { + if (disableBibliogram || isException(url, initiator)) { return null; } // Do not redirect Bibliogram view on Instagram links @@ -279,7 +316,7 @@ function redirectInstagram(url, initiator, type) { } function redirectGoogleMaps(url, initiator) { - if (disableOsm || isWhitelisted(url, initiator)) { + if (disableOsm || isException(url, initiator)) { return null; } let redirect; @@ -363,10 +400,10 @@ browser.webRequest.onBeforeRequest.addListener( details => { const url = new URL(details.url); let initiator; - if (details.initiator) { - initiator = new URL(details.initiator); - } else if (details.originUrl) { + if (details.originUrl) { initiator = new URL(details.originUrl); + } else if (details.initiator) { + initiator = new URL(details.initiator); } let redirect; if (youtubeDomains.includes(url.host)) { @@ -406,6 +443,20 @@ browser.runtime.onInstalled.addListener( browser.storage.sync.set({ bibliogramInstance: bibliogramInstances[~~(bibliogramInstances.length * Math.random())] }); + } else if (details.reason === 'update') { + browser.storage.sync.get(['whitelist', 'exceptions'], + result => { + if (result.whitelist) { + let whitelist = result.whitelist.map( + e => e.replace(/[-\/\\^$*+?.()|[\]{}]/g, '\\$&') + ); + browser.storage.sync.set({ + exceptions: result.exceptions.concat(whitelist), + whitelist: null + }); + } + } + ); } } ); diff --git a/manifest.json b/manifest.json index b34cfc77..5329a289 100644 --- a/manifest.json +++ b/manifest.json @@ -1,7 +1,7 @@ { - "name": "Privacy Redirect", - "description": "Redirects Twitter, YouTube, Instagram & Google Maps requests to privacy friendly alternatives.", - "version": "1.1.34", + "name": "__MSG_extensionName__", + "description": "__MSG_extensionDescription__", + "version": "1.1.35", "manifest_version": 2, "background": { "scripts": [ @@ -9,11 +9,12 @@ ], "persistent": true }, + "default_locale": "en", "icons": { - "16": "images/icon16.png", - "32": "images/icon32.png", - "48": "images/icon48.png", - "128": "images/icon128.png" + "16": "assets/images/icon16.png", + "32": "assets/images/icon32.png", + "48": "assets/images/icon48.png", + "128": "assets/images/icon128.png" }, "permissions": [ "storage", @@ -25,10 +26,10 @@ "default_title": "Privacy Redirect", "default_popup": "pages/popup/popup.html", "default_icon": { - "16": "images/icon16.png", - "32": "images/icon32.png", - "48": "images/icon48.png", - "128": "images/icon128.png" + "16": "assets/images/icon16.png", + "32": "assets/images/icon32.png", + "48": "assets/images/icon48.png", + "128": "assets/images/icon128.png" } }, "content_scripts": [ @@ -41,7 +42,7 @@ "*://video.twimg.com/*" ], "js": [ - "assets/remove-twitter-sw.js" + "assets/javascript/remove-twitter-sw.js" ], "run_at": "document_start" }, @@ -64,7 +65,7 @@ "*://mfqczy4mysscub2s.onio/*n" ], "js": [ - "assets/persist-invidious-prefs.js" + "assets/javascript/persist-invidious-prefs.js" ], "run_at": "document_start" } diff --git a/pages/options/options.html b/pages/options/options.html index 317f8145..ca6429f1 100644 --- a/pages/options/options.html +++ b/pages/options/options.html @@ -12,124 +12,136 @@ <body> <div class="tab"> - <button class="tablinks" id="general-tab">General</button> - <button class="tablinks" id="advanced-tab">Advanced</button> - <button class="tablinks" id="whitelist-tab">Whitelist</button> + <button class="tablinks" id="general-tab" data-localize="__MSG_generalTab__">General</button> + <button class="tablinks" id="advanced-tab" data-localize="__MSG_advancedTab__">Advanced</button> + <button class="tablinks" id="exceptions-tab" data-localize="__MSG_exceptionsTab__">Exceptions</button> </div> <div id="general" class="tabcontent"> - <section class="options settings_block"> - <div class="onoffswitch switch" aria-label="Toggle Nitter redirects"> - <h1>Nitter Redirects</h1> - <input aria-hidden="true" id="disable-nitter" type="checkbox" checked> - <label for="disable-nitter" class="checkbox-label"> - </label> - </div> + <section class="settings-block"> + <table class="option" aria-label="Toggle Nitter redirects"> + <tbody> + <tr> + <td> + <h1 data-localize="__MSG_disableNitter__">Nitter Redirects</h1> + </td> + <td> + <input aria-hidden="true" id="disable-nitter" type="checkbox" checked> + <label for="disable-nitter" class="checkbox-label"></label> + </td> + </tr> + </tbody> + </table> </section> - - <section class="options settings_block"> - <div class="onoffswitch switch" aria-label="Toggle Invidious redirects"> - <h1>Invidious Redirects</h1> - <input aria-hidden="true" id="disable-invidious" type="checkbox" checked> - <label for="disable-invidious" class="checkbox-label"> - </label> - </div> + <section class="settings-block"> + <table class="option" aria-label="Toggle Invidious redirects"> + <tbody> + <tr> + <td> + <h1 data-localize="__MSG_disableInvidious__">Invidious Redirects</h1> + </td> + <td> + <input aria-hidden="true" id="disable-invidious" type="checkbox" checked> + <label for="disable-invidious" class="checkbox-label"> + </label> + </td> + </tr> + </tbody> + </table> </section> - - <section class="options settings_block"> - <div class="onoffswitch switch" aria-label="Toggle Bibliogram redirects"> - <h1>Bibliogram Redirects</h1> - <input aria-hidden="true" id="disable-bibliogram" type="checkbox" checked> - <label for="disable-bibliogram" class="checkbox-label"> - </label> + <section class="settings-block"> + <table class="option" aria-label="Toggle Bibliogram redirects"> + <tbody> + <tr> + <td> + <h1 data-localize="__MSG_disableBibliogram__">Bibliogram Redirects</h1> + </td> + <td> + <input aria-hidden="true" id="disable-bibliogram" type="checkbox" checked> + <label for="disable-bibliogram" class="checkbox-label"> + </label> + </td> + </tr> + </tbody> + </table> + </section> + <section class="settings-block"> + <table class="option" aria-label="Toggle OpenStreetMap redirects"> + <tbody> + <tr> + <td> + <h1 data-localize="__MSG_disableOsm__">OpenStreetMap Redirects</h1> + </td> + <td> + <input aria-hidden="true" id="disable-osm" type="checkbox" checked> + <label for="disable-osm" class="checkbox-label"> + </label> + </td> + </tr> + </tbody> + </table> + </section> + <section class="settings-block"> + <h1 data-localize="__MSG_nitterInstance__">Nitter Instance</h1> + <div class="autocomplete"> + <input id="nitter-instance" type="url" name="nitter-instance" placeholder="https://nitter.net"> </div> </section> - - <section class="options settings_block"> - <div class="onoffswitch switch" aria-label="Toggle OpenStreetMap redirects"> - <h1>OpenStreetMap Redirects</h1> - <input aria-hidden="true" id="disable-osm" type="checkbox" checked> - <label for="disable-osm" class="checkbox-label"> - </label> + <section class="settings-block"> + <h1 data-localize="__MSG_invidiousInstance__">Invidious Instance</h1> + <div class="autocomplete"> + <input id="invidious-instance" type="url" placeholder="https://invidio.us"> </div> </section> - - <section class="options settings_block"> - <h1>Nitter Instance</h1> - <input id="nitter-instance" list="nitter-instance-list" type="url" placeholder="https://nitter.net"> - <datalist id="nitter-instance-list"> - <option value="https://nitter.net"> - <option value="https://nitter.snopyta.org"> - <option value="https://nitter.42l.fr"> - <option value="https://nitter.nixnet.services"> - <option value="https://nitter.13ad.de"> - <option value="https://nitter.pussthecat.org"> - <option value="https://nitter.mastodont.cat"> - <option value="https://nitter.dark.fail"> - <option value="https://nitter.tedomum.net"> - <option value="https://t.maisputain.ovh"> - <option value="http://3nzoldnxplag42gqjs23xvghtzf6t6yzssrtytnntc6ppc7xxuoneoad.onion"> - <option value="http://nitter.l4qlywnpwqsluw65ts7md3khrivpirse744un3x7mlskqauz5pyuzgqd.onion"> - </datalist> - <h1>Invidious Instance</h1> - <input id="invidious-instance" list="invidious-instances-list" type="url" placeholder="https://invidio.us"> - <datalist id="invidious-instances-list"> - <option value="https://invidio.us"> - <option value="https://invidious.snopyta.org"> - <option value="https://invidious.fdn.fr"> - <option value="https://invidious.13ad.de"> - <option value="https://watch.nettohikari.com"> - <option value="https://yewtu.be"> - <option value="https://yt.maisputain.ovh"> - <option value="https://invidious.toot.koeln"> - <option value="https://invidious.ggc-project.de"> - <option value="http://kgg2m7yk5aybusll.onion"> - <option value="http://axqzx4s6s54s32yentfqojs3x5i7faxza6xo3ehd4bzzsg2ii4fv2iid.onion"> - <option value="http://fz253lmuao3strwbfbmx46yu7acac2jz27iwtorgmbqlkurlclmancad.onion"> - <option value="http://qklhadlycap4cnod.onion"> - <option value="http://c7hqkpkpemu6e7emz5b4vyz7idjgdvgaaa3dyimmeojqbgpea3xqjoid.onion"> - <option value="http://mfqczy4mysscub2s.onion"> - </datalist> - <h1>Bibliogram Instance</h1> - <input id="bibliogram-instance" list="bibliogram-instance-list" type="url" placeholder="https://bibliogram.art"> - <datalist id="bibliogram-instance-list"> - <option value="https://bibliogram.art"> - <option value="https://bibliogram.snopyta.org"> - <option value="https://bibliogram.pussthecat.org"> - <option value="https://bibliogram.nixnet.services"> - <option value="https://bibliogram.hamster.dance"> - <option value="https://insta.maisputain.ovh"> - <option value="https://bibliogram.ggc-project.de"> - </datalist> - <h1>OpenStreetMap Instance</h1> - <input id="osm-instance" list="osm-instance-list" type="url" placeholder="https://openstreetmap.org"> - <datalist id="osm-instance-list"> - <option value="https://openstreetmap.org"> - </datalist> + <section class="settings-block"> + <h1 data-localize="__MSG_bibliogramInstance__">Bibliogram Instance</h1> + <div class="autocomplete"> + <input id="bibliogram-instance" type="url" placeholder="https://bibliogram.art"> + </div> </section> + <sections class="settings-block"> + <h1 data-localize="__MSG_osmInstance__">OpenStreetMap Instance</h1> + <div class="autocomplete"> + <input id="osm-instance" type="url" placeholder="https://openstreetmap.org"> + </div> + </sections> </div> <div id="advanced" class="tabcontent"> - <section class="options settings_block"> - <div class="onoffswitch switch" aria-label="Always proxy videos through Invidious"> - <h1>Always proxy videos through Invidious</h1> - <input aria-hidden="true" id="always-proxy" type="checkbox" checked> - <label for="always-proxy" class="checkbox-label"> - </label> - </div> + <section class="settings-block"> + <table class="option" aria-label="Always proxy videos through Invidious"> + <tbody> + <tr> + <td> + <h1 data-localize="__MSG_alwaysProxy__">Always proxy videos through Invidious</h1> + </td> + <td> + <input aria-hidden="true" id="always-proxy" type="checkbox" checked> + <label for="always-proxy" class="checkbox-label"> + </label> + </td> + </tr> + </tbody> + </table> </section> - - <section class="options settings_block"> - <div class="onoffswitch switch" aria-label="Only redirect embedded video to Invidious"> - <h1>Only redirect embedded video to Invidious</h1> - <input aria-hidden="true" id="only-embed" type="checkbox" checked> - <label for="only-embed" class="checkbox-label"> - </label> - </div> + <section class="settings-block"> + <table class="option" aria-label="Only redirect embedded video to Invidious"> + <tbody> + <tr> + <td> + <h1 data-localize="__MSG_onlyEmbeddedVideo__">Only redirect embedded video to Invidious</h1> + </td> + <td> + <input aria-hidden="true" id="only-embed" type="checkbox" checked> + <label for="only-embed" class="checkbox-label"> + </label> + </td> + </tr> + </tbody> + </table> </section> - - <section class="options settings_block"> - <h1>Invidious Video Quality</h1> + <section class="settings-block"> + <h1 data-localize="__MSG_videoQuality__">Invidious Video Quality</h1> <select id="video-quality"> <option value="">Default</option> <option value="hd720">720p</option> @@ -137,48 +149,138 @@ <option value="dash">DASH (Dynamic Adaptive Streaming over HTTP)</option> </select> </section> - - <section class="options settings_block"> - <div class="onoffswitch switch" aria-label="Invidious dark mode aways on"> - <h1>Invidious dark mode always on</h1> - <input aria-hidden="true" id="invidious-dark-mode" type="checkbox" checked> - <label for="invidious-dark-mode" class="checkbox-label"> - </label> - </div> + <section class="settings-block"> + <table class="option" aria-label="Invidious dark mode aways on"> + <tbody> + <tr> + <td> + <h1 data-localize="__MSG_invidiousDarkMode__">Invidious dark mode always on</h1> + </td> + <td> + <input aria-hidden="true" id="invidious-dark-mode" type="checkbox" checked> + <label for="invidious-dark-mode" class="checkbox-label"> + </label> + </td> + </tr> + </tbody> + </table> </section> - - <section class="options settings_block"> - <div class="onoffswitch switch" aria-label="Persist Invidious preferences"> - <h1>Persist Invidious preferences (as cookie)</h1> - <input aria-hidden="true" id="persist-invidious-prefs" type="checkbox" checked> - <label for="persist-invidious-prefs" class="checkbox-label"> - </label> - </div> + <section class="settings-block"> + <h1 data-localize="__MSG_invidiousVolume__">Invidious Volume</h1> + <input id="invidious-volume" name="invidious-volume" type="range" min="0" max="100" step="1"> </section> - - <section class="options settings_block"> - <div class="onoffswitch switch" aria-label="Proactively remove Twitter service worker"> - <h1>Proactively remove Twitter service worker</h1> - <input aria-hidden="true" id="remove-twitter-sw" type="checkbox" checked> - <label for="remove-twitter-sw" class="checkbox-label"> - </label> - </div> + <section class="settings-block"> + <h1 data-localize="__MSG_invidiousPlayerStyle__">Invidious Player Style</h1> + <select id="invidious-player-style"> + <option value="invidious">Invidious</option> + <option value="youtube">YouTube</option> + </select> + </section> + <section class="settings-block"> + <h1 data-localize="__MSG_invidiousSubtitles__">Invidious Subtitles - language codes (comma-separated)</h1> + <input id="invidious-subtitles" name="invidious-subtitles" type="text"> + </section> + <section class="settings-block"> + <table class="option" aria-label="Invidious automatically play video on load"> + <tbody> + <tr> + <td> + <h1 data-localize="__MSG_invidiousAutoplay__">Invidious automatically play video on load</h1> + </td> + <td> + <input aria-hidden="true" id="invidious-autoplay" type="checkbox" checked> + <label for="invidious-autoplay" class="checkbox-label"> + </label> + </td> + </tr> + </tbody> + </table> + </section> + <section class="settings-block"> + <table class="option" aria-label="Persist Invidious preferences"> + <tbody> + <tr> + <td> + <h1 data-localize="__MSG_persistInvidiousPrefs__">Persist Invidious preferences (as cookie)</h1> + </td> + <td> + <input aria-hidden="true" id="persist-invidious-prefs" type="checkbox" checked> + <label for="persist-invidious-prefs" class="checkbox-label"> + </label> + </td> + </tr> + </tbody> + </table> + </section> + <section class="settings-block"> + <table class="option" aria-label="Proactively remove Twitter service worker"> + <tbody> + <tr> + <td> + <h1 data-localize="__MSG_removeTwitterSW__">Proactively remove Twitter service worker</h1> + </td> + <td> + <input aria-hidden="true" id="remove-twitter-sw" type="checkbox" checked> + <label for="remove-twitter-sw" class="checkbox-label"> + </label> + </td> + </tr> + </tbody> + </table> </section> </div> - <div id="whitelist" class="tabcontent"> - <section class="options settings_block"> - <h1>Whitelisted Sites</h1> - <div class="whitelist"> - <input id="new-whitelist-item" type="text" placeholder="URL (RegExp accepted)"> - <button id="add-to-whitelist">Add to Whitelist</button> - </div> + <div id="exceptions" class="tabcontent"> + <section class="settings-block" data-localize="__MSG_exceptionsDescription__"> + <p> + Enter a URL or Regular Expression to be excluded from redirects. + </p> + <p> + All requests for or initiating from a URL that matches your exception + will be excluded from redirects. + </p> + <p> + <b>Note -</b> Supports JavaScript regular expressions, excluding + the enclosing forward slashes. + </p> + </section> + <section class="settings-block"> + <table class="exceptions option"> + <tbody> + <tr> + <td> + <h1 data-localize="__MSG_addException__">Add Exception</h1> + </td> + </tr> + <tr> + <td> + <input id="new-exceptions-item" type="text" placeholder="URL or RegExp"> + </td> + <td> + <input type="radio" id="url" name="type" value="URL" checked> + <label class="radio" for="url">URL</label> + <input type="radio" id="regExp" name="type" value="RegExp"> + <label class="radio" for="regExp">RegExp</label> + </td> + <td> + <button id="add-to-exceptions"> + <svg xmlns='http://www.w3.org/2000/svg' width='512' height='512' viewBox='0 0 512 512'> + <line x1='256' y1='112' x2='256' y2='400' + style='fill:none;stroke:#FFF;stroke-linecap:round;stroke-linejoin:round;stroke-width:32px' /> + <line x1='400' y1='256' x2='112' y2='256' + style='fill:none;stroke:#FFF;stroke-linecap:round;stroke-linejoin:round;stroke-width:32px' /> + </svg> + </button> + </td> + </tr> + </tbody> + </table> </section> - <ul id="whitelist-items"></ul> + <ul id="exceptions-items"></ul> </div> <script src="./options.js"></script> - + <script src="../../assets/javascript/localise.js"></script> </body> -</html> +</html> \ No newline at end of file diff --git a/pages/options/options.js b/pages/options/options.js index 5e25a495..19f9bba7 100644 --- a/pages/options/options.js +++ b/pages/options/options.js @@ -1,5 +1,55 @@ 'use strict'; +const nitterInstances = [ + 'https://nitter.net', + 'https://nitter.snopyta.org', + 'https://nitter.42l.fr', + 'https://nitter.nixnet.services', + 'https://nitter.13ad.de', + 'https://nitter.pussthecat.org', + 'https://nitter.mastodont.cat', + 'https://nitter.dark.fail', + 'https://nitter.tedomum.net', + 'https://t.maisputain.ovh', + 'http://3nzoldnxplag42gqjs23xvghtzf6t6yzssrtytnntc6ppc7xxuoneoad.onion', + 'http://nitter.l4qlywnpwqsluw65ts7md3khrivpirse744un3x7mlskqauz5pyuzgqd.onion' +]; +const invidiousInstances = [ + 'https://invidio.us', + 'https://invidious.snopyta.org', + 'https://invidious.fdn.fr', + 'https://invidious.13ad.de', + 'https://watch.nettohikari.com', + 'https://yewtu.be', + 'https://yt.maisputain.ovh', + 'https://invidious.toot.koeln', + 'https://invidious.ggc-project.de', + 'http://kgg2m7yk5aybusll.onion', + 'http://axqzx4s6s54s32yentfqojs3x5i7faxza6xo3ehd4bzzsg2ii4fv2iid.onion', + 'http://fz253lmuao3strwbfbmx46yu7acac2jz27iwtorgmbqlkurlclmancad.onion', + 'http://qklhadlycap4cnod.onion', + 'http://c7hqkpkpemu6e7emz5b4vyz7idjgdvgaaa3dyimmeojqbgpea3xqjoid.onion', + 'http://mfqczy4mysscub2s.onion' +]; +const bibliogramInstances = [ + 'https://bibliogram.art', + 'https://bibliogram.snopyta.org', + 'https://bibliogram.pussthecat.org', + 'https://bibliogram.nixnet.services', + 'https://bibliogram.hamster.dance', + 'https://insta.maisputain.ovh', + 'https://bibliogram.ggc-project.de' +]; +const osmInstances = [ + 'https://openstreetmap.org' +]; +const autocompletes = [ + { id: 'nitter-instance', instances: nitterInstances }, + { id: 'invidious-instance', instances: invidiousInstances }, + { id: 'bibliogram-instance', instances: bibliogramInstances }, + { id: 'osm-instance', instances: osmInstances } +]; + let nitterInstance = document.getElementById('nitter-instance'); let invidiousInstance = document.getElementById('invidious-instance'); let bibliogramInstance = document.getElementById('bibliogram-instance'); @@ -14,24 +64,35 @@ let videoQuality = document.getElementById('video-quality'); let removeTwitterSW = document.getElementById('remove-twitter-sw'); let invidiousDarkMode = document.getElementById('invidious-dark-mode'); let persistInvidiousPrefs = document.getElementById('persist-invidious-prefs'); -let whitelist; +let invidiousVolume = document.getElementById('invidious-volume'); +let invidiousPlayerStyle = document.getElementById('invidious-player-style'); +let invidiousSubtitles = document.getElementById('invidious-subtitles'); +let invidiousAutoplay = document.getElementById('invidious-autoplay'); +let exceptions; window.browser = window.browser || window.chrome; -function prependWhitelistItem(item, index) { +function prependExceptionsItem(item, index) { const li = document.createElement('li'); li.appendChild(document.createTextNode(item.toString())); const button = document.createElement('button'); - button.appendChild(document.createTextNode('X')); + li.appendChild(button); + document.getElementById('exceptions-items').prepend(li); + const svg = + `<svg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 512 512'> + <line x1='368' y1='368' x2='144' y2='144' + style='fill:none;stroke:#FFF;stroke-linecap:round;stroke-linejoin:round;stroke-width:32px' /> + <line x1='368' y1='144' x2='144' y2='368' + style='fill:none;stroke:#FFF;stroke-linecap:round;stroke-linejoin:round;stroke-width:32px' /> + </svg>`; + button.innerHTML = svg; button.addEventListener('click', () => { - li.remove(); - whitelist.splice(index, 1); + exceptions.splice(index, 1); browser.storage.sync.set({ - whitelist: whitelist + exceptions: exceptions }); + li.remove(); }); - li.appendChild(button); - document.getElementById('whitelist-items').prepend(li); } browser.storage.sync.get( @@ -48,9 +109,13 @@ browser.storage.sync.get( 'onlyEmbeddedVideo', 'videoQuality', 'removeTwitterSW', - 'whitelist', 'invidiousDarkMode', - 'persistInvidiousPrefs' + 'persistInvidiousPrefs', + 'invidiousVolume', + 'invidiousPlayerStyle', + 'invidiousSubtitles', + 'invidiousAutoplay', + 'exceptions' ], result => { nitterInstance.value = result.nitterInstance || ''; @@ -67,8 +132,12 @@ browser.storage.sync.get( removeTwitterSW.checked = !result.removeTwitterSW; invidiousDarkMode.checked = result.invidiousDarkMode; persistInvidiousPrefs.checked = result.persistInvidiousPrefs; - whitelist = result.whitelist || []; - whitelist.forEach(prependWhitelistItem); + exceptions = result.exceptions || []; + exceptions.forEach(prependExceptionsItem); + invidiousVolume.value = result.invidiousVolume; + invidiousPlayerStyle.value = result.invidiousPlayerStyle; + invidiousSubtitles.value = result.invidiousSubtitles || ''; + invidiousAutoplay.checked = !result.invidiousAutoplay; } ); @@ -92,22 +161,27 @@ document.getElementById('general-tab').addEventListener( document.getElementById('advanced-tab').addEventListener( 'click', openTab.bind(null, 'advanced') ); -document.getElementById('whitelist-tab').addEventListener( - 'click', openTab.bind(null, 'whitelist') +document.getElementById('exceptions-tab').addEventListener( + 'click', openTab.bind(null, 'exceptions') ); document.getElementById('general-tab').click(); -function addToWhitelist() { - const input = document.getElementById('new-whitelist-item'); +function addToExceptions() { + const input = document.getElementById('new-exceptions-item'); + const type = document.querySelector('input[name="type"]:checked').value; if (input.value) { try { + let value = input.value; new RegExp(input.value); - const index = whitelist.push(input.value); - prependWhitelistItem(input.value, index); + if (type === 'URL') { + value = value.replace(/[-\/\\^$*+?.()|[\]{}]/g, '\\$&'); + } + exceptions.push(value); browser.storage.sync.set({ - whitelist: whitelist + exceptions: exceptions }); + prependExceptionsItem(value, exceptions.indexOf(value)); input.value = ''; } catch (error) { input.setCustomValidity('Invalid RegExp'); @@ -117,8 +191,8 @@ function addToWhitelist() { } } -document.getElementById('add-to-whitelist').addEventListener( - 'click', addToWhitelist +document.getElementById('add-to-exceptions').addEventListener( + 'click', addToExceptions ); function debounce(func, wait, immediate) { @@ -231,3 +305,112 @@ invidiousDarkMode.addEventListener('change', event => { persistInvidiousPrefs.addEventListener('change', event => { browser.storage.sync.set({ persistInvidiousPrefs: event.target.checked }); }); + +let invidiousVolumeChange = debounce(() => { + if (invidiousInstance.checkValidity()) { + browser.storage.sync.set({ + invidiousVolume: invidiousVolume.value + }); + } +}, 500); +invidiousVolume.addEventListener('input', invidiousVolumeChange); + +invidiousPlayerStyle.addEventListener('change', event => { + browser.storage.sync.set({ + invidiousPlayerStyle: event.target.options[invidiousPlayerStyle.selectedIndex].value + }); +}); + +let invidiousSubtitlesChange = debounce(() => { + if (invidiousInstance.checkValidity()) { + browser.storage.sync.set({ + invidiousSubtitles: invidiousSubtitles.value + }); + } +}, 500); +invidiousSubtitles.addEventListener('input', invidiousSubtitlesChange); + +invidiousAutoplay.addEventListener('change', event => { + browser.storage.sync.set({ invidiousAutoplay: !event.target.checked }); +}); + + +function autocomplete(input, list) { + let currentFocus; + input.addEventListener("focus", (e) => { + showOptions(e); + }); + input.addEventListener("input", (e) => { + const val = e.target.value; + if (!val) { return false; } + currentFocus = -1; + showOptions(e); + }); + input.addEventListener("keydown", function (e) { + let x = document.getElementById(this.id + "autocomplete-list"); + if (x) x = x.getElementsByTagName("div"); + if (e.keyCode == 40) { + currentFocus++; + addActive(x); + } else if (e.keyCode == 38) { + currentFocus--; + addActive(x); + } else if (e.keyCode == 13) { + e.preventDefault(); + if (currentFocus > -1) { + if (x) x[currentFocus].click(); + } + } + }); + function showOptions(e) { + let a, b, i, val = e.target.value; + closeAllLists(); + a = document.createElement("div"); + a.setAttribute("id", e.target.id + "autocomplete-list"); + a.setAttribute("class", "autocomplete-items"); + e.target.parentNode.appendChild(a); + for (i = 0; i < list.length; i++) { + if (list[i].toLowerCase().indexOf(val.toLowerCase()) > -1) { + b = document.createElement("div"); + b.innerHTML = "<strong>" + list[i].substr(0, val.length) + "</strong>"; + b.innerHTML += list[i].substr(val.length); + b.innerHTML += "<input type='hidden' value='" + list[i] + "'>"; + b.addEventListener("click", function (e) { + input.value = e.target.getElementsByTagName("input")[0].value; + input.dispatchEvent(new Event('input')); + closeAllLists(); + }); + a.appendChild(b); + } + } + } + function addActive(x) { + if (!x) return false; + removeActive(x); + if (currentFocus >= x.length) currentFocus = 0; + if (currentFocus < 0) currentFocus = (x.length - 1); + x[currentFocus].classList.add("autocomplete-active"); + } + function removeActive(x) { + for (let i = 0; i < x.length; i++) { + x[i].classList.remove("autocomplete-active"); + } + } + function closeAllLists(elmnt) { + let x = document.getElementsByClassName("autocomplete-items"); + for (let i = 0; i < x.length; i++) { + if (elmnt != x[i] && elmnt != input) { + x[i].parentNode.removeChild(x[i]); + } + } + } + document.addEventListener("click", (e) => { + if (!autocompletes.find(element => element.id === e.target.id)) { + closeAllLists(e.target); + } + }); +} + +autocompletes.forEach((value) => { + autocomplete(document.getElementById(value.id), value.instances); +}) diff --git a/pages/popup/popup.html b/pages/popup/popup.html index 45a88052..1ce7eb01 100644 --- a/pages/popup/popup.html +++ b/pages/popup/popup.html @@ -11,107 +11,88 @@ <body class="popup"> <header> <div class="logo-container"> - <img src="../../images/icon128.png" alt="Privacy Redirect logo"> - <h1><span class="privacy">Privacy</span><br>Redirect</h1> + <img src="../../assets/images/icon128.png" alt="Privacy Redirect logo"> + <h1><span data-localize="__MSG_privacy__" class="privacy">Privacy</span><br><span + data-localize="__MSG_redirect__">Redirect</span></h1> </div> <div class="version"> <span>Version: <span id="version"></span></span> </div> </header> - <section class="options settings_block"> - <div class="onoffswitch switch" aria-label="Toggle Nitter redirects"> - <h1>Nitter Redirects</h1> - <input aria-hidden="true" id="disable-nitter" type="checkbox" checked> - <label for="disable-nitter" class="checkbox-label"> - </label> - </div> + <section class="settings-block"> + <table class="option" aria-label="Toggle Nitter redirects"> + <tbody> + <tr> + <td> + <h1 data-localize="__MSG_disableNitter__">Nitter Redirects</h1> + </td> + <td> + <input aria-hidden="true" id="disable-nitter" type="checkbox" checked> + <label for="disable-nitter" class="checkbox-label"></label> + </td> + </tr> + </tbody> + </table> </section> - <section class="options settings_block"> - <div class="onoffswitch switch" aria-label="Toggle Invidious redirects"> - <h1>Invidious Redirects</h1> - <input aria-hidden="true" id="disable-invidious" type="checkbox" checked> - <label for="disable-invidious" class="checkbox-label"> - </label> - </div> + <section class="settings-block"> + <table class="option" aria-label="Toggle Invidious redirects"> + <tbody> + <tr> + <td> + <h1 data-localize="__MSG_disableInvidious__">Invidious Redirects</h1> + </td> + <td> + <input aria-hidden="true" id="disable-invidious" type="checkbox" checked> + <label for="disable-invidious" class="checkbox-label"> + </label> + </td> + </tr> + </tbody> + </table> </section> - <section class="options settings_block"> - <div class="onoffswitch switch" aria-label="Toggle Bibliogram redirects"> - <h1>Bibliogram Redirects</h1> - <input aria-hidden="true" id="disable-bibliogram" type="checkbox" checked> - <label for="disable-bibliogram" class="checkbox-label"> - </label> - </div> + <section class="settings-block"> + <table class="option" aria-label="Toggle Bibliogram redirects"> + <tbody> + <tr> + <td> + <h1 data-localize="__MSG_disableBibliogram__">Bibliogram Redirects</h1> + </td> + <td> + <input aria-hidden="true" id="disable-bibliogram" type="checkbox" checked> + <label for="disable-bibliogram" class="checkbox-label"> + </label> + </td> + </tr> + </tbody> + </table> </section> - <section class="options settings_block"> - <div class="onoffswitch switch" aria-label="Toggle OpenStreetMap redirects"> - <h1>OpenStreetMap Redirects</h1> - <input aria-hidden="true" id="disable-osm" type="checkbox" checked> - <label for="disable-osm" class="checkbox-label"> - </label> - </div> + <section class="settings-block"> + <table class="option" aria-label="Toggle OpenStreetMap redirects"> + <tbody> + <tr> + <td> + <h1 data-localize="__MSG_disableOsm__">OpenStreetMap Redirects</h1> + </td> + <td> + <input aria-hidden="true" id="disable-osm" type="checkbox" checked> + <label for="disable-osm" class="checkbox-label"> + </label> + </td> + </tr> + </tbody> + </table> </section> - <section class="options settings_block"> - <h1>Nitter Instance</h1> - <input id="nitter-instance" list="nitter-instance-list" type="url" placeholder="https://nitter.net"> - <datalist id="nitter-instance-list"> - <option value="https://nitter.net"> - <option value="https://nitter.snopyta.org"> - <option value="https://nitter.42l.fr"> - <option value="https://nitter.nixnet.services"> - <option value="https://nitter.13ad.de"> - <option value="https://nitter.pussthecat.org"> - <option value="https://nitter.mastodont.cat"> - <option value="https://nitter.dark.fail"> - <option value="https://nitter.tedomum.net"> - <option value="https://t.maisputain.ovh"> - <option value="http://3nzoldnxplag42gqjs23xvghtzf6t6yzssrtytnntc6ppc7xxuoneoad.onion"> - <option value="http://nitter.l4qlywnpwqsluw65ts7md3khrivpirse744un3x7mlskqauz5pyuzgqd.onion"> - </datalist> - <h1>Invidious Instance</h1> - <input id="invidious-instance" list="invidious-instances-list" type="url" placeholder="https://invidio.us"> - <datalist id="invidious-instances-list"> - <option value="https://invidio.us"> - <option value="https://invidious.snopyta.org"> - <option value="https://invidious.fdn.fr"> - <option value="https://invidious.13ad.de"> - <option value="https://watch.nettohikari.com"> - <option value="https://yewtu.be"> - <option value="https://yt.maisputain.ovh"> - <option value="https://invidious.toot.koeln"> - <option value="https://invidious.ggc-project.de"> - <option value="http://kgg2m7yk5aybusll.onion"> - <option value="http://axqzx4s6s54s32yentfqojs3x5i7faxza6xo3ehd4bzzsg2ii4fv2iid.onion"> - <option value="http://fz253lmuao3strwbfbmx46yu7acac2jz27iwtorgmbqlkurlclmancad.onion"> - <option value="http://qklhadlycap4cnod.onion"> - <option value="http://c7hqkpkpemu6e7emz5b4vyz7idjgdvgaaa3dyimmeojqbgpea3xqjoid.onion"> - <option value="http://mfqczy4mysscub2s.onion"> - </datalist> - <h1>Bibliogram Instance</h1> - <input id="bibliogram-instance" list="bibliogram-instance-list" type="url" placeholder="https://bibliogram.art"> - <datalist id="bibliogram-instance-list"> - <option value="https://bibliogram.art"> - <option value="https://bibliogram.snopyta.org"> - <option value="https://bibliogram.pussthecat.org"> - <option value="https://bibliogram.nixnet.services"> - <option value="https://bibliogram.hamster.dance"> - <option value="https://insta.maisputain.ovh"> - <option value="https://bibliogram.ggc-project.de"> - </datalist> - <h1>OpenStreetMap Instance</h1> - <input id="osm-instance" list="osm-instance-list" type="url" placeholder="https://openstreetmap.org"> - <datalist id="osm-instance-list"> - <option value="https://openstreetmap.org"> - </datalist> + <section class="settings-block"> </section> <footer> <a class="button" id="more-options"> - <span>More Options </span> + <span data-localize="__MSG_moreOptions__">More Options </span> <svg xmlns='http://www.w3.org/2000/svg' width='512' height='512' viewBox='0 0 512 512'> <path d='M384,224V408a40,40,0,0,1-40,40H104a40,40,0,0,1-40-40V168a40,40,0,0,1,40-40H271.48' style='fill:none;stroke:inherit;stroke-linecap:round;stroke-linejoin:round;stroke-width:32px' /> @@ -124,7 +105,7 @@ </footer> <script src="./popup.js"></script> - + <script src="../../assets/javascript/localise.js"></script> </body> </html> \ No newline at end of file diff --git a/pages/popup/popup.js b/pages/popup/popup.js index 66842c75..2e8ec491 100644 --- a/pages/popup/popup.js +++ b/pages/popup/popup.js @@ -1,9 +1,5 @@ 'use strict'; -let nitterInstance = document.querySelector('#nitter-instance'); -let invidiousInstance = document.querySelector('#invidious-instance'); -let bibliogramInstance = document.querySelector('#bibliogram-instance'); -let osmInstance = document.querySelector('#osm-instance'); let disableNitter = document.querySelector('#disable-nitter'); let disableInvidious = document.querySelector('#disable-invidious'); let disableBibliogram = document.querySelector('#disable-bibliogram'); @@ -14,20 +10,12 @@ window.browser = window.browser || window.chrome; browser.storage.sync.get( [ - 'nitterInstance', - 'invidiousInstance', - 'bibliogramInstance', - 'osmInstance', 'disableNitter', 'disableInvidious', 'disableBibliogram', 'disableOsm' ], result => { - nitterInstance.value = result.nitterInstance || ''; - invidiousInstance.value = result.invidiousInstance || ''; - bibliogramInstance.value = result.bibliogramInstance || ''; - osmInstance.value = result.osmInstance || ''; disableNitter.checked = !result.disableNitter; disableInvidious.checked = !result.disableInvidious; disableBibliogram.checked = !result.disableBibliogram; @@ -37,75 +25,6 @@ browser.storage.sync.get( version.textContent = browser.runtime.getManifest().version; -function debounce(func, wait, immediate) { - let timeout; - return () => { - let context = this, args = arguments; - let later = () => { - timeout = null; - if (!immediate) func.apply(context, args); - }; - let callNow = immediate && !timeout; - clearTimeout(timeout); - timeout = setTimeout(later, wait); - if (callNow) func.apply(context, args); - }; -}; - -function parseURL(urlString) { - if (urlString) { - try { - const url = new URL(urlString); - if (url.username && url.password) { - return `${url.protocol}//${url.username}:${url.password}@${url.host}` - } else { - return url.origin; - } - } catch (error) { - console.log(error); - return ''; - } - } else { - return ''; - } -} - -let nitterInstanceChange = debounce(() => { - if (nitterInstance.checkValidity()) { - browser.storage.sync.set({ - nitterInstance: parseURL(nitterInstance.value) - }); - } -}, 500); -nitterInstance.addEventListener('input', nitterInstanceChange); - -let invidiousInstanceChange = debounce(() => { - if (invidiousInstance.checkValidity()) { - browser.storage.sync.set({ - invidiousInstance: parseURL(invidiousInstance.value) - }); - } -}, 500); -invidiousInstance.addEventListener('input', invidiousInstanceChange); - -let bibliogramInstanceChange = debounce(() => { - if (bibliogramInstance.checkValidity()) { - browser.storage.sync.set({ - bibliogramInstance: parseURL(bibliogramInstance.value) - }); - } -}, 500); -bibliogramInstance.addEventListener('input', bibliogramInstanceChange); - -let osmInstanceChange = debounce(() => { - if (osmInstance.checkValidity()) { - browser.storage.sync.set({ - osmInstance: parseURL(osmInstance.value) - }); - } -}, 500); -osmInstance.addEventListener('input', osmInstanceChange); - disableNitter.addEventListener('change', event => { browser.storage.sync.set({ disableNitter: !event.target.checked }); }); diff --git a/pages/styles.css b/pages/styles.css index d9a7e5df..dd88a65c 100644 --- a/pages/styles.css +++ b/pages/styles.css @@ -75,7 +75,7 @@ header .version { h1 { font-size: 14px; - margin: var(--space) auto; + margin: 7px auto; } i { @@ -122,7 +122,18 @@ input[type=checkbox] { opacity: 0; } +input[type=radio] { + appearance: radio; + -moz-appearance: radio; + -webkit-appearance: radio; +} + +input[type=radio]:checked+label { + background: transparent; +} + .checkbox-label { + margin-left: 5px; background: grey; border-radius: 25px; color: var(--text-main); @@ -156,12 +167,12 @@ input:checked+label:after { transform: translateX(-100%); } -.settings_block { +.settings-block { display: block; - padding: 10px 1em 1em 1em; + padding: 5px 10px 5px 10px; } -.settings_block h1 { +.settings-block h1 { float: left; } @@ -243,32 +254,37 @@ input:invalid { min-height: 510px; } -div.whitelist { +div.exceptions { clear: left; } -div.whitelist > input { +div.exceptions > input { width: 240px; float: left; } -#add-to-whitelist { - width: 120px; +#add-to-exceptions { float: right; border: var(--active) solid 1px; background-color: var(--active); color: var(--text-main); font-weight: bold; cursor: pointer; - border-radius: 25px; + border-radius: 50%; + padding: 1px 1px 0px 1px; + margin-right: 5px; +} + +#add-to-exceptions svg { + height: 20px; + width: 20px; } ul { padding: 0; list-style-type: none; color: var(--text-main); - margin-right: 20px; - margin-left: 20px; + margin: 20px 20px 0 20px; } li { @@ -276,7 +292,7 @@ li { padding: 20px 0px 20px 20px; } -#whitelist-items button { +#exceptions-items button { float: right; margin-right: -5px; border: var(--active) solid 1px; @@ -285,6 +301,7 @@ li { font-weight: bold; cursor: pointer; border-radius: 50%; + padding: 2px 2px 0px 2px; } .button svg { @@ -292,6 +309,109 @@ li { width: 18px; } +.autocomplete { + position: relative; + display: inline-block; + width: 100%; +} + +.autocomplete input { + background: url(../assets/images/chevron-down.svg) right no-repeat; +} + +.autocomplete-items { + position: absolute; + border: 1px solid var(--dark); + border-bottom: none; + border-top: none; + z-index: 99; + top: 100%; + left: 0; + right: 0; + overflow: auto; + max-height: 175px; +} + +.autocomplete-items div { + padding: 10px; + cursor: pointer; + background-color: var(--darker); + border-bottom: 1px solid var(--dark); +} + +.autocomplete-items div:hover { + background-color: var(--active); +} + +.autocomplete-active { + background-color: var(--active); + color: var(--lighter); +} + +.option { + width: 100%; +} + +.option td { + vertical-align: middle; +} + +input[type=range] { + -webkit-appearance: none; + margin: 18px 0; + width: 100%; +} + +input[type=range]:focus { + outline: none; +} + +input[type=range]::-webkit-slider-runnable-track { + width: 100%; + height: 8.4px; + cursor: pointer; + box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d; + background: var(--light); + border-radius: 1.3px; + border: 0.2px solid #010101; +} + +input[type=range]::-webkit-slider-thumb { + box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d; + border: 1px solid #000000; + height: 36px; + width: 16px; + border-radius: 3px; + background: var(--active); + cursor: pointer; + -webkit-appearance: none; + margin-top: -14px; +} + +input[type=range]:focus::-webkit-slider-runnable-track { + background: var(--light); +} + +input[type=range]::-moz-range-track { + width: 100%; + height: 8.4px; + cursor: pointer; + box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d; + background: var(--light); + border-radius: 1.3px; + border: 0.2px solid #010101; +} + +input[type=range]::-moz-range-thumb { + box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d; + border: 1px solid #000000; + height: 36px; + width: 16px; + border-radius: 3px; + background: var(--active); + cursor: pointer; +} + @media (prefers-color-scheme: dark) { body.popup, header, h1, input, select, div.tabcontent, button.tablinks.active { @@ -311,7 +431,6 @@ li { color: var(--text-main); opacity: 0.7; } - } @media (prefers-color-scheme: light) { @@ -347,4 +466,8 @@ li { button.tablinks.active { border-bottom: solid 1px var(--lighter); } + + .autocomplete-items div { + background-color: var(--light); + } } diff --git a/web-ext-config.js b/web-ext-config.js index 96c7c87c..bfaa024d 100644 --- a/web-ext-config.js +++ b/web-ext-config.js @@ -2,6 +2,8 @@ module.exports = { ignoreFiles: [ 'images/Screen*.png', 'images/small-tile.png', - 'buy-me-a-coffee.png' + 'buy-me-a-coffee.png', + 'logo*.png', + '*-badge.png' ], }; |
