privacyguides.org/privacytools.io/assets/js/main.js

97 lines
3.1 KiB
JavaScript
Raw Normal View History

$(function() {
$("[data-toggle='tooltip']").tooltip();
2019-08-23 07:23:18 -04:00
});
2019-10-12 22:18:04 -04:00
document.querySelectorAll(".onclick-select").forEach(element => {
element.addEventListener("click", element.select);
});
2019-08-23 07:23:18 -04:00
// Navbar dropdowns
const navSections = document.querySelectorAll(".nav-details");
navSections.forEach(navSection => {
navSection.addEventListener("toggle", navSectionsToggle);
});
document.addEventListener("click", navSectionsClose);
function navSectionsToggle() {
// When opening next dropdown, hide previous
if (this.open) {
navSections.forEach(navSection => {
if (navSection != this && navSection.open) navSection.open = !open;
});
}
}
function 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 => {
navSection.open = !open;
});
}
2019-08-29 16:03:04 -04:00
// Dark/Light color scheme switch button
document.querySelector("#nav-switch-theme").style.display = "inline";
2019-10-12 22:18:04 -04:00
document.querySelector("#nav-switch-theme").addEventListener("click", changeColorScheme);
2019-08-29 16:03:04 -04:00
function changeColorScheme() {
// Use whatever users want
if (localStorage.getItem("colorScheme") === "dark") {
// Change to light theme
if (window.matchMedia("(prefers-color-scheme: dark)").matches === false) {
document.querySelector("#dark-css").setAttribute("media", "(prefers-color-scheme: dark)");
localStorage.removeItem("colorScheme");
} else {
// by setting invalid media it will just not apply CSS for anyone
document.querySelector("#dark-css").setAttribute("media", "invalid");
localStorage.setItem("colorScheme", "light");
}
2019-08-29 16:03:04 -04:00
}
// Change to dark theme
2019-08-29 16:03:04 -04:00
else if (localStorage.getItem("colorScheme") === "light") {
if (window.matchMedia("(prefers-color-scheme: dark)").matches === true) {
document.querySelector("#dark-css").setAttribute("media", "(prefers-color-scheme: dark)");
localStorage.removeItem("colorScheme");
} else {
// media was set to prefers-color-scheme: dark
document.querySelector("#dark-css").removeAttribute("media");
localStorage.setItem("colorScheme", "dark");
}
2019-08-29 16:03:04 -04:00
}
// Just use whatever browsers want
else if (window.matchMedia("(prefers-color-scheme: dark)").matches === true) {
// Change to light Theme
document.querySelector("#dark-css").setAttribute("media", "invalid");
localStorage.setItem("colorScheme", "light");
} else {
2019-08-29 16:03:04 -04:00
// Change to dark theme
document.querySelector("#dark-css").removeAttribute("media");
localStorage.setItem("colorScheme", "dark");
2019-08-29 16:03:04 -04:00
}
fixThemeImages();
}
// Fix images in dark theme
function fixThemeImages() {
document.querySelectorAll('[data-theme-src]').forEach(function(image) {
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")
) {
fixThemeImages();
2019-08-29 16:03:04 -04:00
}