2021-03-04 11:36:31 +00:00
|
|
|
const intervalTimeout = 10;
|
|
|
|
|
|
|
|
const MAX = 100;
|
|
|
|
let timerId;
|
|
|
|
let width = 0;
|
|
|
|
let percentage = 0;
|
|
|
|
let increasePercentage = 0.75;
|
|
|
|
let moreIncreasePercentage = 3;
|
|
|
|
|
2022-01-21 16:47:45 +00:00
|
|
|
let elem =
|
|
|
|
typeof document !== "undefined" &&
|
|
|
|
document.getElementById("ipl-progress-indicator");
|
2021-03-04 11:36:31 +00:00
|
|
|
|
|
|
|
const startInterval = () => {
|
2021-03-21 08:51:19 +00:00
|
|
|
if (timerId) return;
|
|
|
|
|
|
|
|
if (!elem) elem = document.getElementById("ipl-progress-indicator");
|
|
|
|
|
|
|
|
timerId = setInterval(animatingWidth, intervalTimeout);
|
2021-03-04 11:36:31 +00:00
|
|
|
};
|
|
|
|
|
|
|
|
const animatingWidth = () => {
|
|
|
|
if (width >= MAX) {
|
|
|
|
clearTimeout(timerId);
|
|
|
|
timerId = null;
|
|
|
|
elem.style.width = 0;
|
|
|
|
width = 0;
|
|
|
|
return;
|
|
|
|
}
|
|
|
|
|
|
|
|
width += percentage !== MAX ? increasePercentage : moreIncreasePercentage;
|
|
|
|
elem.style.width = width + "%";
|
|
|
|
};
|
|
|
|
|
|
|
|
export default class TopLoaderService {
|
|
|
|
static start() {
|
|
|
|
percentage = 0;
|
|
|
|
startInterval();
|
|
|
|
}
|
|
|
|
|
|
|
|
static end() {
|
|
|
|
percentage = MAX;
|
|
|
|
}
|
|
|
|
}
|