@open-slot-ui/pixi 0.1.0 → 0.1.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.cjs CHANGED
@@ -3247,73 +3247,6 @@ var DialogView = class extends ControlView {
3247
3247
  super.dispose();
3248
3248
  }
3249
3249
  };
3250
- var BAR_H = 26;
3251
- var StatusBarView = class _StatusBarView extends pixi_js.Container {
3252
- constructor(controls, ui, ticker, side) {
3253
- super();
3254
- this.ui = ui;
3255
- this.side = side;
3256
- this.zIndex = 300;
3257
- this.addChild(this.bg);
3258
- for (const c of controls) {
3259
- const view = new ReadoutView(c, ui, ticker, { inline: true, mono: true });
3260
- this.addChild(view);
3261
- this.items.push({ id: c.id, view });
3262
- }
3263
- this.disposers.push(
3264
- this.ui.on("visibilityChanged", ({ id }) => {
3265
- if (this.items.some((it) => it.id === id)) this.relayout();
3266
- })
3267
- );
3268
- }
3269
- ui;
3270
- side;
3271
- bg = new pixi_js.Graphics();
3272
- items = [];
3273
- screen;
3274
- disposers = [];
3275
- /** The strip's pixel height for the current screen (used for the HUD margin too). */
3276
- static heightFor(screen) {
3277
- const scale = Math.max(0.7, Math.min(1.4, screen.scale));
3278
- return Math.round(BAR_H * scale);
3279
- }
3280
- applyLayout(screen) {
3281
- this.screen = screen;
3282
- this.relayout();
3283
- }
3284
- relayout() {
3285
- const s = this.screen;
3286
- if (!s) return;
3287
- const W = s.width;
3288
- const H = s.height;
3289
- const scale = Math.max(0.7, Math.min(1.4, s.scale));
3290
- const barH = _StatusBarView.heightFor(s);
3291
- const y = this.side === "top" ? 0 : H - barH;
3292
- this.position.set(0, 0);
3293
- const visible = this.items.filter((it) => !this.ui.hidden.has(it.id));
3294
- for (const it of this.items) it.view.visible = !this.ui.hidden.has(it.id);
3295
- this.bg.clear();
3296
- this.visible = visible.length > 0;
3297
- if (!visible.length) return;
3298
- const edgeY = this.side === "top" ? barH - 1 : y;
3299
- this.bg.rect(0, y, W, barH).fill({ color: 789776, alpha: 0.92 }).rect(0, edgeY, W, 1).fill({ color: 16777215, alpha: 0.18 });
3300
- const n = visible.length;
3301
- const cy = y + barH / 2;
3302
- const pad = 18 * scale;
3303
- const usableW = Math.max(160, W - pad * 2);
3304
- visible.forEach((it, i) => {
3305
- it.view.position.set(pad + usableW * ((i + 0.5) / n), cy);
3306
- it.view.scale.set(scale);
3307
- });
3308
- }
3309
- dispose() {
3310
- for (const it of this.items) it.view.dispose();
3311
- this.items.length = 0;
3312
- for (const d of this.disposers) d();
3313
- this.disposers.length = 0;
3314
- if (!this.destroyed) this.destroy({ children: true });
3315
- }
3316
- };
3317
3250
 
3318
3251
  // src/OpenUIPixi.ts
3319
3252
  function easeInOutCubic(p) {
@@ -3396,11 +3329,10 @@ var OpenUIPixi = class {
3396
3329
  const fullscreenView = new ButtonView(this.ui.fullscreenButton, this.ui, ticker, { shape: "circle", radius: 30, glyph: "fullscreen", iconTarget: 60, mono: true });
3397
3330
  muteView.zIndex = 65;
3398
3331
  fullscreenView.zIndex = 65;
3399
- const statusBarSide = this.opts.statusBar;
3400
3332
  const roOpts = { prefix: true, fill: this.opts.readoutColor };
3401
- const rtpView = statusBarSide ? void 0 : new ReadoutView(this.ui.rtp, this.ui, ticker, roOpts);
3402
- const netView = statusBarSide ? void 0 : new ReadoutView(this.ui.netPosition, this.ui, ticker, roOpts);
3403
- const timerView = statusBarSide ? void 0 : new ReadoutView(this.ui.sessionTimer, this.ui, ticker, roOpts);
3333
+ const rtpView = new ReadoutView(this.ui.rtp, this.ui, ticker, roOpts);
3334
+ const netView = new ReadoutView(this.ui.netPosition, this.ui, ticker, roOpts);
3335
+ const timerView = new ReadoutView(this.ui.sessionTimer, this.ui, ticker, roOpts);
3404
3336
  const entries = [
3405
3337
  [this.ui.spin.id, spinView],
3406
3338
  [this.ui.balance.id, balanceView],
@@ -3414,9 +3346,9 @@ var OpenUIPixi = class {
3414
3346
  [this.ui.muteButton.id, muteView],
3415
3347
  [this.ui.fullscreenButton.id, fullscreenView]
3416
3348
  ];
3417
- if (rtpView) entries.push([this.ui.rtp.id, rtpView]);
3418
- if (netView) entries.push([this.ui.netPosition.id, netView]);
3419
- if (timerView) entries.push([this.ui.sessionTimer.id, timerView]);
3349
+ entries.push([this.ui.rtp.id, rtpView]);
3350
+ entries.push([this.ui.netPosition.id, netView]);
3351
+ entries.push([this.ui.sessionTimer.id, timerView]);
3420
3352
  const viewById = /* @__PURE__ */ new Map();
3421
3353
  const idByView = /* @__PURE__ */ new Map();
3422
3354
  for (const [id, view] of entries) {
@@ -3477,28 +3409,22 @@ var OpenUIPixi = class {
3477
3409
  const dialog = new DialogView(this.ui.noticePanel, this.ui.noticeBlocks, this.ui.noticeActions, this.ui, ticker, { controlSkins: this.opts.controlSkins });
3478
3410
  this.root.addChild(dialog);
3479
3411
  this.overlays.push(dialog);
3480
- if (statusBarSide) {
3481
- const bar = new StatusBarView([this.ui.netPosition, this.ui.rtp, this.ui.sessionTimer], this.ui, ticker, statusBarSide);
3482
- this.root.addChild(bar);
3483
- this.overlays.push(bar);
3484
- } else {
3485
- const vignette = new pixi_js.Graphics();
3486
- vignette.zIndex = -1;
3487
- this.root.addChild(vignette);
3488
- this.overlays.push({
3489
- applyLayout: (s) => {
3490
- const r = 200 * s.scale;
3491
- vignette.clear();
3492
- for (let i = 0; i < 14; i++) {
3493
- const t = i / 14;
3494
- vignette.circle(0, 0, r * (1 - t)).fill({ color: 0, alpha: 0.5 / 14 });
3495
- }
3496
- },
3497
- dispose: () => {
3498
- if (!vignette.destroyed) vignette.destroy();
3412
+ const vignette = new pixi_js.Graphics();
3413
+ vignette.zIndex = -1;
3414
+ this.root.addChild(vignette);
3415
+ this.overlays.push({
3416
+ applyLayout: (s) => {
3417
+ const r = 200 * s.scale;
3418
+ vignette.clear();
3419
+ for (let i = 0; i < 14; i++) {
3420
+ const t = i / 14;
3421
+ vignette.circle(0, 0, r * (1 - t)).fill({ color: 0, alpha: 0.5 / 14 });
3499
3422
  }
3500
- });
3501
- }
3423
+ },
3424
+ dispose: () => {
3425
+ if (!vignette.destroyed) vignette.destroy();
3426
+ }
3427
+ });
3502
3428
  const replayBadge = new pixi_js.Container();
3503
3429
  const replayBg = new pixi_js.Graphics();
3504
3430
  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 +3438,7 @@ var OpenUIPixi = class {
3512
3438
  const w = replayText.width + 36;
3513
3439
  const h = 32;
3514
3440
  replayBg.clear().roundRect(-w / 2, -h / 2, w, h, h / 2).fill({ color: 789776 }).stroke({ width: 2, color: 16777215 });
3515
- const top = statusBarSide === "top" ? StatusBarView.heightFor(s) + 28 : 40;
3516
- replayBadge.position.set(s.width / 2, top);
3441
+ replayBadge.position.set(s.width / 2, 40);
3517
3442
  },
3518
3443
  dispose: () => {
3519
3444
  if (!replayBadge.destroyed) replayBadge.destroy({ children: true });
@@ -3529,16 +3454,11 @@ var OpenUIPixi = class {
3529
3454
  );
3530
3455
  const applyLayout = () => {
3531
3456
  const screen = this.ui.screen.get();
3532
- const barH = statusBarSide ? StatusBarView.heightFor(screen) : 0;
3533
3457
  this.slideBaseY.clear();
3534
3458
  this.slideSign.clear();
3535
3459
  for (const v of this.views) {
3536
3460
  v.applyLayout(screen);
3537
3461
  const anchor = this.ui.control(idByView.get(v) ?? "")?.layout.anchor ?? "bottom-center";
3538
- if (barH) {
3539
- if (statusBarSide === "top" && anchor.startsWith("top")) v.y += barH;
3540
- else if (statusBarSide === "bottom" && anchor.startsWith("bottom")) v.y -= barH;
3541
- }
3542
3462
  this.slideBaseY.set(v, v.y);
3543
3463
  this.slideSign.set(v, anchor.startsWith("top") ? -1 : 1);
3544
3464
  }
@@ -3951,7 +3871,7 @@ function mountHud(app, spec = {}, opts = {}) {
3951
3871
  if (menu && spec.game && (spec.game.name || spec.game.version)) {
3952
3872
  menu.push({ kind: "legal", id: "openui-game-info", text: [spec.game.name, spec.game.version ? `v${spec.game.version}` : ""].filter(Boolean).join(" \xB7 ") });
3953
3873
  }
3954
- const pixi = new OpenUIPixi(ui, { ...pixiOpts, menu, statusBar: pixiOpts.statusBar ?? spec.statusBar });
3874
+ const pixi = new OpenUIPixi(ui, { ...pixiOpts, menu });
3955
3875
  pixi.mount(app);
3956
3876
  const extra = [];
3957
3877
  if (spec.panels?.length) {
@@ -4071,7 +3991,6 @@ exports.ReadoutView = ReadoutView;
4071
3991
  exports.SelectView = SelectView;
4072
3992
  exports.SliderView = SliderView;
4073
3993
  exports.SpinView = SpinView;
4074
- exports.StatusBarView = StatusBarView;
4075
3994
  exports.StepperView = StepperView;
4076
3995
  exports.TextCellRenderer = TextCellRenderer;
4077
3996
  exports.ToggleView = ToggleView;