Cleanup Javascript

- Remove sortable.js(not used).
- Cleanup redirects, I couldn't properly look at it.
- Made main.js ECMA6 ready.
- Made event functions into a declaration to ensure compatibility with possible older browser version.
- Removed useless `=== true/false`.
- tempSrc uses declaration now.
This commit is contained in:
Gusted
2021-01-10 18:27:20 +01:00
parent 2fcb959eb8
commit f4c660e1a8
3 changed files with 56 additions and 196 deletions

View File

@ -1,8 +1,7 @@
document.querySelectorAll(".onclick-select").forEach(element => {
document.querySelectorAll(".onclick-select").forEach((element) => {
element.addEventListener("click", element.select);
});
// Navbar dropdowns
const navSections = document.querySelectorAll(".nav-details");
@ -11,23 +10,25 @@ navSections.forEach(navSection => {
});
document.addEventListener("click", navSectionsClose);
function navSectionsToggle() {
const navSectionsToggle = () => {
// When opening next dropdown, hide previous
if (this.open) {
navSections.forEach(navSection => {
if (navSection != this && navSection.open) navSection.open = !open;
navSections.forEach((navSection) => {
if (navSection != this && navSection.open) {
navSection.open = !open;
}
});
}
}
function navSectionsClose(event) {
const navSectionsClose = (event) => {
// Hide all dropdowns when clicking in different place
if (
event.target.matches(".nav-summary") ||
event.target.parentNode.matches(".nav-summary")
)
return;
navSections.forEach(navSection => {
navSections.forEach((navSection) => {
navSection.open = !open;
});
}
@ -37,11 +38,11 @@ function navSectionsClose(event) {
document.querySelector("#nav-switch-theme").style.display = "inline";
document.querySelector("#nav-switch-theme").addEventListener("click", changeColorScheme);
function changeColorScheme() {
const changeColorScheme = () => {
// Use whatever users want
if (localStorage.getItem("colorScheme") === "dark") {
// Change to light theme
if (window.matchMedia("(prefers-color-scheme: dark)").matches === false) {
if (!window.matchMedia("(prefers-color-scheme: dark)").matches) {
document.querySelector("#dark-css").setAttribute("media", "(prefers-color-scheme: dark)");
localStorage.removeItem("colorScheme");
} else {
@ -52,7 +53,7 @@ function changeColorScheme() {
}
// Change to dark theme
else if (localStorage.getItem("colorScheme") === "light") {
if (window.matchMedia("(prefers-color-scheme: dark)").matches === true) {
if (window.matchMedia("(prefers-color-scheme: dark)").matches) {
document.querySelector("#dark-css").setAttribute("media", "(prefers-color-scheme: dark)");
localStorage.removeItem("colorScheme");
} else {
@ -63,7 +64,7 @@ function changeColorScheme() {
}
// Just use whatever browsers want
else if (window.matchMedia("(prefers-color-scheme: dark)").matches === true) {
else if (window.matchMedia("(prefers-color-scheme: dark)").matches) {
// Change to light Theme
document.querySelector("#dark-css").setAttribute("media", "invalid");
localStorage.setItem("colorScheme", "light");
@ -78,16 +79,15 @@ function changeColorScheme() {
// Fix images in dark theme
function fixThemeImages() {
document.querySelectorAll('[data-theme-src]').forEach(function(image) {
tempSrc = image.src;
document.querySelectorAll('[data-theme-src]').forEach((image) => {
const tempSrc = image.src;
image.src = image.getAttribute("data-theme-src");
image.setAttribute("data-theme-src", tempSrc);
});
}
if (
(localStorage.getItem("colorScheme") === "dark") ||
(window.matchMedia("(prefers-color-scheme: dark)").matches ^
localStorage.getItem("colorScheme") === "light")
) {
if (localStorage.getItem("colorScheme") === "dark" ||
window.matchMedia("(prefers-color-scheme: dark)").matches ^
localStorage.getItem("colorScheme") === "light"
) {
fixThemeImages();
}