51 lines
1.5 KiB
JavaScript
51 lines
1.5 KiB
JavaScript
// Close dropdown if user clicks outside of it.
|
|
// Adapted from: https://www.w3schools.com/howto/tryit.asp?filename=tryhow_css_js_dropdown
|
|
//
|
|
window.onClick = function(event) {
|
|
if (!event.target.matches('.dropbtn')) {
|
|
var dropdowns = document.getElementsByClassName("dropdown-content");
|
|
var i;
|
|
for (i=0; i < dropdowns.length; i++) {
|
|
var openDropdown = dropdowns[i];
|
|
if (openDropdown.classList.contains('show')) {
|
|
openDropdown.classList.remove('show');
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
// Show the drop-down menu, with the given id.
|
|
function showDropdownContent(id) {
|
|
document.getElementById(id).classList.toggle("show");
|
|
}
|
|
|
|
// Update the drop-down with the item that was clicked inside it's menu.
|
|
function updateDropDownSelection(id, contentId) {
|
|
let content = document.getElementById(contentId).innerHTML;
|
|
document.getElementById(id).innerHTML = content;
|
|
}
|
|
|
|
function openSidepanel() {
|
|
if (searchBtn = document.getElementById("btn-search")) {
|
|
searchBtn.style.display = "none";
|
|
}
|
|
document.getElementById("sidepanel").style.width = "250px";
|
|
}
|
|
|
|
function closeSidepanel() {
|
|
if (searchBtn = document.getElementById("btn-search")) {
|
|
searchBtn.style.display = "inline";
|
|
}
|
|
document.getElementById("sidepanel").style.width = "0";
|
|
}
|
|
|
|
// Show or hide an element by id.
|
|
function toggleContent(id) {
|
|
var el = document.getElementById(id);
|
|
if (el.style.display === "none") {
|
|
el.style.display = "block";
|
|
} else {
|
|
el.style.display = "none";
|
|
}
|
|
}
|