brianfertig
/
fertig-classic-games
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

fix(bingo): adjust visual styling and formatting 

- Update player card background border radius from 5 to 15 for smoother corners
- Change called numbers board background color from cream to black for better contrast
- Remove unnecessary whitespace in `init()` and physics calculation lines (code cleanup)
This commit is contained in:
Brian Fertig 2026-05-25 11:05:53 -06:00
parent ebe387f5fe
commit 57c9d85864
1 changed files with 7 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
public/src/games/bingo/BingoGame.js
View File

@ -52,10 +52,10 @@ export default class BingoGame extends Phaser.Scene {
} }
init(data) { init(data) {
this.gameDef = data.game; this.gameDef = data.game;
this.opponents = data.opponents ?? []; this.opponents = data.opponents ?? [];
this.playfield = data.playfield ?? null; this.playfield = data.playfield ?? null;
this.cardBack = data.cardBack ?? null; this.cardBack = data.cardBack ?? null;
this.activeOpponents = this.opponents.slice(0, 10); this.activeOpponents = this.opponents.slice(0, 10);
this.buyIn = 50; this.buyIn = 50;
@ -109,7 +109,7 @@ export default class BingoGame extends Phaser.Scene {
const len = Math.hypot(dx, dy) || 1; const len = Math.hypot(dx, dy) || 1;
// Tangential force (scaled by spin level) circulates the balls like a spun cage. // Tangential force (scaled by spin level) circulates the balls like a spun cage.
const fx = ((-dy / len) * SPIN_FORCE + (Math.random() - 0.5) * 0.0003) * lvl; const fx = ((-dy / len) * SPIN_FORCE + (Math.random() - 0.5) * 0.0003) * lvl;
const fy = (( dx / len) * SPIN_FORCE + (Math.random() - 0.5) * 0.0003) * lvl; const fy = ((dx / len) * SPIN_FORCE + (Math.random() - 0.5) * 0.0003) * lvl;
Body.applyForce(b, b.position, { x: fx, y: fy }); Body.applyForce(b, b.position, { x: fx, y: fy });
} }
ball.view.x = b.position.x; ball.view.x = b.position.x;
@ -145,8 +145,8 @@ export default class BingoGame extends Phaser.Scene {
buildDrumVisual() { buildDrumVisual() {
const g = this.add.graphics().setDepth(D.drum); const g = this.add.graphics().setDepth(D.drum);
g.fillStyle(0x000000, 0.4); g.fillCircle(DRUM_X + 6, DRUM_Y + 10, DRUM_R + CAGE_TH); g.fillStyle(0x000000, 0.4); g.fillCircle(DRUM_X + 6, DRUM_Y + 10, DRUM_R + CAGE_TH);
g.fillStyle(0x3d1f08, 1); g.fillCircle(DRUM_X, DRUM_Y, DRUM_R + CAGE_TH); // wood ring g.fillStyle(0x3d1f08, 1); g.fillCircle(DRUM_X, DRUM_Y, DRUM_R + CAGE_TH); // wood ring
g.fillStyle(0x07060a, 1); g.fillCircle(DRUM_X, DRUM_Y, DRUM_R + 2); // interior g.fillStyle(0x07060a, 1); g.fillCircle(DRUM_X, DRUM_Y, DRUM_R + 2); // interior
const glass = this.add.graphics().setDepth(D.ball + 1); const glass = this.add.graphics().setDepth(D.ball + 1);
glass.lineStyle(6, COLORS.accent, 0.9); glass.strokeCircle(DRUM_X, DRUM_Y, DRUM_R); glass.lineStyle(6, COLORS.accent, 0.9); glass.strokeCircle(DRUM_X, DRUM_Y, DRUM_R);
@ -203,7 +203,7 @@ export default class BingoGame extends Phaser.Scene {
// Cream white background behind the card (letters + grid) // Cream white background behind the card (letters + grid)
const cardBg = this.add.graphics().setDepth(D.card - 1); const cardBg = this.add.graphics().setDepth(D.card - 1);
cardBg.fillStyle(0xe4e2b3, 0.95); cardBg.fillStyle(0xe4e2b3, 0.95);
cardBg.fillRoundedRect(CARD_CX - 310, 400 - 330, 620, 660, 5); cardBg.fillRoundedRect(CARD_CX - 310, 400 - 330, 620, 660, 15);
for (let c = 0; c < 5; c++) { for (let c = 0; c < 5; c++) {
this.add.text(colX(c), HEADER_Y, LETTERS[c], { this.add.text(colX(c), HEADER_Y, LETTERS[c], {
@ -348,7 +348,7 @@ export default class BingoGame extends Phaser.Scene {
buildCalledBoard() { buildCalledBoard() {
// Cream white background behind the called numbers board // Cream white background behind the called numbers board
const boardBg = this.add.graphics().setDepth(D.board - 1); const boardBg = this.add.graphics().setDepth(D.board - 1);
boardBg.fillStyle(0xecebe7, 0.95); boardBg.fillStyle(0x000000, 0.95);
boardBg.fillRoundedRect(970 - 490, 892 - 150, 980, 300, 5); boardBg.fillRoundedRect(970 - 490, 892 - 150, 980, 300, 5);
this.add.text(CB_LETTER_X - 24, 762, 'Called Numbers', { this.add.text(CB_LETTER_X - 24, 762, 'Called Numbers', {