Adding more settings and combining theme in the general page #80

This commit is contained in:
ManeraKai 2022-03-05 11:44:59 +03:00
parent a85f0defa6
commit 5619a96b4a
No known key found for this signature in database
GPG Key ID: 5ABC31FFD562E337
13 changed files with 222 additions and 156 deletions

View File

@ -9,6 +9,22 @@ function setAlwaysUsePreferred(val) {
console.log("alwaysUsePreferred: ", alwaysUsePreferred) console.log("alwaysUsePreferred: ", alwaysUsePreferred)
} }
let theme;
const getTheme = () => theme;
function setTheme(val) {
theme = val
browser.storage.local.set({ theme });
console.log("theme: ", theme)
}
let applyThemeToSites;
const getApplyThemeToSites = () => applyThemeToSites;
function setApplyThemeToSites(val) {
applyThemeToSites = val;
browser.storage.local.set({ applyThemeToSites })
console.log("applyThemeToSites: ", applyThemeToSites)
}
let exceptions = { let exceptions = {
"url": [], "url": [],
"regex": [], "regex": [],
@ -36,11 +52,17 @@ async function init() {
resolve => browser.storage.local.get( resolve => browser.storage.local.get(
[ [
"exceptions", "exceptions",
"alwaysUsePreferred" "alwaysUsePreferred",
"theme",
"applyThemeToSites",
], ],
r => { // r = result r => { // r = result
if (r.exceptions) exceptions = r.exceptions; if (r.exceptions) exceptions = r.exceptions;
alwaysUsePreferred = r.alwaysUsePreferred ?? false; alwaysUsePreferred = r.alwaysUsePreferred ?? false;
theme = r.them ?? "DEFAULT"
applyThemeToSites = r.applyThemeToSites ?? false;
resolve(); resolve();
} }
) )
@ -54,6 +76,12 @@ export default {
getAlwaysUsePreferred, getAlwaysUsePreferred,
setAlwaysUsePreferred, setAlwaysUsePreferred,
getApplyThemeToSites,
setApplyThemeToSites,
getTheme,
setTheme,
isException, isException,
init, init,
} }

View File

@ -182,6 +182,35 @@ function changeInstance(url) {
return `${randomInstance}${url.pathname}${url.search}`; return `${randomInstance}${url.pathname}${url.search}`;
} }
function isNitter(url, type) {
let protocolHost = `${url.protocol}//${url.host}`;
if (type !== "main_frame" && type !== "sub_frame") return false;
return [
...redirects.nitter.normal,
...redirects.nitter.tor,
...nitterNormalCustomRedirects,
...nitterTorCustomRedirects,
].includes(protocolHost);
}
let theme;
let applyThemeToSites;
function initNitterCookies(url) {
let protocolHost = `${url.protocol}//${url.host}`;
let themeValue;
if (theme == 'light') themeValue = 'Twitter';
if (theme == 'dark') themeValue = 'Twitter Dark';
if (applyThemeToSites && themeValue != 'DEFAULT')
browser.cookies.set({
url: protocolHost,
name: "theme",
value: themeValue
})
}
async function init() { async function init() {
return new Promise((resolve) => { return new Promise((resolve) => {
fetch('/instances/data.json').then(response => response.text()).then(data => { fetch('/instances/data.json').then(response => response.text()).then(data => {
@ -189,31 +218,42 @@ async function init() {
browser.storage.local.get( browser.storage.local.get(
[ [
"disableTwitter", "disableTwitter",
"twitterRedirects", "twitterRedirects",
"theme",
"applyThemeToSites",
"nitterNormalRedirectsChecks", "nitterNormalRedirectsChecks",
"nitterNormalCustomRedirects", "nitterNormalCustomRedirects",
"nitterTorRedirectsChecks", "nitterTorRedirectsChecks",
"nitterTorCustomRedirects", "nitterTorCustomRedirects",
"twitterProtocol", "twitterProtocol",
"alwaysUsePreferred", "alwaysUsePreferred",
], ],
(result) => { r => {
disable = result.disableTwitter ?? false; disable = r.disableTwitter ?? false;
protocol = result.twitterProtocol ?? "normal"; protocol = r.twitterProtocol ?? "normal";
bypassWatchOnTwitter = result.bypassWatchOnTwitter ?? true; bypassWatchOnTwitter = r.bypassWatchOnTwitter ?? true;
alwaysUsePreferred = result.alwaysUsePreferred ?? true; alwaysUsePreferred = r.alwaysUsePreferred ?? true;
theme = r.theme ?? 'DEFAULT';
applyThemeToSites = r.applyThemeToSites ?? false;
redirects.nitter = dataJson.nitter; redirects.nitter = dataJson.nitter;
if (result.twitterRedirects) redirects = result.twitterRedirects; if (r.twitterRedirects) redirects = r.twitterRedirects;
nitterNormalRedirectsChecks = result.nitterNormalRedirectsChecks ?? [...redirects.nitter.normal]; nitterNormalRedirectsChecks = r.nitterNormalRedirectsChecks ?? [...redirects.nitter.normal];
nitterNormalCustomRedirects = result.nitterNormalCustomRedirects ?? []; nitterNormalCustomRedirects = r.nitterNormalCustomRedirects ?? [];
nitterTorRedirectsChecks = result.nitterTorRedirectsChecks ?? [...redirects.nitter.tor]; nitterTorRedirectsChecks = r.nitterTorRedirectsChecks ?? [...redirects.nitter.tor];
nitterTorCustomRedirects = result.nitterTorCustomRedirects ?? []; nitterTorCustomRedirects = r.nitterTorCustomRedirects ?? [];
resolve(); resolve();
} }
@ -248,6 +288,9 @@ export default {
getProtocol, getProtocol,
setProtocol, setProtocol,
isNitter,
initNitterCookies,
redirect, redirect,
init, init,
changeInstance, changeInstance,

View File

@ -19,7 +19,7 @@ browser.storage.local.get(
"youtubeVolume", "youtubeVolume",
"youtubeAutoplay", "youtubeAutoplay",
"OnlyEmbeddedVideo", "OnlyEmbeddedVideo",
"youtubeTheme", "theme",
"invidiousVideoQuality", "invidiousVideoQuality",
], (result) => { ], (result) => {
let prefs = getCookie(); let prefs = getCookie();
@ -31,8 +31,8 @@ browser.storage.local.get(
if (result.invidiousVideoQuality !== undefined && prefs.quality !== result.invidiousVideoQuality) if (result.invidiousVideoQuality !== undefined && prefs.quality !== result.invidiousVideoQuality)
prefs.quality = result.invidiousVideoQuality; prefs.quality = result.invidiousVideoQuality;
if (result.youtubeTheme !== undefined && prefs.dark_mode !== result.youtubeTheme) if (result.theme !== undefined && prefs.dark_mode !== result.theme)
prefs.dark_mode = result.youtubeTheme; prefs.dark_mode = result.theme;
if (result.youtubeVolume !== undefined && prefs.volume !== result.youtubeVolume) if (result.youtubeVolume !== undefined && prefs.volume !== result.youtubeVolume)
prefs.volume = result.youtubeVolume; prefs.volume = result.youtubeVolume;

View File

@ -2,28 +2,33 @@ window.browser = window.browser || window.chrome;
browser.storage.local.get( browser.storage.local.get(
[ [
"youtubeTheme", "theme",
"applyThemeToSites",
"youtubeVolume", "youtubeVolume",
"youtubeAutoplay" "youtubeAutoplay"
], ],
res => { r => {
if ( let applyThemeToSites = r.applyThemeToSites ?? false;
res.youtubeTheme != "DEFAULT" &&
localStorage.getItem("theme") != res.youtubeTheme
)
localStorage.setItem("theme", res.youtubeTheme);
if ( if (
res.youtubeVolume != "--" && applyThemeToSites &&
localStorage.getItem("volume") != res.youtubeVolume r.theme != "DEFAULT" &&
localStorage.getItem("theme") != r.theme
) )
localStorage.setItem("volume", res.youtubeVolume / 100); localStorage.setItem("theme", r.theme);
if ( if (
res.youtubeAutoplay != "DEFAULT" && r.youtubeVolume != "--" &&
localStorage.getItem("playerAutoPlay") != res.youtubeAutoplay localStorage.getItem("volume") != r.youtubeVolume
) )
localStorage.setItem("playerAutoPlay", res.youtubeAutoplay); localStorage.setItem("volume", r.youtubeVolume / 100);
if (
r.youtubeAutoplay != "DEFAULT" &&
localStorage.getItem("playerAutoPlay") != r.youtubeAutoplay
)
localStorage.setItem("playerAutoPlay", r.youtubeAutoplay);
} }
) )

View File

@ -2,7 +2,7 @@ window.browser = window.browser || window.chrome;
browser.storage.local.get( browser.storage.local.get(
[ [
"youtubeTheme", "theme",
"youtubeAutoplay" "youtubeAutoplay"
], ],
res => { res => {
@ -13,8 +13,8 @@ browser.storage.local.get(
) ?? {}; ) ?? {};
let oldPrefs = { ...prefs }; let oldPrefs = { ...prefs };
if (res.youtubeTheme == 'dark') prefs.darkMode = true; if (res.theme == 'dark') prefs.darkMode = true;
if (res.youtubeTheme == 'light') prefs.darkMode = false; if (res.theme == 'light') prefs.darkMode = false;
if (res.youtubeAutoplay != "DEFAULT") prefs.playerAutoplay = res.youtubeAutoplay; if (res.youtubeAutoplay != "DEFAULT") prefs.playerAutoplay = res.youtubeAutoplay;

View File

@ -215,7 +215,7 @@ let theme;
const getTheme = () => theme; const getTheme = () => theme;
function setTheme(val) { function setTheme(val) {
theme = val; theme = val;
browser.storage.local.set({ youtubeTheme: theme }) browser.storage.local.set({ theme: theme })
console.log("theme: ", theme) console.log("theme: ", theme)
} }
@ -495,29 +495,10 @@ function changeInstance(url) {
return `${randomInstance}${url.pathname}${url.search}`; return `${randomInstance}${url.pathname}${url.search}`;
} }
function isPipedorInvidious(url, type) { function isPipedorInvidious(url, type, frontend) {
let protocolHost = `${url.protocol}//${url.host}`; let protocolHost = `${url.protocol}//${url.host}`;
return (type === "main_frame" || type === "sub_frame") && [
...redirects.invidious.normal,
...redirects.invidious.tor,
...invidiousNormalCustomRedirects,
...invidiousTorCustomRedirects,
...redirects.piped.normal, if (type !== "main_frame" && type !== "sub_frame") return false;
...redirects.piped.tor,
...pipedNormalCustomRedirects,
...pipedTorCustomRedirects,
].includes(protocolHost);
}
function isUrlPipedorInvidious(url, frontend) {
try {
url = new URL(url);
}
catch (error) {
return
}
let protocolHost = `${url.protocol}//${url.host}`;
if (frontend == 'invidious') if (frontend == 'invidious')
return [ return [
@ -556,10 +537,13 @@ function isUrlPipedorInvidious(url, frontend) {
].includes(protocolHost); ].includes(protocolHost);
} }
let applyThemeToSites;
function addUrlParams(url) { function addUrlParams(url) {
let protocolHost = `${url.protocol}//${url.host}`; let protocolHost = `${url.protocol}//${url.host}`;
let isChanged = false; let isChanged = false;
console.log("Adding URL Params", protocolHost); console.log("Adding URL Params", protocolHost);
console.log("searchParams", url.searchParams);
let oldParams = { ...url.searchParams };
if ( if (
[ [
...redirects.invidious.normal, ...redirects.invidious.normal,
@ -568,8 +552,10 @@ function addUrlParams(url) {
...invidiousTorCustomRedirects ...invidiousTorCustomRedirects
].includes(protocolHost) ].includes(protocolHost)
) { ) {
if (!url.searchParams.has("dark_mode") && theme != "DEFAULT") {
url.searchParams.append("dark_mode", theme); if (applyThemeToSites && !url.searchParams.has("dark_mode") && theme != 'DEFAULT') {
if (theme == 'dark') url.searchParams.append("dark_mode", true);
else if (theme == 'light') url.searchParams.append("dark_mode", false);
isChanged = true; isChanged = true;
} }
@ -602,8 +588,8 @@ function addUrlParams(url) {
url.searchParams.append("subtitles", invidiousSubtitles); url.searchParams.append("subtitles", invidiousSubtitles);
isChanged = true; isChanged = true;
} }
}
} else if ( else if (
[ [
...redirects.piped.normal, ...redirects.piped.normal,
...redirects.piped.tor, ...redirects.piped.tor,
@ -626,12 +612,13 @@ function addUrlParams(url) {
url.searchParams.append("playerAutoPlay", autoplay); url.searchParams.append("playerAutoPlay", autoplay);
isChanged = true; isChanged = true;
} }
} }
if (isChanged) return url.href; if (isChanged) return url.href;
else return; else return;
} }
function initPipedLocalStorage(tabId) { function initPipedLocalStorage(tabId) {
browser.tabs.executeScript( browser.tabs.executeScript(
tabId, tabId,
@ -670,7 +657,8 @@ async function init() {
[ [
"invidiousAlwaysProxy", "invidiousAlwaysProxy",
"invidiousVideoQuality", "invidiousVideoQuality",
"youtubeTheme", "theme",
"applyThemeToSites",
"persistInvidiousPrefs", "persistInvidiousPrefs",
"disableYoutube", "disableYoutube",
"OnlyEmbeddedVideo", "OnlyEmbeddedVideo",
@ -706,51 +694,53 @@ async function init() {
"youtubeEmbedExceptions", "youtubeEmbedExceptions",
"bypassWatchOnYoutube" "bypassWatchOnYoutube"
], ],
(result) => { r => { // r = result
redirects.invidious = dataJson.invidious; redirects.invidious = dataJson.invidious;
if (result.youtubeRedirects) redirects = result.youtubeRedirects; if (r.youtubeRedirects) redirects = r.youtubeRedirects;
disable = result.disableYoutube ?? false; disable = r.disableYoutube ?? false;
protocol = result.youtubeProtocol ?? 'normal'; protocol = r.youtubeProtocol ?? 'normal';
frontend = result.youtubeFrontend ?? 'invidious'; frontend = r.youtubeFrontend ?? 'invidious';
youtubeEmbedFrontend = result.youtubeEmbedFrontend ?? 'invidious'; youtubeEmbedFrontend = r.youtubeEmbedFrontend ?? 'invidious';
theme = result.youtubeTheme ?? 'DEFAULT'; theme = r.theme ?? 'DEFAULT';
volume = result.youtubeVolume ?? '--'; applyThemeToSites = r.applyThemeToSites ?? false;
autoplay = result.youtubeAutoplay ?? 'DEFAULT';
invidiousAlwaysProxy = result.invidiousAlwaysProxy ?? 'DEFAULT'; volume = r.youtubeVolume ?? '--';
OnlyEmbeddedVideo = result.OnlyEmbeddedVideo ?? 'both'; autoplay = r.youtubeAutoplay ?? 'DEFAULT';
invidiousVideoQuality = result.invidiousVideoQuality ?? 'DEFAULT';
invidiousPlayerStyle = result.invidiousPlayerStyle ?? 'DEFAULT';
invidiousSubtitles = result.invidiousSubtitles || '';
invidiousNormalRedirectsChecks = result.invidiousNormalRedirectsChecks ?? [...redirects.invidious.normal]; invidiousAlwaysProxy = r.invidiousAlwaysProxy ?? 'DEFAULT';
invidiousNormalCustomRedirects = result.invidiousNormalCustomRedirects ?? []; OnlyEmbeddedVideo = r.OnlyEmbeddedVideo ?? 'both';
invidiousVideoQuality = r.invidiousVideoQuality ?? 'DEFAULT';
invidiousPlayerStyle = r.invidiousPlayerStyle ?? 'DEFAULT';
invidiousSubtitles = r.invidiousSubtitles || '';
invidiousTorRedirectsChecks = result.invidiousTorRedirectsChecks ?? [...redirects.invidious.tor]; invidiousNormalRedirectsChecks = r.invidiousNormalRedirectsChecks ?? [...redirects.invidious.normal];
invidiousTorCustomRedirects = result.invidiousTorCustomRedirects ?? []; invidiousNormalCustomRedirects = r.invidiousNormalCustomRedirects ?? [];
pipedNormalRedirectsChecks = result.pipedNormalRedirectsChecks ?? [...redirects.piped.normal]; invidiousTorRedirectsChecks = r.invidiousTorRedirectsChecks ?? [...redirects.invidious.tor];
pipedNormalCustomRedirects = result.pipedNormalCustomRedirects ?? []; invidiousTorCustomRedirects = r.invidiousTorCustomRedirects ?? [];
pipedTorRedirectsChecks = result.pipedTorRedirectsChecks ?? [...redirects.piped.tor]; pipedNormalRedirectsChecks = r.pipedNormalRedirectsChecks ?? [...redirects.piped.normal];
pipedTorCustomRedirects = result.pipedTorCustomRedirects ?? []; pipedNormalCustomRedirects = r.pipedNormalCustomRedirects ?? [];
pipedTorRedirectsChecks = r.pipedTorRedirectsChecks ?? [...redirects.piped.tor];
pipedTorCustomRedirects = r.pipedTorCustomRedirects ?? [];
pipedMaterialNormalRedirectsChecks = result.pipedMaterialNormalRedirectsChecks ?? [...redirects.pipedMaterial.normal]; pipedMaterialNormalRedirectsChecks = r.pipedMaterialNormalRedirectsChecks ?? [...redirects.pipedMaterial.normal];
pipedMaterialNormalCustomRedirects = result.pipedMaterialNormalCustomRedirects ?? []; pipedMaterialNormalCustomRedirects = r.pipedMaterialNormalCustomRedirects ?? [];
pipedMaterialTorRedirectsChecks = result.pipedMaterialTorRedirectsChecks ?? [...redirects.pipedMaterial.tor]; pipedMaterialTorRedirectsChecks = r.pipedMaterialTorRedirectsChecks ?? [...redirects.pipedMaterial.tor];
pipedMaterialTorCustomRedirects = result.pipedMaterialTorCustomRedirects ?? []; pipedMaterialTorCustomRedirects = r.pipedMaterialTorCustomRedirects ?? [];
persistInvidiousPrefs = result.persistInvidiousPrefs ?? false; persistInvidiousPrefs = r.persistInvidiousPrefs ?? false;
alwaysUsePreferred = result.alwaysUsePreferred ?? true; alwaysUsePreferred = r.alwaysUsePreferred ?? true;
bypassWatchOnYoutube = result.bypassWatchOnYoutube ?? true; bypassWatchOnYoutube = r.bypassWatchOnYoutube ?? true;
if (result.youtubeEmbedExceptions) exceptions = result.youtubeEmbedExceptions; if (r.youtubeEmbedExceptions) exceptions = r.youtubeEmbedExceptions;
resolve(); resolve();
}); });
@ -780,7 +770,6 @@ export default {
changeInstance, changeInstance,
isPipedorInvidious, isPipedorInvidious,
isUrlPipedorInvidious,
addUrlParams, addUrlParams,
getDisable, getDisable,
@ -859,4 +848,4 @@ export default {
isException, isException,
init, init,
}; };

View File

@ -14,9 +14,10 @@
"128": "assets/images/libredirect-128.png" "128": "assets/images/libredirect-128.png"
}, },
"permissions": [ "permissions": [
"storage",
"webRequest", "webRequest",
"webRequestBlocking", "webRequestBlocking",
"storage",
"cookies",
"<all_urls>" "<all_urls>"
], ],
"browser_action": { "browser_action": {

View File

@ -39,7 +39,7 @@ browser.storage.onChanged.addListener(wholeInit);
let BYPASSTABs = []; let BYPASSTABs = [];
browser.webRequest.onBeforeRequest.addListener( browser.webRequest.onBeforeRequest.addListener(
(details) => { details => {
const url = new URL(details.url); const url = new URL(details.url);
let initiator; let initiator;
if (details.originUrl) if (details.originUrl)
@ -50,7 +50,7 @@ browser.webRequest.onBeforeRequest.addListener(
var newUrl; var newUrl;
if (!newUrl) newUrl = youtubeHelper.redirect(url, details, initiator) if (!newUrl) newUrl = youtubeHelper.redirect(url, details, initiator)
if (youtubeHelper.isPipedorInvidious(newUrl ?? url, details.type)) newUrl = youtubeHelper.addUrlParams(newUrl ?? url); if (youtubeHelper.isPipedorInvidious(newUrl ?? url, details.type, 'invidious')) newUrl = youtubeHelper.addUrlParams(newUrl ?? url);
if (youtubeMusicHelper.isYoutubeMusic(url, initiator)) newUrl = youtubeMusicHelper.redirect(url, details.type) if (youtubeMusicHelper.isYoutubeMusic(url, initiator)) newUrl = youtubeMusicHelper.redirect(url, details.type)
if (!newUrl) newUrl = twitterHelper.redirect(url, initiator); if (!newUrl) newUrl = twitterHelper.redirect(url, initiator);
@ -77,6 +77,8 @@ browser.webRequest.onBeforeRequest.addListener(
if (BYPASSTABs.includes(details.tabId)) newUrl = null; if (BYPASSTABs.includes(details.tabId)) newUrl = null;
if (newUrl) { if (newUrl) {
if (newUrl == 'CANCEL') { if (newUrl == 'CANCEL') {
console.log(`Canceled ${url}`); console.log(`Canceled ${url}`);
@ -109,7 +111,11 @@ browser.tabs.onRemoved.addListener((tabId) => {
browser.tabs.onUpdated.addListener( browser.tabs.onUpdated.addListener(
(tabId, changeInfo, _) => { (tabId, changeInfo, _) => {
if (changeInfo.url && youtubeHelper.isUrlPipedorInvidious(changeInfo.url, 'piped')) youtubeHelper.initPipedLocalStorage(tabId); let url;
if (changeInfo.url && youtubeHelper.isUrlPipedorInvidious(changeInfo.url, 'pipedMaterial')) youtubeHelper.initPipedMaterialLocalStorage(tabId); try { url = new URL(changeInfo.url); }
catch (_) { return }
if (youtubeHelper.isPipedorInvidious(url, 'main_frame', 'piped')) youtubeHelper.initPipedLocalStorage(tabId);
if (twitterHelper.isNitter(url, 'main_frame')) newUrl = twitterHelper.initNitterCookies(url);
// if (changeInfo.url && youtubeHelper.isPipedorInvidious(url, 'main_frame', 'pipedMaterial')) youtubeHelper.initPipedMaterialLocalStorage(tabId);
// if (changeInfo.url && youtubeHelper.isUrlPipedorInvidious(changeInfo.url, 'invidious')) youtubeHelper.initInvidiousCookies(tabId); // if (changeInfo.url && youtubeHelper.isUrlPipedorInvidious(changeInfo.url, 'invidious')) youtubeHelper.initInvidiousCookies(tabId);
}); });

View File

@ -90,12 +90,17 @@
<div class="some-block option-block"> <div class="some-block option-block">
<h4>Theme</h4> <h4>Theme</h4>
<select id="theme"> <select id="theme">
<option value="">System</option> <option value="DEFAULT">System</option>
<option value="light-theme">Light</option> <option value="light">Light</option>
<option value="dark-theme">Dark</option> <option value="dark">Dark</option>
</select> </select>
</div> </div>
<div class="some-block option-block">
<h4>Apply Theme to sites</h4>
<input id="apply-theme-to-sites" type="checkbox" checked />
</div>
<div class="some-block option-block"> <div class="some-block option-block">
<h4>Always use Preferred Instances</h4> <h4>Always use Preferred Instances</h4>
<input id="always-use-preferred" type="checkbox" checked /> <input id="always-use-preferred" type="checkbox" checked />

View File

@ -4,43 +4,33 @@ window.browser = window.browser || window.chrome;
import commonHelper from "../../../assets/javascripts/helpers/common.js"; import commonHelper from "../../../assets/javascripts/helpers/common.js";
import generalHelper from "../../../assets/javascripts/helpers/general.js"; import generalHelper from "../../../assets/javascripts/helpers/general.js";
let themeElement = document.getElementById("theme");
browser.storage.local.get( let updateInstancesElement = document.getElementById("update-instances");
["theme"], updateInstancesElement.addEventListener("click", () => {
(result) => { let oldHtml = updateInstancesElement.innerHTML
themeElement.value = result.theme || ""; updateInstancesElement.innerHTML = '...';
}
);
themeElement.addEventListener("change", (event) => {
const value = event.target.options[theme.selectedIndex].value;
browser.storage.local.set({ theme: value });
});
document.getElementById("update-instances").addEventListener("click", () => {
let oldHtml = document.getElementById("update-instances").innerHTML
document.getElementById("update-instances").innerHTML = '...';
if (commonHelper.updateInstances()) { if (commonHelper.updateInstances()) {
document.getElementById("update-instances").innerHTML = 'Done!'; updateInstancesElement.innerHTML = 'Done!';
new Promise(resolve => setTimeout(resolve, 1500)).then( // sleep 1500ms new Promise(resolve => setTimeout(resolve, 1500)).then( // sleep 1500ms
() => document.getElementById("update-instances").innerHTML = oldHtml () => updateInstancesElement.innerHTML = oldHtml
) )
} }
else else
document.getElementById("update-instances").innerHTML = 'Failed Miserabely'; updateInstancesElement.innerHTML = 'Failed Miserabely';
}); });
let exportSettingsElement = document.getElementById("export-settings"); let exportSettingsElement = document.getElementById("export-settings");
function exportSettings() { function exportSettings() {
browser.storage.local.get(null, result => { browser.storage.local.get(
let resultString = JSON.stringify(result, null, ' '); null,
exportSettingsElement.href = 'data:application/json;base64,' + btoa(resultString); result => {
exportSettingsElement.download = 'libredirect-settings.json'; let resultString = JSON.stringify(result, null, ' ');
}); exportSettingsElement.href = 'data:application/json;base64,' + btoa(resultString);
exportSettingsElement.download = 'libredirect-settings.json';
}
);
} }
exportSettings(); exportSettings();
@ -59,7 +49,6 @@ importSettingsElement.addEventListener("change",
); );
let resetSettingsElement = document.getElementById("reset-settings"); let resetSettingsElement = document.getElementById("reset-settings");
resetSettingsElement.addEventListener("click", resetSettingsElement.addEventListener("click",
() => { () => {
console.log("reset"); console.log("reset");
@ -73,12 +62,24 @@ alwaysUsePreferredElement.addEventListener("change",
event => generalHelper.setAlwaysUsePreferred(event.target.checked) event => generalHelper.setAlwaysUsePreferred(event.target.checked)
); );
let applyThemeToSitesElement = document.getElementById("apply-theme-to-sites")
applyThemeToSitesElement.addEventListener("change",
event => generalHelper.setApplyThemeToSites(event.target.checked)
);
let themeElement = document.getElementById("theme");
themeElement.addEventListener("change", event => {
const value = event.target.options[theme.selectedIndex].value;
generalHelper.setTheme(value);
})
let nameCustomInstanceInput = document.getElementById("exceptions-custom-instance"); let nameCustomInstanceInput = document.getElementById("exceptions-custom-instance");
let instanceTypeElement = document.getElementById("exceptions-custom-instance-type"); let instanceTypeElement = document.getElementById("exceptions-custom-instance-type");
let instanceType = "url" let instanceType = "url"
generalHelper.init().then(() => { generalHelper.init().then(() => {
alwaysUsePreferredElement.checked = generalHelper.getAlwaysUsePreferred(); alwaysUsePreferredElement.checked = generalHelper.getAlwaysUsePreferred();
themeElement.value = generalHelper.getTheme();
applyThemeToSitesElement.checked = generalHelper.getApplyThemeToSites();
console.log("generalHelper.getAlwaysUsePreferred()"); console.log("generalHelper.getAlwaysUsePreferred()");
instanceTypeElement.addEventListener("change", instanceTypeElement.addEventListener("change",
(event) => { (event) => {

View File

@ -1,27 +1,30 @@
window.browser = window.browser || window.chrome; window.browser = window.browser || window.chrome;
function changeTheme() { function changeTheme() {
browser.storage.local.get("theme", (result) => { browser.storage.local.get(
switch (result.theme) { "theme",
case "dark-theme": result => {
document.body.classList.add("dark-theme"); switch (result.theme) {
document.body.classList.remove("light-theme"); case "dark":
break;
case "light-theme":
document.body.classList.add("light-theme");
document.body.classList.remove("dark-theme");
break;
default:
if (matchMedia("(prefers-color-scheme: light)").matches) {
document.body.classList.add("light-theme");
document.body.classList.remove("dark-theme");
} else {
document.body.classList.add("dark-theme"); document.body.classList.add("dark-theme");
document.body.classList.remove("light-theme"); document.body.classList.remove("light-theme");
} break;
case "light":
document.body.classList.add("light-theme");
document.body.classList.remove("dark-theme");
break;
default:
if (matchMedia("(prefers-color-scheme: light)").matches) {
document.body.classList.add("light-theme");
document.body.classList.remove("dark-theme");
} else {
document.body.classList.add("dark-theme");
document.body.classList.remove("light-theme");
}
}
} }
}) )
} }
changeTheme() changeTheme()

View File

@ -155,15 +155,6 @@
</button> </button>
</div> </div>
<div class="some-block option-block">
<h4>Theme</h4>
<select id="invidious-theme">
<option value="DEFAULT">Default</option>
<option value="dark">Dark</option>
<option value="light">Light</option>
</select>
</div>
<div class="some-block option-block"> <div class="some-block option-block">
<h4>Autoplay Video</h4> <h4>Autoplay Video</h4>
<select id="invidious-autoplay"> <select id="invidious-autoplay">

View File

@ -86,11 +86,6 @@ disableYoutubeElement.addEventListener("change",
event => youtubeHelper.setDisable(!event.target.checked) event => youtubeHelper.setDisable(!event.target.checked)
); );
let themeElement = document.getElementById("invidious-theme");
themeElement.addEventListener("change",
event => youtubeHelper.setTheme(event.target.options[themeElement.selectedIndex].value)
);
let volumeElement = document.getElementById("invidious-volume"); let volumeElement = document.getElementById("invidious-volume");
let volumeValueElement = document.getElementById("volume-value"); let volumeValueElement = document.getElementById("volume-value");
volumeElement.addEventListener("input", volumeElement.addEventListener("input",
@ -166,7 +161,6 @@ function changeProtocolSettings(protocol) {
youtubeHelper.init().then(() => { youtubeHelper.init().then(() => {
disableYoutubeElement.checked = !youtubeHelper.getDisable(); disableYoutubeElement.checked = !youtubeHelper.getDisable();
themeElement.value = youtubeHelper.getTheme();
volumeElement.value = youtubeHelper.getVolume(); volumeElement.value = youtubeHelper.getVolume();
volumeValueElement.textContent = `${youtubeHelper.getVolume()}%`; volumeValueElement.textContent = `${youtubeHelper.getVolume()}%`;
OnlyEmbeddedVideoElement.value = youtubeHelper.getOnlyEmbeddedVideo(); OnlyEmbeddedVideoElement.value = youtubeHelper.getOnlyEmbeddedVideo();