@open-slot-ui/pixi 0.6.1 → 0.7.1

package/dist/index.cjs

@@ -3985,6 +3985,30 @@ var PanelBodyView = class extends ControlView {
     super.dispose();
   }
 };
+function showReplayModal(ui, info, buttonKey, onSelect) {
+  const cur = info.currency ?? ui.balance.currency.get();
+  const money = (n) => core.formatAmount(n, cur);
+  ui.showNotice(
+    [
+      { kind: "heading", id: "openui-replay-h", text: "openui.replay.title" },
+      {
+        kind: "stat-grid",
+        id: "openui-replay-g",
+        items: [
+          { label: "openui.replay.baseBet", value: money(info.baseBet) },
+          { label: "openui.replay.costMultiplier", value: `${info.costMultiplier}\xD7` },
+          { label: "openui.replay.payoutMultiplier", value: `${info.payoutMultiplier}\xD7` },
+          { label: "openui.replay.amount", value: money(info.amount) }
+        ]
+      }
+    ],
+    [{ label: buttonKey, variant: "primary", onSelect: () => {
+      ui.hideNotice();
+      onSelect();
+    } }],
+    { blocking: true }
+  );
+}
 function mountHud(app, spec = {}, opts = {}) {
   const { hooks, ...pixiOpts } = opts;
   const ui = core.createUI(spec, hooks);
@@ -4048,6 +4072,13 @@ function mountHud(app, spec = {}, opts = {}) {
     setSocial: (on2, coin) => ui.setSocial(on2, coin),
     setFreeSpins: (n) => ui.spin.setFreeSpins(n),
     setReplay: (on2) => ui.setReplay(on2),
+    replayStart: (info, onPlay) => {
+      ui.setReplay(true);
+      showReplayModal(ui, info, "openui.replay.play", () => onPlay?.());
+    },
+    replayEnd: (info, onReplay) => {
+      showReplayModal(ui, info, "openui.replay.again", onReplay);
+    },
     confirmBuy: (o) => {
       if (ui.isDisabled("buyFeature")) return;
       ui.showNotice(
@@ -4092,6 +4123,53 @@ function mountHud(app, spec = {}, opts = {}) {
     dispose: teardown
   };
 }
+
+// src/bootError.ts
+var host = null;
+var esc = (s) => s.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;");
+function showBootError(opts = {}) {
+  const title = opts.title ?? "Connection lost";
+  const message = opts.message ?? "The game could not reach the game server. Please reload to reconnect and continue.";
+  const showReload = opts.onReload !== null;
+  host ??= document.createElement("div");
+  host.className = "openui-boot-error";
+  host.setAttribute("role", "alertdialog");
+  host.setAttribute("aria-modal", "true");
+  host.innerHTML = `
+    <div class="openui-be-card">
+      <div class="openui-be-icon" aria-hidden="true">
+        <svg viewBox="0 0 48 48" width="48" height="48"><path d="M24 4 3 42h42L24 4Z" fill="none" stroke="#ffc935" stroke-width="3" stroke-linejoin="round"/><rect x="22" y="18" width="4" height="12" rx="2" fill="#ffc935"/><circle cx="24" cy="35" r="2.4" fill="#ffc935"/></svg>
+      </div>
+      <h1 class="openui-be-title">${esc(title)}</h1>
+      <p class="openui-be-msg">${esc(message)}</p>
+      ${opts.detail ? `<p class="openui-be-detail">${esc(opts.detail)}</p>` : ""}
+      ${showReload ? `<button class="openui-be-reload" type="button">${esc(opts.reloadLabel ?? "Reload")}</button>` : ""}
+    </div>
+    <style>
+      .openui-boot-error { position: fixed; inset: 0; z-index: 2147483000; display: grid; place-items: center;
+        font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif; color: #e9edf2;
+        background: rgba(6,8,11,.92); backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px); }
+      .openui-be-card { width: min(90%, 440px); text-align: center; padding: 38px 32px 34px;
+        background: #161b22; border: 1.5px solid #ffc935; border-radius: 16px; box-shadow: 0 30px 80px rgba(0,0,0,.6); }
+      .openui-be-icon { margin-bottom: 14px; line-height: 0; }
+      .openui-be-title { margin: 0 0 12px; font-size: 24px; font-weight: 800; color: #ffc935; letter-spacing: .3px; }
+      .openui-be-msg { margin: 0 0 20px; font-size: 15px; line-height: 1.55; color: #c4ccd6; }
+      .openui-be-detail { margin: 0 0 20px; font-size: 12px; line-height: 1.4; color: #78828f; word-break: break-word; }
+      .openui-be-reload { appearance: none; border: 0; cursor: pointer; padding: 13px 42px; border-radius: 999px;
+        background: #ffc935; color: #161b22; font-weight: 800; font-size: 15px; letter-spacing: .3px;
+        box-shadow: 0 8px 22px rgba(255,201,53,.32); transition: transform .12s, filter .12s; }
+      .openui-be-reload:hover { filter: brightness(1.06); }
+      .openui-be-reload:active { transform: scale(.96); }
+    </style>`;
+  if (showReload) {
+    host.querySelector(".openui-be-reload")?.addEventListener("click", () => (opts.onReload ?? (() => window.location.reload()))());
+  }
+  if (!host.isConnected) document.body.appendChild(host);
+}
+function hideBootError() {
+  host?.remove();
+  host = null;
+}
 var ANCHOR_X = 100 / 203;
 var ANCHOR_Y = 100 / 213;
 var TARGET_DIAMETER = 220;
@@ -4143,8 +4221,10 @@ exports.ValueDisplayView = ValueDisplayView;
 exports.buildBlockColumn = buildBlockColumn;
 exports.defaultSpinSkin = defaultSpinSkin;
 exports.drawSpin = drawSpin;
+exports.hideBootError = hideBootError;
 exports.isDesktop = isDesktop;
 exports.mountHud = mountHud;
+exports.showBootError = showBootError;
 exports.svgSpinSkin = svgSpinSkin;
 //# sourceMappingURL=index.cjs.map
 //# sourceMappingURL=index.cjs.map