Widget Registry

@@ -655,12 +655,16 @@     // ---------- feedback ----------     _bezel(icon) { const b = this.$('.bezel'); b.innerHTML = svg(icon, 36); b.classList.remove('go'); void b.offsetWidth; b.classList.add('go'); }     _hud(txt) { const h = this.$('.hud'); h.textContent = txt; h.classList.add('on'); clearTimeout(this._t.hud); this._t.hud = setTimeout(() => h.classList.remove('on'), 800); }+    // the "10 seconds" overlays: one timer per side (a shared timer let a back press, then a quick forward+    // press, cancel the back overlay's hide and strand it on screen); a press on one side clears the other     _seekfx(s) {-      const el = this.$(s < 0 ? '.seekfx.l' : '.seekfx.r');+      const side = s < 0 ? 'l' : 'r', other = side === 'l' ? 'r' : 'l';+      const el = this.$(`.seekfx.${side}`), op = this.$(`.seekfx.${other}`);+      clearTimeout(this._t['fx' + other]); op.classList.remove('on');       this._acc = (this._accSide === Math.sign(s) && el.classList.contains('on')) ? this._acc + Math.abs(s) : Math.abs(s);       this._accSide = Math.sign(s);       el.querySelector('span').textContent = `${this._acc} seconds`;-      el.classList.add('on'); clearTimeout(this._t.fx); this._t.fx = setTimeout(() => el.classList.remove('on'), 650);+      el.classList.add('on'); clearTimeout(this._t['fx' + side]); this._t['fx' + side] = setTimeout(() => el.classList.remove('on'), 650);     }     _show() {       this.p.classList.remove('hide-ui');