Blob: theme-switch.js

Blob id: 8a379f87b09333bc509cbd61af2798995f044f94

Size: 2.1 KB

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
const grey = "#737373";

if (localStorage.getItem("theme") === "true") {
	$("body").toggleClass("dark-theme light-theme");
	waitForElm('object').then((elm) => {
		switchTheme(true);
	});
}

document.getElementById('themebtn').addEventListener('click', function() {
	// Vaihda js class
	$("body").toggleClass("dark-theme light-theme");
	switchTheme(document.body.className == "dark-theme");
});

function switchTheme(dark = true) {
	// Svg element
	const rootSvg = $($("object")[0].contentDocument);
	// Muuta logon värejä
	if (dark) {
		// Dark
		rootSvg.find("#path4000").attr("style", "fill:" + "white" );
		rootSvg.find("#path4004").attr("style", "fill:" + grey );
		rootSvg.find("#path4006").attr("style", "fill:" + grey );
		rootSvg.find("#path4008").attr("style", "fill:" + grey );
		rootSvg.find("#text1").attr("style", "fill:" + grey );
		localStorage.setItem("theme", true);
	} else {
		// Light
		rootSvg.find("#path4000").attr("style", "fill:" + grey );
		rootSvg.find("#path4004").attr("style", "fill:" + "white" );
		rootSvg.find("#path4006").attr("style", "fill:" + "white" );
		rootSvg.find("#path4008").attr("style", "fill:" + "white" );
		rootSvg.find("#text1").attr("style", "fill:" + "white" );
		localStorage.setItem("theme", false);
	}
}

// Source - https://stackoverflow.com/a
// Posted by Yong Wang, modified by community. See post 'Timeline' for change history
// Retrieved 2025-11-18, License - CC BY-SA 4.0

function waitForElm(selector) {
    return new Promise(resolve => {
        if (document.querySelector(selector).contentDocument) {
            return resolve(document.querySelector(selector).contentDocument);
        }

        const observer = new MutationObserver(mutations => {
            if (document.querySelector(selector).contentDocument) {
                observer.disconnect();
                resolve(document.querySelector(selector).contentDocument);
            }
        });

        // If you get "parameter 1 is not of type 'Node'" error, see https://stackoverflow.com/a/77855838/492336
        observer.observe(document.body, {
            childList: true,
            subtree: true
        });
    });
}