@energy8platform/shell 0.7.2 → 0.9.0

package/dist/html.cjs.js

@@ -1691,9 +1691,41 @@ class KeyboardController {
     }
 }
 
+/**
+ * Can the player in front of this client actually press a key?
+ *
+ * The shell documents its shortcuts in a Hotkeys section and binds Spacebar to spin. On a phone
+ * neither is reachable, and showing a keycap chart to someone holding a touchscreen is a promise
+ * the game can't keep — a certification lab reads it as a feature offered where it doesn't work.
+ *
+ * The question is deliberately NOT "is the layout narrow" (a portrait desktop window still has a
+ * keyboard) and NOT "is there a touchscreen" (a touch laptop has both). It is: what does the
+ * PRIMARY pointer look like, and can it hover? Coarse-and-hoverless is a touchscreen, and a
+ * touchscreen is the one case where the keys genuinely aren't there.
+ *
+ * A tablet with a keyboard case answers "coarse, no hover" too and loses the chart. That is the
+ * right side to be wrong on: the chart is a convenience, and the keys keep working for anyone who
+ * has them — the media query only decides what the shell ADVERTISES (hosts can still say outright,
+ * via `features.hotkeys`, and the platform's own `device` field does exactly that).
+ */
+/** A touchscreen: the primary pointer is a finger, and nothing can hover. */
+const TOUCH_ONLY = '(pointer: coarse) and (hover: none)';
+function keyboardCapable(win = typeof window === 'undefined' ? undefined : window) {
+    // No window (SSR, node tests) or a browser too old for matchMedia: assume a keyboard rather than
+    // silently stripping shortcuts from a desktop we simply failed to measure.
+    if (typeof win?.matchMedia !== 'function')
+        return true;
+    try {
+        return !win.matchMedia(TOUCH_ONLY).matches;
+    }
+    catch {
+        return true;
+    }
+}
+
 // AUTO-GENERATED by scripts/gen-version.mjs — do not edit. Mirrors package.json "version".
 /** The @energy8platform/shell package version, stamped into the game-info footer. */
-const PACKAGE_VERSION = '0.7.2';
+const PACKAGE_VERSION = '0.9.0';
 
 /** Apply defaults to the raw config (the mount target lives on the renderer, not here). */
 function resolveConfig(config) {
@@ -1707,7 +1739,10 @@ function resolveConfig(config) {
         win: config.win,
         mode: config.mode,
         gameInfo: config.gameInfo,
-        features: config.features,
+        // `hotkeys` unset means "decide for me": a touchscreen has no keys to press, so the shell
+        // neither binds them nor advertises them there. A host that knows better — the platform's own
+        // `device` field, a jurisdiction rule — says so outright and that wins. See core/device.ts.
+        features: { ...config.features, hotkeys: config.features.hotkeys ?? keyboardCapable() },
         theme: config.theme,
         onBonusBuy: config.onBonusBuy,
         volumes: config.volumes,
@@ -1801,7 +1836,11 @@ class ShellController extends EventEmitter {
                 this.renderer.renderBar();
             },
             toggleAutoplay: () => {
-                if (this.state.autoplay.active)
+                // A halted run (stopped, but with spins still owed after a lost connection) counts as
+                // "autoplay is on screen": the toggle retires its leftover count, exactly as it stops a
+                // running one. Resuming those spins is the disc's job, not this one's.
+                const { active, remaining } = this.state.autoplay;
+                if (active || remaining > 0)
                     a.stopAutoplay();
                 else
                     this.openAutoplayPicker();
@@ -2264,6 +2303,11 @@ const SHELL_CSS = SHELL_FONT_CSS + SHELL_DIGIT_FONT_CSS + `
 /* the STOP glyph is a solid dark square, so the autoplay count is always pure white to read on it. */
 #${SHELL_ROOT_ID} .ge-spin-count { position:absolute; inset:0; display:flex; align-items:center; justify-content:center;
   font-size:22px; font-weight:800; line-height:1; font-variant-numeric:tabular-nums; color:#fff; }
+/* autoplay halted with spins still owed (a lost connection): the run is stopped, so no STOP square —
+   the auto glyph sits above the leftover count, both in the disc's own ink, and a tap resumes. */
+#${SHELL_ROOT_ID} .ge-shell-spin.ge-auto-paused { flex-direction:column; gap:1px; position:relative; }
+#${SHELL_ROOT_ID} .ge-auto-paused .ge-spin-auto { display:flex; font-size:.46em; line-height:0; }
+#${SHELL_ROOT_ID} .ge-auto-paused .ge-spin-count { position:static; inset:auto; color:inherit; font-size:20px; }
 
 /* BUY BONUS — round accent badge, 2-line label, text pulses + accent glow on hover */
 #${SHELL_ROOT_ID} .ge-shell-buybonus { pointer-events:auto; cursor:pointer; box-sizing:border-box;
@@ -3085,22 +3129,36 @@ function buyBtn(host) {
 function betLocked(host) {
     return host.state.busy || host.state.autoplay.active;
 }
-/** SPIN disc — rotates while busy; becomes a STOP + countdown while autoplay runs. */
+/**
+ * SPIN disc — rotates while busy; becomes a STOP + countdown while autoplay runs; becomes an
+ * autoplay glyph + the SAME countdown when a run was halted with spins still owed (a lost
+ * connection), where a tap resumes it. That third state is what a certification lab means by "after
+ * reconnection the counter is displayed correctly": the run stopped, but the spins the player asked
+ * for are still on screen and one tap away, instead of silently reset to zero.
+ */
 function spinButton(host) {
     const { state } = host;
     const sp = document.createElement('button');
     sp.className = 'ge-shell-spin';
     sp.dataset.ge = 'spin';
+    const rem = state.autoplay.remaining;
+    const count = Number.isFinite(rem) ? String(rem) : '∞';
     if (state.autoplay.active) {
         sp.classList.add('ge-stop');
-        const rem = state.autoplay.remaining;
-        const label = Number.isFinite(rem) ? String(rem) : '∞';
-        sp.innerHTML = `<span class="ge-spin-stop">${icon('stop')}</span><span class="ge-spin-count">${label}</span>`;
+        sp.innerHTML = `<span class="ge-spin-stop">${icon('stop')}</span><span class="ge-spin-count">${count}</span>`;
         sp.addEventListener('click', () => {
             if (!sp.disabled)
                 host.actions.stopAutoplay();
         });
     }
+    else if (rem > 0) {
+        sp.classList.add('ge-auto-paused');
+        sp.innerHTML = `<span class="ge-spin-auto">${icon('autoplay')}</span><span class="ge-spin-count">${count}</span>`;
+        sp.addEventListener('click', () => {
+            if (!sp.disabled)
+                host.actions.startAutoplay(rem);
+        });
+    }
     else {
         sp.innerHTML = icon('spin');
         if (state.busy)
@@ -3120,8 +3178,11 @@ function autoButton(host) {
         b.classList.add('ge-glow');
     return b;
 }
+/** Same button, three jobs: stop a running run, retire a halted run's leftover count (which frees
+ *  the disc for a manual spin again), or open the picker. */
 function onAutoplay(host) {
-    if (host.state.autoplay.active)
+    const { active, remaining } = host.state.autoplay;
+    if (active || remaining > 0)
         host.actions.stopAutoplay();
     else
         host.actions.openAutoplayPicker();
@@ -3477,10 +3538,15 @@ function openGameInfoModal(host) {
         onBack: () => { root.remove(); host.actions.openMenu(); },
     });
     root.dataset.ge = 'info-modal';
-    const rawSections = host.config.gameInfo.sections ?? [];
-    // Auto-inject a hotkeys section unless the game already provides one or features.hotkeys === false.
+    const allSections = host.config.gameInfo.sections ?? [];
+    // Auto-inject a hotkeys section unless the game already provides one. With hotkeys off — a
+    // jurisdiction that forbids them, or a touchscreen that has no keys at all (see core/device.ts) —
+    // there is no keyboard surface to document, and a game-supplied section is dropped along with the
+    // auto-injected one: a keycap chart for keys the player cannot press is a promise the game breaks.
+    const keys = host.config.features.hotkeys !== false;
+    const rawSections = keys ? allSections : allSections.filter((s) => s.type !== 'hotkeys');
     const sectionsWithHotkeys = [...rawSections];
-    if (host.config.features.hotkeys !== false && !rawSections.some((s) => s.type === 'hotkeys')) {
+    if (keys && !rawSections.some((s) => s.type === 'hotkeys')) {
         sectionsWithHotkeys.push({ type: 'hotkeys', order: HOTKEYS_DEFAULT_ORDER });
     }
     const sections = sectionsWithHotkeys;