55 lines
1.5 KiB
JavaScript
55 lines
1.5 KiB
JavaScript
function progressBar(toastId, duration) {
|
|
const progressBar = {
|
|
progress: 0,
|
|
paused: false,
|
|
|
|
animateToastProgress() {
|
|
const toast = document.getElementById(toastId);
|
|
if (!toast) return;
|
|
const bar = document.getElementById([toastId, "progress"].join("-"));
|
|
|
|
const startTime = performance.now();
|
|
let totalPausedTime = 0;
|
|
let pauseStartTime = null;
|
|
|
|
const animate = (currentTime) => {
|
|
const toast = document.getElementById(toastId);
|
|
if (!toast) return; // Toast was manually removed
|
|
|
|
if (this.paused) {
|
|
// Track when pause started
|
|
if (pauseStartTime === null) {
|
|
pauseStartTime = currentTime;
|
|
}
|
|
// Keep animating while paused
|
|
requestAnimationFrame(animate);
|
|
return;
|
|
} else {
|
|
// If we were paused, accumulate the paused time
|
|
if (pauseStartTime !== null) {
|
|
totalPausedTime += currentTime - pauseStartTime;
|
|
pauseStartTime = null;
|
|
}
|
|
}
|
|
|
|
// Calculate actual elapsed time (excluding paused time)
|
|
const elapsed = currentTime - startTime - totalPausedTime;
|
|
this.progress = Math.min((elapsed / duration) * 100, 100) + "%";
|
|
bar.style["width"] = this.progress;
|
|
|
|
|
|
if (elapsed >= duration) {
|
|
toast.remove()
|
|
} else {
|
|
requestAnimationFrame(animate);
|
|
}
|
|
};
|
|
|
|
requestAnimationFrame(animate);
|
|
}
|
|
};
|
|
progressBar.animateToastProgress();
|
|
return progressBar;
|
|
}
|
|
|