reverse-shell-generator/js/light-mode-switch.js

49 lines
1.5 KiB
JavaScript
Raw Permalink Normal View History

2021-09-16 13:53:21 +00:00
var themeSelector = $("#theme-selector");
window.addEventListener("load", function () {
2021-09-16 13:53:21 +00:00
if (themeSelector) {
initTheme();
2021-09-16 13:53:21 +00:00
themeSelector.on('change', function() {
resetTheme(this.value);
});
}
});
/**
* Summary: function that adds or removes the attribute 'data-theme' depending if
* the switch is 'on' or 'off'.
*
* Description: initTheme is a function that uses localStorage from JavaScript DOM,
* to store the value of the HTML switch. If the switch was already switched to
2021-02-28 21:06:23 +00:00
* 'on' it will set an HTML attribute to the body named: 'data-theme' to a 'light'
* value. If it is the first time opening the page, or if the switch was off the
* 'data-theme' attribute will not be set.
* @return {void}
*/
function initTheme() {
2021-09-16 13:53:21 +00:00
var currentTheme = localStorage.getItem("currentTheme");
2021-09-16 14:02:49 +00:00
if (currentTheme == null) {
2021-09-16 13:53:21 +00:00
document.body.removeAttribute("data-theme")
} else {
2021-09-16 14:02:49 +00:00
console.log("there")
2021-09-16 13:53:21 +00:00
document.body.setAttribute("data-theme", currentTheme)
2021-09-16 14:02:49 +00:00
$("#theme-selector").val(currentTheme).change();
2021-09-16 13:53:21 +00:00
}
}
/**
* Summary: resetTheme checks if the switch is 'on' or 'off' and if it is toggled
2021-02-28 21:06:23 +00:00
* on it will set the HTML attribute 'data-theme' to light so the light-theme CSS is
* applied.
* @return {void}
*/
2021-09-16 13:53:21 +00:00
function resetTheme(currentTheme) {
console.log(currentTheme)
if (currentTheme !== "dark") {
document.body.setAttribute("data-theme", currentTheme);
localStorage.setItem("currentTheme", currentTheme);
} else {
document.body.removeAttribute("data-theme");
2021-09-16 13:53:21 +00:00
localStorage.removeItem("currentTheme");
}
}