Public/automatic
1
0
Fork 0
mirror of https://github.com/vladmandic/automatic synced 2026-09-17 08:19:11 +02:00
Code Issues Packages Projects Releases Wiki Activity

Simplify and lint

Browse Source
This commit is contained in:
awsr
2026-01-01 12:02:45 -08:00
parent 16ab3dde64
commit e0b70ba0c6
2 changed files with 39 additions and 45 deletions
Download Patch File Download Diff File Expand all files Collapse all files
javascript/_simpleProgressBar.js
+28 -36
View File
@@ -1,8 +1,8 @@
class SimpleProgressBar {
#container = document.createElement("div");
#progress = document.createElement("div");
#textDiv = document.createElement("div");
#text = document.createElement("span");
#container = document.createElement('div');
#progress = document.createElement('div');
#textDiv = document.createElement('div');
#text = document.createElement('span');
#visible = false;
#hideTimeout = null;
#interval = null;
@@ -10,46 +10,44 @@ class SimpleProgressBar {
/** @type {Set} */
#monitoredSet;
constructor() {
this.#container.style.cssText = "position:relative;width:100%;background-color:hsla(0,0%,36%,0.3);height:1.2rem;margin:0;padding:0;display:none;"
this.#progress.style.cssText = "position:absolute;left:0;height:100%;width:0;transition:width 200ms;"
this.#progress.style.backgroundColor = "hsla(110, 32%, 35%, 0.80)"; // alt: "#27911d"
this.#textDiv.style.cssText = "margin:auto;width:max-content;height:100%;";
this.#text.style.cssText = "position:relative;user-select:none;color:white;"
constructor(monitoredSet) {
this.#monitoredSet = monitoredSet; // This is required because incrementing a variable with a class method turned out to not be an atomic operation
this.#container.style.cssText = 'position:relative;width:100%;background-color:hsla(0,0%,36%,0.3);height:1.2rem;margin:0;padding:0;display:none;'
this.#progress.style.cssText = 'position:absolute;left:0;height:100%;width:0;transition:width 200ms;'
this.#progress.style.backgroundColor = 'hsla(110, 32%, 35%, 0.80)'; // alt: '#27911d'
this.#textDiv.style.cssText = 'position:relative;margin:auto;width:max-content;height:100%;';
this.#text.style.cssText = 'user-select:none;color:white;'
this.#textDiv.append(this.#text);
this.#container.append(this.#progress, this.#textDiv);
}
setMax(max) {
this.clearProgress();
this.#max = max;
this.#startUpdating();
start(total) {
this.clear();
this.#max = total;
this.#interval = setInterval(() => {
this.#update(this.#monitoredSet.size, this.#max);
}, 250);
}
attach(element) {
attachTo(element) {
if (element.hasChildNodes) {
element.innerHTML = '';
}
element.appendChild(this.#container);
}
monitor(hashes) {
// This is required because incrementing a variable with a class method turned out to not be an atomic operation
this.#monitoredSet = hashes;
}
clearProgress() {
this.#stopUpdating();
clear() {
this.#stop();
clearTimeout(this.#hideTimeout);
this.#hideTimeout = null;
this.#container.style.display = "none";
this.#container.style.display = 'none';
this.#visible = false;
this.#progress.style.width = "0";
this.#text.textContent = "";
this.#progress.style.width = '0';
this.#text.textContent = '';
}
#setProgress(loaded, max) {
#update(loaded, max) {
if (this.#hideTimeout) {
this.#hideTimeout = null;
}
@@ -58,24 +56,18 @@ class SimpleProgressBar {
this.#text.textContent = `${loaded}/${max}`;
if (!this.#visible) {
this.#container.style.display = "block";
this.#container.style.display = 'block';
this.#visible = true;
}
if (loaded >= max) {
this.#stopUpdating()
this.#stop()
this.#hideTimeout = setTimeout(() => {
this.clearProgress();
this.clear();
}, 1000);
}
}
#startUpdating() {
this.#interval = setInterval(() => {
this.#setProgress(this.#monitoredSet.size, this.#max);
}, 250);
}
#stopUpdating() {
#stop() {
clearInterval(this.#interval);
this.#interval = null;
}