An electron-based WIP aesthetic file explorer ^^
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
FileKade/scripts/toast/createtoast.js

64 lines
2.5 KiB

const removeToast = require('./removetoast');
module.exports = (name, text, bg = '#a172a6', persistOnClick = false, time = 5, onclick = () => {}, selectable = false, timerColor='#ddddddb2') => {
if (!name || !text) {return;}
if (!Array.isArray(text)) {text = [text];}
let toast = document.createElement('div');
toast.className = 'toast';
toast.style.backgroundColor = `${bg}c2`;
toast.style.borderColor = `${bg}c2`;
toast.classList.add('toast-entering');
let toastWrap = document.createElement('div');
toastWrap.className = 'toast-wrapper';
let continueTimeout = true;
toast.onclick = () => {
if (!persistOnClick) {
removeToast(toast);
continueTimeout = false;
}
onclick();
};
document.getElementById('toast-container').appendChild(toast);
toast.appendChild(toastWrap);
let h2 = document.createElement('h2');
h2.innerHTML = name;
if (!selectable) {h2.className = 'nosel';}
toastWrap.appendChild(h2);
for (let i = 0; i < text.length; i++) {
if (text[i].length) {
let p = document.createElement('p');
p.innerHTML = text[i];
if (!selectable) {p.className = 'nosel';}
toastWrap.appendChild(p);
}
else {toastWrap.appendChild(document.createElement('br'));}
}
let timer = document.createElement('div');
timer.className = 'toast-timer';
timer.style.backgroundColor = timerColor;
timer.style.animation = `toast-timer ${time}s linear`;
toastWrap.appendChild(timer);
toast.id = `toast-${window.kade.toasts.total}`;
toast.onmouseenter = () => {
let ctoast = window.kade.toasts.shown[toast.id.slice(6)];
ctoast.toast.style.backgroundColor = bg;
ctoast.timer.style.animationPlayState = 'paused';
clearTimeout(ctoast.timeout);
ctoast.tl = ctoast.tt - (Date.now() - ctoast.ts);
};
toast.onmouseleave = () => {
let ctoast = window.kade.toasts.shown[toast.id.slice(6)];
ctoast.toast.style.backgroundColor = `${bg}c2`;
ctoast.timer.style.animationPlayState = 'running';
ctoast.timeout = setTimeout(() => {if (continueTimeout) {removeToast(ctoast.toast);}}, ctoast.tl);
};
window.kade.toasts.shown[window.kade.toasts.total] = {
timeout: setTimeout(() => {if (continueTimeout) {removeToast(toast);}}, time * 1000),
timer,
toast,
tl: time * 1000,
ts: Date.now(),
tt: time * 1000
};
window.kade.toasts.total++;
};