@jax-data-science/sci-image-visualizer 0.7.0 → 0.8.0

package/esm2022/lib/implementations/napari-js/napari-loading-badge.mjs

@@ -0,0 +1,73 @@
+/**
+ * "Transcripts reloading…" at the bottom of the canvas while a layer's data is in flight: one
+ * line naming every layer still loading, on a semi-opaque backing so it reads over any tissue.
+ *
+ * Shown only once something has been loading for {@link SHOW_AFTER_MS}, so a redraw served from
+ * cache does not flash it.
+ */
+export const SHOW_AFTER_MS = 150;
+export class NapariLoadingBadge {
+    constructor(host) {
+        this.host = host;
+        this.names = [];
+        this.timer = null;
+        if (getComputedStyle(host).position === 'static')
+            host.style.position = 'relative';
+        this.el = document.createElement('div');
+        this.el.className = 'napari-loading-badge';
+        this.el.setAttribute('role', 'status');
+        this.el.setAttribute('aria-live', 'polite');
+        Object.assign(this.el.style, {
+            position: 'absolute',
+            left: '50%',
+            bottom: '12px',
+            transform: 'translateX(-50%)',
+            padding: '4px 12px',
+            borderRadius: '12px',
+            background: 'rgba(0, 0, 0, 0.6)',
+            color: '#fff',
+            font: '12px/1.4 system-ui, sans-serif',
+            whiteSpace: 'nowrap',
+            pointerEvents: 'none',
+            zIndex: '5',
+            display: 'none',
+        });
+        host.appendChild(this.el);
+    }
+    /** The layers loading now; empty hides the badge. */
+    set(names) {
+        this.names = [...new Set(names)];
+        if (!this.names.length) {
+            if (this.timer)
+                clearTimeout(this.timer);
+            this.timer = null;
+            this.el.style.display = 'none';
+            return;
+        }
+        this.el.textContent = `${listOf(this.names)} reloading…`;
+        if (this.el.style.display === 'block' || this.timer)
+            return;
+        this.timer = setTimeout(() => {
+            this.timer = null;
+            if (this.names.length)
+                this.el.style.display = 'block';
+        }, SHOW_AFTER_MS);
+    }
+    /** The text currently set (shown or about to be). */
+    get text() {
+        return this.names.length ? this.el.textContent ?? '' : '';
+    }
+    destroy() {
+        if (this.timer)
+            clearTimeout(this.timer);
+        this.el.remove();
+    }
+}
+/** "A", "A and B", "A, B and C" — the first capitalised, the rest as they are. */
+function listOf(names) {
+    const [first, ...rest] = names;
+    const lower = rest.map((n) => n.charAt(0).toLowerCase() + n.slice(1));
+    const all = [first, ...lower];
+    return all.length === 1 ? all[0] : `${all.slice(0, -1).join(', ')} and ${all[all.length - 1]}`;
+}
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibmFwYXJpLWxvYWRpbmctYmFkZ2UuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi9zcmMvbGliL2ltcGxlbWVudGF0aW9ucy9uYXBhcmktanMvbmFwYXJpLWxvYWRpbmctYmFkZ2UudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUE7Ozs7OztHQU1HO0FBQ0gsTUFBTSxDQUFDLE1BQU0sYUFBYSxHQUFHLEdBQUcsQ0FBQztBQUVqQyxNQUFNLE9BQU8sa0JBQWtCO0lBSzdCLFlBQTZCLElBQWlCO1FBQWpCLFNBQUksR0FBSixJQUFJLENBQWE7UUFIdEMsVUFBSyxHQUFhLEVBQUUsQ0FBQztRQUNyQixVQUFLLEdBQXlDLElBQUksQ0FBQztRQUd6RCxJQUFJLGdCQUFnQixDQUFDLElBQUksQ0FBQyxDQUFDLFFBQVEsS0FBSyxRQUFRO1lBQUUsSUFBSSxDQUFDLEtBQUssQ0FBQyxRQUFRLEdBQUcsVUFBVSxDQUFDO1FBQ25GLElBQUksQ0FBQyxFQUFFLEdBQUcsUUFBUSxDQUFDLGFBQWEsQ0FBQyxLQUFLLENBQUMsQ0FBQztRQUN4QyxJQUFJLENBQUMsRUFBRSxDQUFDLFNBQVMsR0FBRyxzQkFBc0IsQ0FBQztRQUMzQyxJQUFJLENBQUMsRUFBRSxDQUFDLFlBQVksQ0FBQyxNQUFNLEVBQUUsUUFBUSxDQUFDLENBQUM7UUFDdkMsSUFBSSxDQUFDLEVBQUUsQ0FBQyxZQUFZLENBQUMsV0FBVyxFQUFFLFFBQVEsQ0FBQyxDQUFDO1FBQzVDLE1BQU0sQ0FBQyxNQUFNLENBQUMsSUFBSSxDQUFDLEVBQUUsQ0FBQyxLQUFLLEVBQUU7WUFDM0IsUUFBUSxFQUFFLFVBQVU7WUFDcEIsSUFBSSxFQUFFLEtBQUs7WUFDWCxNQUFNLEVBQUUsTUFBTTtZQUNkLFNBQVMsRUFBRSxrQkFBa0I7WUFDN0IsT0FBTyxFQUFFLFVBQVU7WUFDbkIsWUFBWSxFQUFFLE1BQU07WUFDcEIsVUFBVSxFQUFFLG9CQUFvQjtZQUNoQyxLQUFLLEVBQUUsTUFBTTtZQUNiLElBQUksRUFBRSxnQ0FBZ0M7WUFDdEMsVUFBVSxFQUFFLFFBQVE7WUFDcEIsYUFBYSxFQUFFLE1BQU07WUFDckIsTUFBTSxFQUFFLEdBQUc7WUFDWCxPQUFPLEVBQUUsTUFBTTtTQUN1QixDQUFDLENBQUM7UUFDMUMsSUFBSSxDQUFDLFdBQVcsQ0FBQyxJQUFJLENBQUMsRUFBRSxDQUFDLENBQUM7SUFDNUIsQ0FBQztJQUVELHFEQUFxRDtJQUNyRCxHQUFHLENBQUMsS0FBd0I7UUFDMUIsSUFBSSxDQUFDLEtBQUssR0FBRyxDQUFDLEdBQUcsSUFBSSxHQUFHLENBQUMsS0FBSyxDQUFDLENBQUMsQ0FBQztRQUNqQyxJQUFJLENBQUMsSUFBSSxDQUFDLEtBQUssQ0FBQyxNQUFNLEVBQUUsQ0FBQztZQUN2QixJQUFJLElBQUksQ0FBQyxLQUFLO2dCQUFFLFlBQVksQ0FBQyxJQUFJLENBQUMsS0FBSyxDQUFDLENBQUM7WUFDekMsSUFBSSxDQUFDLEtBQUssR0FBRyxJQUFJLENBQUM7WUFDbEIsSUFBSSxDQUFDLEVBQUUsQ0FBQyxLQUFLLENBQUMsT0FBTyxHQUFHLE1BQU0sQ0FBQztZQUMvQixPQUFPO1FBQ1QsQ0FBQztRQUNELElBQUksQ0FBQyxFQUFFLENBQUMsV0FBVyxHQUFHLEdBQUcsTUFBTSxDQUFDLElBQUksQ0FBQyxLQUFLLENBQUMsYUFBYSxDQUFDO1FBQ3pELElBQUksSUFBSSxDQUFDLEVBQUUsQ0FBQyxLQUFLLENBQUMsT0FBTyxLQUFLLE9BQU8sSUFBSSxJQUFJLENBQUMsS0FBSztZQUFFLE9BQU87UUFDNUQsSUFBSSxDQUFDLEtBQUssR0FBRyxVQUFVLENBQUMsR0FBRyxFQUFFO1lBQzNCLElBQUksQ0FBQyxLQUFLLEdBQUcsSUFBSSxDQUFDO1lBQ2xCLElBQUksSUFBSSxDQUFDLEtBQUssQ0FBQyxNQUFNO2dCQUFFLElBQUksQ0FBQyxFQUFFLENBQUMsS0FBSyxDQUFDLE9BQU8sR0FBRyxPQUFPLENBQUM7UUFDekQsQ0FBQyxFQUFFLGFBQWEsQ0FBQyxDQUFDO0lBQ3BCLENBQUM7SUFFRCxxREFBcUQ7SUFDckQsSUFBSSxJQUFJO1FBQ04sT0FBTyxJQUFJLENBQUMsS0FBSyxDQUFDLE1BQU0sQ0FBQyxDQUFDLENBQUMsSUFBSSxDQUFDLEVBQUUsQ0FBQyxXQUFXLElBQUksRUFBRSxDQUFDLENBQUMsQ0FBQyxFQUFFLENBQUM7SUFDNUQsQ0FBQztJQUVELE9BQU87UUFDTCxJQUFJLElBQUksQ0FBQyxLQUFLO1lBQUUsWUFBWSxDQUFDLElBQUksQ0FBQyxLQUFLLENBQUMsQ0FBQztRQUN6QyxJQUFJLENBQUMsRUFBRSxDQUFDLE1BQU0sRUFBRSxDQUFDO0lBQ25CLENBQUM7Q0FDRjtBQUVELGtGQUFrRjtBQUNsRixTQUFTLE1BQU0sQ0FBQyxLQUFlO0lBQzdCLE1BQU0sQ0FBQyxLQUFLLEVBQUUsR0FBRyxJQUFJLENBQUMsR0FBRyxLQUFLLENBQUM7SUFDL0IsTUFBTSxLQUFLLEdBQUcsSUFBSSxDQUFDLEdBQUcsQ0FBQyxDQUFDLENBQUMsRUFBRSxFQUFFLENBQUMsQ0FBQyxDQUFDLE1BQU0sQ0FBQyxDQUFDLENBQUMsQ0FBQyxXQUFXLEVBQUUsR0FBRyxDQUFDLENBQUMsS0FBSyxDQUFDLENBQUMsQ0FBQyxDQUFDLENBQUM7SUFDdEUsTUFBTSxHQUFHLEdBQUcsQ0FBQyxLQUFLLEVBQUUsR0FBRyxLQUFLLENBQUMsQ0FBQztJQUM5QixPQUFPLEdBQUcsQ0FBQyxNQUFNLEtBQUssQ0FBQyxDQUFDLENBQUMsQ0FBQyxHQUFHLENBQUMsQ0FBQyxDQUFDLENBQUMsQ0FBQyxDQUFDLEdBQUcsR0FBRyxDQUFDLEtBQUssQ0FBQyxDQUFDLEVBQUUsQ0FBQyxDQUFDLENBQUMsQ0FBQyxJQUFJLENBQUMsSUFBSSxDQUFDLFFBQVEsR0FBRyxDQUFDLEdBQUcsQ0FBQyxNQUFNLEdBQUcsQ0FBQyxDQUFDLEVBQUUsQ0FBQztBQUNqRyxDQUFDIiwic291cmNlc0NvbnRlbnQiOlsiLyoqXG4gKiBcIlRyYW5zY3JpcHRzIHJlbG9hZGluZ+KAplwiIGF0IHRoZSBib3R0b20gb2YgdGhlIGNhbnZhcyB3aGlsZSBhIGxheWVyJ3MgZGF0YSBpcyBpbiBmbGlnaHQ6IG9uZVxuICogbGluZSBuYW1pbmcgZXZlcnkgbGF5ZXIgc3RpbGwgbG9hZGluZywgb24gYSBzZW1pLW9wYXF1ZSBiYWNraW5nIHNvIGl0IHJlYWRzIG92ZXIgYW55IHRpc3N1ZS5cbiAqXG4gKiBTaG93biBvbmx5IG9uY2Ugc29tZXRoaW5nIGhhcyBiZWVuIGxvYWRpbmcgZm9yIHtAbGluayBTSE9XX0FGVEVSX01TfSwgc28gYSByZWRyYXcgc2VydmVkIGZyb21cbiAqIGNhY2hlIGRvZXMgbm90IGZsYXNoIGl0LlxuICovXG5leHBvcnQgY29uc3QgU0hPV19BRlRFUl9NUyA9IDE1MDtcblxuZXhwb3J0IGNsYXNzIE5hcGFyaUxvYWRpbmdCYWRnZSB7XG4gIHByaXZhdGUgcmVhZG9ubHkgZWw6IEhUTUxEaXZFbGVtZW50O1xuICBwcml2YXRlIG5hbWVzOiBzdHJpbmdbXSA9IFtdO1xuICBwcml2YXRlIHRpbWVyOiBSZXR1cm5UeXBlPHR5cGVvZiBzZXRUaW1lb3V0PiB8IG51bGwgPSBudWxsO1xuXG4gIGNvbnN0cnVjdG9yKHByaXZhdGUgcmVhZG9ubHkgaG9zdDogSFRNTEVsZW1lbnQpIHtcbiAgICBpZiAoZ2V0Q29tcHV0ZWRTdHlsZShob3N0KS5wb3NpdGlvbiA9PT0gJ3N0YXRpYycpIGhvc3Quc3R5bGUucG9zaXRpb24gPSAncmVsYXRpdmUnO1xuICAgIHRoaXMuZWwgPSBkb2N1bWVudC5jcmVhdGVFbGVtZW50KCdkaXYnKTtcbiAgICB0aGlzLmVsLmNsYXNzTmFtZSA9ICduYXBhcmktbG9hZGluZy1iYWRnZSc7XG4gICAgdGhpcy5lbC5zZXRBdHRyaWJ1dGUoJ3JvbGUnLCAnc3RhdHVzJyk7XG4gICAgdGhpcy5lbC5zZXRBdHRyaWJ1dGUoJ2FyaWEtbGl2ZScsICdwb2xpdGUnKTtcbiAgICBPYmplY3QuYXNzaWduKHRoaXMuZWwuc3R5bGUsIHtcbiAgICAgIHBvc2l0aW9uOiAnYWJzb2x1dGUnLFxuICAgICAgbGVmdDogJzUwJScsXG4gICAgICBib3R0b206ICcxMnB4JyxcbiAgICAgIHRyYW5zZm9ybTogJ3RyYW5zbGF0ZVgoLTUwJSknLFxuICAgICAgcGFkZGluZzogJzRweCAxMnB4JyxcbiAgICAgIGJvcmRlclJhZGl1czogJzEycHgnLFxuICAgICAgYmFja2dyb3VuZDogJ3JnYmEoMCwgMCwgMCwgMC42KScsXG4gICAgICBjb2xvcjogJyNmZmYnLFxuICAgICAgZm9udDogJzEycHgvMS40IHN5c3RlbS11aSwgc2Fucy1zZXJpZicsXG4gICAgICB3aGl0ZVNwYWNlOiAnbm93cmFwJyxcbiAgICAgIHBvaW50ZXJFdmVudHM6ICdub25lJyxcbiAgICAgIHpJbmRleDogJzUnLFxuICAgICAgZGlzcGxheTogJ25vbmUnLFxuICAgIH0gc2F0aXNmaWVzIFBhcnRpYWw8Q1NTU3R5bGVEZWNsYXJhdGlvbj4pO1xuICAgIGhvc3QuYXBwZW5kQ2hpbGQodGhpcy5lbCk7XG4gIH1cblxuICAvKiogVGhlIGxheWVycyBsb2FkaW5nIG5vdzsgZW1wdHkgaGlkZXMgdGhlIGJhZGdlLiAqL1xuICBzZXQobmFtZXM6IHJlYWRvbmx5IHN0cmluZ1tdKTogdm9pZCB7XG4gICAgdGhpcy5uYW1lcyA9IFsuLi5uZXcgU2V0KG5hbWVzKV07XG4gICAgaWYgKCF0aGlzLm5hbWVzLmxlbmd0aCkge1xuICAgICAgaWYgKHRoaXMudGltZXIpIGNsZWFyVGltZW91dCh0aGlzLnRpbWVyKTtcbiAgICAgIHRoaXMudGltZXIgPSBudWxsO1xuICAgICAgdGhpcy5lbC5zdHlsZS5kaXNwbGF5ID0gJ25vbmUnO1xuICAgICAgcmV0dXJuO1xuICAgIH1cbiAgICB0aGlzLmVsLnRleHRDb250ZW50ID0gYCR7bGlzdE9mKHRoaXMubmFtZXMpfSByZWxvYWRpbmfigKZgO1xuICAgIGlmICh0aGlzLmVsLnN0eWxlLmRpc3BsYXkgPT09ICdibG9jaycgfHwgdGhpcy50aW1lcikgcmV0dXJuO1xuICAgIHRoaXMudGltZXIgPSBzZXRUaW1lb3V0KCgpID0+IHtcbiAgICAgIHRoaXMudGltZXIgPSBudWxsO1xuICAgICAgaWYgKHRoaXMubmFtZXMubGVuZ3RoKSB0aGlzLmVsLnN0eWxlLmRpc3BsYXkgPSAnYmxvY2snO1xuICAgIH0sIFNIT1dfQUZURVJfTVMpO1xuICB9XG5cbiAgLyoqIFRoZSB0ZXh0IGN1cnJlbnRseSBzZXQgKHNob3duIG9yIGFib3V0IHRvIGJlKS4gKi9cbiAgZ2V0IHRleHQoKTogc3RyaW5nIHtcbiAgICByZXR1cm4gdGhpcy5uYW1lcy5sZW5ndGggPyB0aGlzLmVsLnRleHRDb250ZW50ID8/ICcnIDogJyc7XG4gIH1cblxuICBkZXN0cm95KCk6IHZvaWQge1xuICAgIGlmICh0aGlzLnRpbWVyKSBjbGVhclRpbWVvdXQodGhpcy50aW1lcik7XG4gICAgdGhpcy5lbC5yZW1vdmUoKTtcbiAgfVxufVxuXG4vKiogXCJBXCIsIFwiQSBhbmQgQlwiLCBcIkEsIEIgYW5kIENcIiDigJQgdGhlIGZpcnN0IGNhcGl0YWxpc2VkLCB0aGUgcmVzdCBhcyB0aGV5IGFyZS4gKi9cbmZ1bmN0aW9uIGxpc3RPZihuYW1lczogc3RyaW5nW10pOiBzdHJpbmcge1xuICBjb25zdCBbZmlyc3QsIC4uLnJlc3RdID0gbmFtZXM7XG4gIGNvbnN0IGxvd2VyID0gcmVzdC5tYXAoKG4pID0+IG4uY2hhckF0KDApLnRvTG93ZXJDYXNlKCkgKyBuLnNsaWNlKDEpKTtcbiAgY29uc3QgYWxsID0gW2ZpcnN0LCAuLi5sb3dlcl07XG4gIHJldHVybiBhbGwubGVuZ3RoID09PSAxID8gYWxsWzBdIDogYCR7YWxsLnNsaWNlKDAsIC0xKS5qb2luKCcsICcpfSBhbmQgJHthbGxbYWxsLmxlbmd0aCAtIDFdfWA7XG59XG4iXX0=