86 lines
2.7 KiB
JavaScript
86 lines
2.7 KiB
JavaScript
let isDropdownOpen = false;
|
|
|
|
function toggleDropdown() {
|
|
const dropdown = document.querySelector('.dropdown');
|
|
dropdown.classList.toggle('is-open');
|
|
isDropdownOpen = !isDropdownOpen;
|
|
}
|
|
|
|
function showErrorMessage(message) {
|
|
const toast = document.querySelector(".toast#errorToast");
|
|
(closeIcon = document.querySelector(".close-error")),
|
|
(errorMessage = document.querySelector(".errorMessage")),
|
|
(progress = document.querySelector(".progress.error"));
|
|
let timer1, timer2;
|
|
errorMessage.textContent = message;
|
|
toast.classList.add("active");
|
|
progress.classList.add("active");
|
|
timer1 = setTimeout(() => {
|
|
toast.classList.remove("active");
|
|
closeIcon.removeEventListener("click", () => {});
|
|
}, 5000);
|
|
|
|
timer2 = setTimeout(() => {
|
|
progress.classList.remove("active");
|
|
}, 5300);
|
|
|
|
closeIcon.addEventListener("click", () => {
|
|
toast.classList.remove("active");
|
|
|
|
setTimeout(() => {
|
|
progress.classList.remove("active");
|
|
}, 300);
|
|
|
|
clearTimeout(timer1);
|
|
clearTimeout(timer2);
|
|
closeIcon.removeEventListener("click", () => {});
|
|
});
|
|
}
|
|
|
|
function showSuccessMessage(message) {
|
|
const toast = document.querySelector(".toast#successToast");
|
|
(closeIcon = document.querySelector(".close-success")),
|
|
(successMessage = document.querySelector(".successMessage")),
|
|
(progress = document.querySelector(".progress.success"));
|
|
let timer1, timer2;
|
|
successMessage.textContent = message;
|
|
toast.classList.add("active");
|
|
progress.classList.add("active");
|
|
timer1 = setTimeout(() => {
|
|
toast.classList.remove("active");
|
|
closeIcon.removeEventListener("click", () => {});
|
|
}, 5000);
|
|
|
|
timer2 = setTimeout(() => {
|
|
progress.classList.remove("active");
|
|
}, 5300);
|
|
|
|
closeIcon.addEventListener("click", () => {
|
|
toast.classList.remove("active");
|
|
|
|
setTimeout(() => {
|
|
progress.classList.remove("active");
|
|
}, 300);
|
|
|
|
clearTimeout(timer1);
|
|
clearTimeout(timer2);
|
|
closeIcon.removeEventListener("click", () => {});
|
|
});
|
|
}
|
|
|
|
document.addEventListener('DOMContentLoaded', function() {
|
|
|
|
document.addEventListener('mousedown', function(event) {
|
|
var dropdown = document.querySelector('.dropdown');
|
|
var dropdownContent = document.querySelector('.dropdown-content');
|
|
|
|
if (!dropdown.contains(event.target) && isDropdownOpen) {
|
|
dropdown.classList.remove('is-open');
|
|
isDropdownOpen = false;
|
|
}
|
|
});
|
|
|
|
document.querySelector('.dropdown-content').addEventListener('focus', function() {
|
|
isDropdownOpen = true;
|
|
});
|
|
}); |