@open-slot-ui/pixi 0.1.0 → 0.2.0

package/dist/index.cjs

@@ -1513,7 +1513,7 @@ var TurboView = class extends ControlView {
     } else {
       this.art.addChild(this.bg);
     }
-    this.addChild(this.art, this.pips);
+    this.addChild(this.art);
     this.eventMode = "static";
     this.cursor = "pointer";
     this.hitArea = new pixi_js.Circle(0, 0, (this.sprite ? this.target / 2 : this.radius) + 8);
@@ -1528,7 +1528,6 @@ var TurboView = class extends ControlView {
   turbo;
   art = new pixi_js.Container();
   bg = new pixi_js.Graphics();
-  pips = new pixi_js.Graphics();
   sprite;
   tween;
   modeTex;
@@ -1565,19 +1564,6 @@ var TurboView = class extends ControlView {
       this.bg.circle(0, 0, r).fill({ color: lit ? th.color.accent : th.color.surface, alpha: lit ? Math.min(1, 0.55 + i * 0.25) : 1 }).stroke({ width: 4, color: th.color.accent });
       this.bg.poly([-6, -r * 0.42, 8, -4, 0, -4, 7, r * 0.42, -9, 2, 0, 2]).fill({ color: lit ? th.color.accentText : th.color.accent, alpha: disabled ? 0.5 : 1 });
     }
-    this.pips.clear();
-    const steps = this.turbo.modeCount - 1;
-    if (steps >= 2) {
-      const baseR = this.sprite ? this.target / 2 : this.radius;
-      const gap = 16;
-      const total = (steps - 1) * gap;
-      const y = baseR + 14;
-      for (let s = 0; s < steps; s++) {
-        const x = -total / 2 + s * gap;
-        const on = s < i;
-        this.pips.circle(x, y, 5).fill({ color: on ? th.color.accent : th.color.surface, alpha: disabled ? 0.5 : 1 }).stroke({ width: 2, color: th.color.accent, alpha: disabled ? 0.5 : 1 });
-      }
-    }
   }
   play(t) {
     this.animating = true;
@@ -3247,73 +3233,6 @@ var DialogView = class extends ControlView {
     super.dispose();
   }
 };
-var BAR_H = 26;
-var StatusBarView = class _StatusBarView extends pixi_js.Container {
-  constructor(controls, ui, ticker, side) {
-    super();
-    this.ui = ui;
-    this.side = side;
-    this.zIndex = 300;
-    this.addChild(this.bg);
-    for (const c of controls) {
-      const view = new ReadoutView(c, ui, ticker, { inline: true, mono: true });
-      this.addChild(view);
-      this.items.push({ id: c.id, view });
-    }
-    this.disposers.push(
-      this.ui.on("visibilityChanged", ({ id }) => {
-        if (this.items.some((it) => it.id === id)) this.relayout();
-      })
-    );
-  }
-  ui;
-  side;
-  bg = new pixi_js.Graphics();
-  items = [];
-  screen;
-  disposers = [];
-  /** The strip's pixel height for the current screen (used for the HUD margin too). */
-  static heightFor(screen) {
-    const scale = Math.max(0.7, Math.min(1.4, screen.scale));
-    return Math.round(BAR_H * scale);
-  }
-  applyLayout(screen) {
-    this.screen = screen;
-    this.relayout();
-  }
-  relayout() {
-    const s = this.screen;
-    if (!s) return;
-    const W = s.width;
-    const H = s.height;
-    const scale = Math.max(0.7, Math.min(1.4, s.scale));
-    const barH = _StatusBarView.heightFor(s);
-    const y = this.side === "top" ? 0 : H - barH;
-    this.position.set(0, 0);
-    const visible = this.items.filter((it) => !this.ui.hidden.has(it.id));
-    for (const it of this.items) it.view.visible = !this.ui.hidden.has(it.id);
-    this.bg.clear();
-    this.visible = visible.length > 0;
-    if (!visible.length) return;
-    const edgeY = this.side === "top" ? barH - 1 : y;
-    this.bg.rect(0, y, W, barH).fill({ color: 789776, alpha: 0.92 }).rect(0, edgeY, W, 1).fill({ color: 16777215, alpha: 0.18 });
-    const n = visible.length;
-    const cy = y + barH / 2;
-    const pad = 18 * scale;
-    const usableW = Math.max(160, W - pad * 2);
-    visible.forEach((it, i) => {
-      it.view.position.set(pad + usableW * ((i + 0.5) / n), cy);
-      it.view.scale.set(scale);
-    });
-  }
-  dispose() {
-    for (const it of this.items) it.view.dispose();
-    this.items.length = 0;
-    for (const d of this.disposers) d();
-    this.disposers.length = 0;
-    if (!this.destroyed) this.destroy({ children: true });
-  }
-};
 
 // src/OpenUIPixi.ts
 function easeInOutCubic(p) {
@@ -3396,11 +3315,10 @@ var OpenUIPixi = class {
     const fullscreenView = new ButtonView(this.ui.fullscreenButton, this.ui, ticker, { shape: "circle", radius: 30, glyph: "fullscreen", iconTarget: 60, mono: true });
     muteView.zIndex = 65;
     fullscreenView.zIndex = 65;
-    const statusBarSide = this.opts.statusBar;
     const roOpts = { prefix: true, fill: this.opts.readoutColor };
-    const rtpView = statusBarSide ? void 0 : new ReadoutView(this.ui.rtp, this.ui, ticker, roOpts);
-    const netView = statusBarSide ? void 0 : new ReadoutView(this.ui.netPosition, this.ui, ticker, roOpts);
-    const timerView = statusBarSide ? void 0 : new ReadoutView(this.ui.sessionTimer, this.ui, ticker, roOpts);
+    const rtpView = new ReadoutView(this.ui.rtp, this.ui, ticker, roOpts);
+    const netView = new ReadoutView(this.ui.netPosition, this.ui, ticker, roOpts);
+    const timerView = new ReadoutView(this.ui.sessionTimer, this.ui, ticker, roOpts);
     const entries = [
       [this.ui.spin.id, spinView],
       [this.ui.balance.id, balanceView],
@@ -3414,9 +3332,9 @@ var OpenUIPixi = class {
       [this.ui.muteButton.id, muteView],
       [this.ui.fullscreenButton.id, fullscreenView]
     ];
-    if (rtpView) entries.push([this.ui.rtp.id, rtpView]);
-    if (netView) entries.push([this.ui.netPosition.id, netView]);
-    if (timerView) entries.push([this.ui.sessionTimer.id, timerView]);
+    entries.push([this.ui.rtp.id, rtpView]);
+    entries.push([this.ui.netPosition.id, netView]);
+    entries.push([this.ui.sessionTimer.id, timerView]);
     const viewById = /* @__PURE__ */ new Map();
     const idByView = /* @__PURE__ */ new Map();
     for (const [id, view] of entries) {
@@ -3477,28 +3395,22 @@ var OpenUIPixi = class {
     const dialog = new DialogView(this.ui.noticePanel, this.ui.noticeBlocks, this.ui.noticeActions, this.ui, ticker, { controlSkins: this.opts.controlSkins });
     this.root.addChild(dialog);
     this.overlays.push(dialog);
-    if (statusBarSide) {
-      const bar = new StatusBarView([this.ui.netPosition, this.ui.rtp, this.ui.sessionTimer], this.ui, ticker, statusBarSide);
-      this.root.addChild(bar);
-      this.overlays.push(bar);
-    } else {
-      const vignette = new pixi_js.Graphics();
-      vignette.zIndex = -1;
-      this.root.addChild(vignette);
-      this.overlays.push({
-        applyLayout: (s) => {
-          const r = 200 * s.scale;
-          vignette.clear();
-          for (let i = 0; i < 14; i++) {
-            const t = i / 14;
-            vignette.circle(0, 0, r * (1 - t)).fill({ color: 0, alpha: 0.5 / 14 });
-          }
-        },
-        dispose: () => {
-          if (!vignette.destroyed) vignette.destroy();
+    const vignette = new pixi_js.Graphics();
+    vignette.zIndex = -1;
+    this.root.addChild(vignette);
+    this.overlays.push({
+      applyLayout: (s) => {
+        const r = 200 * s.scale;
+        vignette.clear();
+        for (let i = 0; i < 14; i++) {
+          const t = i / 14;
+          vignette.circle(0, 0, r * (1 - t)).fill({ color: 0, alpha: 0.5 / 14 });
         }
-      });
-    }
+      },
+      dispose: () => {
+        if (!vignette.destroyed) vignette.destroy();
+      }
+    });
     const replayBadge = new pixi_js.Container();
     const replayBg = new pixi_js.Graphics();
     const replayText = new pixi_js.Text({ text: this.ui.t("openui.replay").toUpperCase(), style: { fontFamily: this.ui.theme.type.family, fontSize: 16, fontWeight: "800", fill: 16777215, letterSpacing: 2 } });
@@ -3512,8 +3424,7 @@ var OpenUIPixi = class {
         const w = replayText.width + 36;
         const h = 32;
         replayBg.clear().roundRect(-w / 2, -h / 2, w, h, h / 2).fill({ color: 789776 }).stroke({ width: 2, color: 16777215 });
-        const top = statusBarSide === "top" ? StatusBarView.heightFor(s) + 28 : 40;
-        replayBadge.position.set(s.width / 2, top);
+        replayBadge.position.set(s.width / 2, 40);
       },
       dispose: () => {
         if (!replayBadge.destroyed) replayBadge.destroy({ children: true });
@@ -3529,16 +3440,11 @@ var OpenUIPixi = class {
     );
     const applyLayout = () => {
       const screen = this.ui.screen.get();
-      const barH = statusBarSide ? StatusBarView.heightFor(screen) : 0;
       this.slideBaseY.clear();
       this.slideSign.clear();
       for (const v of this.views) {
         v.applyLayout(screen);
         const anchor = this.ui.control(idByView.get(v) ?? "")?.layout.anchor ?? "bottom-center";
-        if (barH) {
-          if (statusBarSide === "top" && anchor.startsWith("top")) v.y += barH;
-          else if (statusBarSide === "bottom" && anchor.startsWith("bottom")) v.y -= barH;
-        }
         this.slideBaseY.set(v, v.y);
         this.slideSign.set(v, anchor.startsWith("top") ? -1 : 1);
       }
@@ -3951,7 +3857,7 @@ function mountHud(app, spec = {}, opts = {}) {
   if (menu && spec.game && (spec.game.name || spec.game.version)) {
     menu.push({ kind: "legal", id: "openui-game-info", text: [spec.game.name, spec.game.version ? `v${spec.game.version}` : ""].filter(Boolean).join("  \xB7  ") });
   }
-  const pixi = new OpenUIPixi(ui, { ...pixiOpts, menu, statusBar: pixiOpts.statusBar ?? spec.statusBar });
+  const pixi = new OpenUIPixi(ui, { ...pixiOpts, menu });
   pixi.mount(app);
   const extra = [];
   if (spec.panels?.length) {
@@ -4009,7 +3915,7 @@ function mountHud(app, spec = {}, opts = {}) {
       ui.showNotice(
         [
           { kind: "heading", id: "buy-title", text: o.title ?? "openui.buyFeature.title" },
-          { kind: "callout", id: "buy-body", tone: "bonus", text: o.message ?? "openui.buyFeature.message" }
+          { kind: "text", id: "buy-body", text: o.message ?? "openui.buyFeature.message" }
         ],
         [
           { label: o.cancelLabel ?? "openui.cancel", variant: "secondary" },
@@ -4071,7 +3977,6 @@ exports.ReadoutView = ReadoutView;
 exports.SelectView = SelectView;
 exports.SliderView = SliderView;
 exports.SpinView = SpinView;
-exports.StatusBarView = StatusBarView;
 exports.StepperView = StepperView;
 exports.TextCellRenderer = TextCellRenderer;
 exports.ToggleView = ToggleView;