blob: b49c86b1ef45b0eeb79c7a7ac3924776ca212ff8 (
plain) (
blame)
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
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
|
"use strict";
const defaultCssElement = $("#bulma-css")[0];
const darkCssElement = $("#bulma-css-dark")[0];
function getCurrentTheme() {
if (document.cookie === "")
return "default";
return document.cookie
.split('; ')
.find(row => row.startsWith('theme='))
.split('=')[1];
}
function displayThemedElements() {
const defaultElements = Array.from($(".show-default-mode"));
const darkElements = Array.from($(".show-dark-mode"));
switch (getCurrentTheme()) {
case "":
case "default":
defaultElements.forEach(e => e.style.display = null);
darkElements.forEach(e => e.style.display = 'none');
break;
case "dark":
defaultElements.forEach(e => e.style.display = 'none');
darkElements.forEach(e => e.style.display = null);
break;
}
}
function setStyleSheets() {
switch (getCurrentTheme()) {
case "":
case "default":
defaultCssElement.disabled = false;
darkCssElement.disabled = true;
break;
case "dark":
defaultCssElement.disabled = true;
darkCssElement.disabled = false;
break;
}
}
function toggleThemeSwitch() {
let switchToggle = $(".switch")[0];
let knob = $(".knob")[0];
if (knob.classList.contains("dark")) {
knob.classList.remove("dark");
knob.classList.add("light");
// After 500ms, switch the icons
setTimeout(function() {
switchToggle.classList.remove("dark");
switchToggle.classList.add("light");
}, 100);
} else {
knob.classList.remove("light");
knob.classList.add("dark");
// After 500ms, switch the icons
setTimeout(function() {
switchToggle.classList.remove("light");
switchToggle.classList.add("dark");
}, 100);
}
}
// Executed when the page has finished loading.
document.addEventListener("DOMContentLoaded", () => {
setStyleSheets();
displayThemedElements();
if (getCurrentTheme() === "default")
toggleThemeSwitch();
$('#theme-switch').on("click", () => {
// Update cookie
if (getCurrentTheme() === "dark") {
document.cookie = "theme=default";
} else {
document.cookie = "theme=dark";
}
setStyleSheets();
displayThemedElements();
toggleThemeSwitch();
});
});
|
