Git-Mirrors/invidious
1
0
Fork 0
mirror of https://github.com/iv-org/invidious.git synced 2025-05-02 14:36:24 -04:00
Code Issues Projects Releases Packages Wiki Activity

js code rewrite. Created _helpers.js with XHR and storage wrapper

Browse source
This commit is contained in:
meow 2022-05-06 04:46:59 +03:00
parent ef8c7184de
commit 7dd699370f
23 changed files with 735 additions and 901 deletions
Download patch file Download diff file Expand all files Collapse all files

48
assets/js/themes.js
View file

@ -1,60 +1,48 @@
'use strict';
var toggle_theme = document.getElementById('toggle_theme');
toggle_theme.href = 'javascript:void(0);';
toggle_theme.href = 'javascript:void(0)';
toggle_theme.addEventListener('click', function () {
var dark_mode = document.body.classList.contains('light-theme');
var url = '/toggle_theme?redirect=false';
var xhr = new XMLHttpRequest();
xhr.responseType = 'json';
xhr.timeout = 10000;
xhr.open('GET', url, true);
set_mode(dark_mode);
try {
window.localStorage.setItem('dark_mode', dark_mode ? 'dark' : 'light');
} catch (e) {}
helpers.storage.set('dark_mode', dark_mode ? 'dark' : 'light');
xhr.send();
helpers.xhr('GET', '/toggle_theme?redirect=false', {}, {});
});
window.addEventListener('storage', function (e) {
// Handles theme change event caused by other tab
addEventListener('storage', function (e) {
if (e.key === 'dark_mode') {
update_mode(e.newValue);
}
});
window.addEventListener('DOMContentLoaded', function () {
addEventListener('DOMContentLoaded', function () {
const dark_mode = document.getElementById('dark_mode_pref').textContent;
try {
// Update localStorage if dark mode preference changed on preferences page
window.localStorage.setItem('dark_mode', dark_mode);
} catch (e) {}
// Update storage if dark mode preference changed on preferences page
helpers.storage.set('dark_mode', dark_mode);
update_mode(dark_mode);
});
var darkScheme = window.matchMedia('(prefers-color-scheme: dark)');
var lightScheme = window.matchMedia('(prefers-color-scheme: light)');
var darkScheme = matchMedia('(prefers-color-scheme: dark)');
var lightScheme = matchMedia('(prefers-color-scheme: light)');
darkScheme.addListener(scheme_switch);
lightScheme.addListener(scheme_switch);
function scheme_switch (e) {
// ignore this method if we have a preference set
try {
if (localStorage.getItem('dark_mode')) {
return;
}
} catch (exception) {}
if (e.matches) {
// ignore this method if we have a preference set
if (helpers.storage.get('dark_mode')) return;
if (!e.matches) return;
if (e.media.includes('dark')) {
set_mode(true);
set_mode(true);
} else if (e.media.includes('light')) {
set_mode(false);
set_mode(false);
}
}
}
function set_mode (bool) {
@ -82,7 +70,7 @@ function update_mode (mode) {
// If preference for light mode indicated
set_mode(false);
}
else if (document.getElementById('dark_mode_pref').textContent === '' && window.matchMedia('(prefers-color-scheme: dark)').matches) {
else if (document.getElementById('dark_mode_pref').textContent === '' && matchMedia('(prefers-color-scheme: dark)').matches) {
// If no preference indicated here and no preference indicated on the preferences page (backend), but the browser tells us that the operating system has a dark theme
set_mode(true);
}