41 lines
895 B
JavaScript
41 lines
895 B
JavaScript
|
|
function getClass(type) {
|
|
switch (type) {
|
|
case "error":
|
|
return ["bg-amber-900", "text-white"];
|
|
case "warning":
|
|
return ["bg-yellow-200", "text-gray-800"];
|
|
case "success":
|
|
return ["bg-green-900", "text-white"];
|
|
default:
|
|
return ["bg-gray-800", "text-white"];
|
|
}
|
|
}
|
|
|
|
htmx.on("toast", (e) => {
|
|
const values = e.detail.value.split("|");
|
|
const type = values[0];
|
|
const message = values[1];
|
|
|
|
const template = document.getElementById("toast");
|
|
const toast = template.cloneNode(true);
|
|
const list = document.getElementById("toasts");
|
|
|
|
toast.id = ""
|
|
toast.classList.remove("hidden");
|
|
toast.classList.add(...getClass(type));
|
|
toast.innerText = message;
|
|
|
|
list.appendChild(toast);
|
|
setTimeout(() => {
|
|
toast.classList.remove("opacity-0");
|
|
}, 0);
|
|
|
|
setTimeout(() => {
|
|
toast.classList.add("opacity-0");
|
|
setTimeout(() => {
|
|
list.removeChild(toast);
|
|
}, 250);
|
|
}, 5000);
|
|
});
|