From 731937bb82b4e5231b4904162cd09032239fe63e Mon Sep 17 00:00:00 2001 From: Brian Fertig Date: Sun, 17 May 2026 14:53:01 -0600 Subject: [PATCH] refactor(Phase10Game): remove trailing whitespace and align object properties - Remove trailing whitespace throughout the file. - Align object properties and ternary operators for improved readability. - Adjust button positioning offset in staging laydown UI. --- public/src/games/phase10/Phase10Game.js | 122 ++++++++++++------------ 1 file changed, 61 insertions(+), 61 deletions(-) diff --git a/public/src/games/phase10/Phase10Game.js b/public/src/games/phase10/Phase10Game.js index 71db75e..601650d 100644 --- a/public/src/games/phase10/Phase10Game.js +++ b/public/src/games/phase10/Phase10Game.js @@ -41,10 +41,10 @@ const D = { // Suit color tinting. const SUIT = { - red: { fill: 0xfbe7e2, stroke: 0xc92a2a, num: '#c92a2a' }, - blue: { fill: 0xe2ecfb, stroke: 0x2b7fbf, num: '#1c63a3' }, + red: { fill: 0xfbe7e2, stroke: 0xc92a2a, num: '#c92a2a' }, + blue: { fill: 0xe2ecfb, stroke: 0x2b7fbf, num: '#1c63a3' }, yellow: { fill: 0xfbf3d4, stroke: 0xc69a1f, num: '#a17a10' }, - green: { fill: 0xdff3e3, stroke: 0x2f9e44, num: '#1c6b30' }, + green: { fill: 0xdff3e3, stroke: 0x2f9e44, num: '#1c6b30' }, }; const WILD_FILL = 0xf2ead8; const WILD_STRIPE = 0xc8a84b; @@ -63,54 +63,54 @@ function slotLayout(slot) { case 'bottom': return { rotation: 0, - handStart: { x: 460, y: 990 }, - handAxis: 'x', - handFaceUp: true, - laidStart: { x: 700, y: 720 }, - laidAxis: 'x', - portrait: { x: 684, y: 846, r: 56 }, - nameLabel: { x: 684, y: 916 }, - chip: { x: 752, y: 870 }, + handStart: { x: 460, y: 990 }, + handAxis: 'x', + handFaceUp: true, + laidStart: { x: 700, y: 720 }, + laidAxis: 'x', + portrait: { x: 684, y: 846, r: 56 }, + nameLabel: { x: 684, y: 916 }, + chip: { x: 752, y: 870 }, rotateCards: 0, }; case 'top': return { rotation: 180, - handStart: { x: 460, y: 60 }, - handAxis: 'x', - handFaceUp: false, - laidStart: { x: 700, y: 344 }, - laidAxis: 'x', - portrait: { x: 1094, y: 198, r: 50 }, - nameLabel: { x: 1094, y: 262 }, - chip: { x: 752, y: 180 }, + handStart: { x: 460, y: 60 }, + handAxis: 'x', + handFaceUp: false, + laidStart: { x: 700, y: 344 }, + laidAxis: 'x', + portrait: { x: 1094, y: 198, r: 50 }, + nameLabel: { x: 1094, y: 262 }, + chip: { x: 752, y: 180 }, rotateCards: 180, }; case 'left': return { rotation: 90, - handStart: { x: 60, y: 900 }, - handAxis: 'y-up', - handFaceUp: false, - laidStart: { x: 524, y: 340 }, - laidAxis: 'y', - portrait: { x: 180, y: 266, r: 50 }, - nameLabel: { x: 180, y: 202 }, - chip: { x: 180, y: 328 }, + handStart: { x: 60, y: 900 }, + handAxis: 'y-up', + handFaceUp: false, + laidStart: { x: 524, y: 340 }, + laidAxis: 'y', + portrait: { x: 180, y: 266, r: 50 }, + nameLabel: { x: 180, y: 202 }, + chip: { x: 180, y: 328 }, chipRotation: Math.PI / 2, rotateCards: 90, }; case 'right': return { rotation: 270, - handStart: { x: 1860, y: 900 }, - handAxis: 'y-up', - handFaceUp: false, - laidStart: { x: 1396, y: 340 }, - laidAxis: 'y', - portrait: { x: 1740, y: 670, r: 50 }, - nameLabel: { x: 1740, y: 734 }, - chip: { x: 1740, y: 608 }, + handStart: { x: 1860, y: 900 }, + handAxis: 'y-up', + handFaceUp: false, + laidStart: { x: 1396, y: 340 }, + laidAxis: 'y', + portrait: { x: 1740, y: 670, r: 50 }, + nameLabel: { x: 1740, y: 734 }, + chip: { x: 1740, y: 608 }, chipRotation: -Math.PI / 2, rotateCards: 270, }; @@ -119,7 +119,7 @@ function slotLayout(slot) { } } -const DRAW_POS = { x: CX - 80, y: CY }; +const DRAW_POS = { x: CX - 80, y: CY }; const DISCARD_POS = { x: CX + 80, y: CY }; // ── Scene ─────────────────────────────────────────────────────────────────── @@ -130,7 +130,7 @@ export default class Phase10Game extends Phaser.Scene { this.gameDef = data.game; this.opponents = data.opponents ?? []; this.playfield = data.playfield ?? null; - this.cardBack = data.cardBack ?? null; + this.cardBack = data.cardBack ?? null; this.gs = null; this.animating = false; @@ -153,7 +153,7 @@ export default class Phase10Game extends Phaser.Scene { this.potentialDrag = null; this.stagingGroups = null; this.submitBtn = null; - this.clearBtn = null; + this.clearBtn = null; } create() { @@ -254,10 +254,10 @@ export default class Phase10Game extends Phaser.Scene { .setStrokeStyle(2, COLORS.accent).setDepth(D.pile) .setInteractive({ useHandCursor: true }); drawRect.on('pointerdown', () => this.onDrawDeckClick()); - this.add.text(DRAW_POS.x, DRAW_POS.y - CARD_H/2 - 18, 'DRAW', { + this.add.text(DRAW_POS.x, DRAW_POS.y - CARD_H / 2 - 18, 'DRAW', { fontFamily: '"Julius Sans One"', fontSize: '14px', color: COLORS.mutedHex, }).setOrigin(0.5).setDepth(D.ui); - this.drawPileText = this.add.text(DRAW_POS.x, DRAW_POS.y + CARD_H/2 + 16, '', { + this.drawPileText = this.add.text(DRAW_POS.x, DRAW_POS.y + CARD_H / 2 + 16, '', { fontFamily: '"Julius Sans One"', fontSize: '14px', color: COLORS.accentHex, }).setOrigin(0.5).setDepth(D.ui); this.drawPileRect = drawRect; @@ -267,7 +267,7 @@ export default class Phase10Game extends Phaser.Scene { .setStrokeStyle(2, COLORS.muted).setDepth(D.pile) .setInteractive({ useHandCursor: true }); discRect.on('pointerdown', () => this.onDiscardPileClick()); - this.add.text(DISCARD_POS.x, DISCARD_POS.y - CARD_H/2 - 18, 'DISCARD', { + this.add.text(DISCARD_POS.x, DISCARD_POS.y - CARD_H / 2 - 18, 'DISCARD', { fontFamily: '"Julius Sans One"', fontSize: '14px', color: COLORS.mutedHex, }).setOrigin(0.5).setDepth(D.ui); this.discardPileRect = discRect; @@ -296,7 +296,7 @@ export default class Phase10Game extends Phaser.Scene { tab.setInteractive(new Phaser.Geom.Rectangle(-18, -110, 36, 220), Phaser.Geom.Rectangle.Contains); tab.input.cursor = 'pointer'; tab.on('pointerover', () => drawTab(COLORS.accent)); - tab.on('pointerout', () => drawTab(this.playbookOpen ? COLORS.accent : COLORS.panel)); + tab.on('pointerout', () => drawTab(this.playbookOpen ? COLORS.accent : COLORS.panel)); tab.on('pointerdown', () => this.togglePlaybook()); this.playbookTab = tab; @@ -357,7 +357,7 @@ export default class Phase10Game extends Phaser.Scene { this.playbookPanel = panel; this.playbookPanelW = panelW; this.playbookClosedX = panelX; - this.playbookOpenX = GAME_WIDTH - panelW / 2 - 40; + this.playbookOpenX = GAME_WIDTH - panelW / 2 - 40; } togglePlaybook() { @@ -742,8 +742,8 @@ export default class Phase10Game extends Phaser.Scene { const g = this.stagingGroups[gi]; const gw = g.count * (LAIDOWN_CARD_W * 0.75) + (LAIDOWN_CARD_W * 0.25); const kindLabel = g.kind === 'set' ? `Set of ${g.count}` - : g.kind === 'run' ? `Run of ${g.count}` - : `${g.count} of one color`; + : g.kind === 'run' ? `Run of ${g.count}` + : `${g.count} of one color`; const lbl = this.add.text(cx + gw / 2, panelY + PY + 2, kindLabel, { fontFamily: 'Righteous', fontSize: '13px', color: COLORS.goldHex, }).setOrigin(0.5, 0).setDepth(D.card - 1); @@ -848,7 +848,7 @@ export default class Phase10Game extends Phaser.Scene { if (Math.abs(cardX - gc.x) < gc.w / 2 + 20 && Math.abs(cardY - gc.y) < gc.h / 2 + 20) { if (groupTargets.length === 1) return { type: 'hit', ...groupTargets[0] }; // Run with both low and high: pick based on which side the card is on. - const low = groupTargets.find((t) => t.position === 'low'); + const low = groupTargets.find((t) => t.position === 'low'); const high = groupTargets.find((t) => t.position === 'high'); const chosen = (low && cardX < gc.x) ? low : (high ?? low); return { type: 'hit', ...chosen }; @@ -881,7 +881,7 @@ export default class Phase10Game extends Phaser.Scene { } } if (layout.laidAxis === 'x') cursorX += groupW + GROUP_GAP; - else cursorY += N * (LAIDOWN_CARD_H * 0.5) + GROUP_GAP; + else cursorY += N * (LAIDOWN_CARD_H * 0.5) + GROUP_GAP; } return null; } @@ -1143,7 +1143,7 @@ export default class Phase10Game extends Phaser.Scene { this.cardObjs.set(`hand-${seat}-${card.id}`, c); if (seat === 0) { this.localHandCards.push(c); - c.setInteractive(new Phaser.Geom.Rectangle(-CARD_W/2, -CARD_H/2, CARD_W, CARD_H), Phaser.Geom.Rectangle.Contains); + c.setInteractive(new Phaser.Geom.Rectangle(-CARD_W / 2, -CARD_H / 2, CARD_W, CARD_H), Phaser.Geom.Rectangle.Contains); c.input.cursor = 'pointer'; c.on('pointerdown', (pointer) => this.onHandPointerDown(i, pointer)); } @@ -1197,7 +1197,7 @@ export default class Phase10Game extends Phaser.Scene { // Advance cursor for next group if (layout.laidAxis === 'x') cursorX += groupW + GROUP_GAP; - else cursorY += N * (LAIDOWN_CARD_H * 0.5) + GROUP_GAP; + else cursorY += N * (LAIDOWN_CARD_H * 0.5) + GROUP_GAP; } } @@ -1259,8 +1259,8 @@ export default class Phase10Game extends Phaser.Scene { totalW += this.stagingGroups[i].count * (LAIDOWN_CARD_W * 0.75) + (LAIDOWN_CARD_W * 0.25); } const panelX = laidStart.x - 14; - const panelW = totalW + 28; - const btnX = panelX + panelW + 160; + const panelW = totalW + 28; + const btnX = panelX + panelW + 200; this.submitBtn = new Button(this, btnX, laidStart.y - 18, 'Submit Phase', () => this.submitStagingLaydown(), { width: 200, height: 44, fontSize: 18, }).setDepth(D.ui); @@ -1271,7 +1271,7 @@ export default class Phase10Game extends Phaser.Scene { _destroyStagingButtons() { if (this.submitBtn) { this.submitBtn.destroy(); this.submitBtn = null; } - if (this.clearBtn) { this.clearBtn.destroy(); this.clearBtn = null; } + if (this.clearBtn) { this.clearBtn.destroy(); this.clearBtn = null; } } // ── Local input ───────────────────────────────────────────────────────── @@ -1400,7 +1400,7 @@ export default class Phase10Game extends Phaser.Scene { const w = 560, h = 280; const panel = this.add.rectangle(CX, CY, w, h, COLORS.panel, 1) .setStrokeStyle(2, COLORS.accent).setDepth(D.modal); - const title = this.add.text(CX, CY - h/2 + 40, 'Skip which player?', { + const title = this.add.text(CX, CY - h / 2 + 40, 'Skip which player?', { fontFamily: 'Righteous', fontSize: '28px', color: COLORS.goldHex, }).setOrigin(0.5).setDepth(D.modal); @@ -1434,7 +1434,7 @@ export default class Phase10Game extends Phaser.Scene { }, { width: 160, height: 56, fontSize: 18 }).setDepth(D.modal); buttons.push(btn); }); - const cancelBtn = new Button(this, CX, CY + h/2 - 40, 'Cancel', () => { + const cancelBtn = new Button(this, CX, CY + h / 2 - 40, 'Cancel', () => { overlay.destroy(); panel.destroy(); title.destroy(); for (const b of buttons) b.destroy(); cancelBtn.destroy(); @@ -1549,16 +1549,16 @@ export default class Phase10Game extends Phaser.Scene { const summary = this.gs.lastRoundSummary; const winnerName = this.nameForSeat(summary.winnerSeat); - const title = this.add.text(CX, CY - h/2 + 40, `Round ${summary.roundNum} — ${winnerName} went out`, { + const title = this.add.text(CX, CY - h / 2 + 40, `Round ${summary.roundNum} — ${winnerName} went out`, { fontFamily: 'Righteous', fontSize: '26px', color: COLORS.goldHex, }).setOrigin(0.5).setDepth(D.modal); items.push(title); summary.rows.forEach((row, i) => { - const y = CY - h/2 + 100 + i * 50; + const y = CY - h / 2 + 100 + i * 50; const name = this.nameForSeat(row.seat); const status = row.cleared10 ? 'cleared phase 10!' : row.advanced ? `→ phase ${row.phaseNext}` : `still phase ${row.phaseNext}`; - const t = this.add.text(CX - w/2 + 36, y, `${name}`, { + const t = this.add.text(CX - w / 2 + 36, y, `${name}`, { fontFamily: 'Righteous', fontSize: '20px', color: COLORS.textHex, }).setDepth(D.modal); const sc = this.add.text(CX - 100, y, `+${row.pointsThisRound} (total ${row.totalScore})`, { @@ -1573,12 +1573,12 @@ export default class Phase10Game extends Phaser.Scene { const tieNote = this.gs.matchTied ? 'Tie among phase 10 finishers — extra round!' : null; if (tieNote) { - items.push(this.add.text(CX, CY + h/2 - 90, tieNote, { + items.push(this.add.text(CX, CY + h / 2 - 90, tieNote, { fontFamily: '"Julius Sans One"', fontSize: '16px', color: COLORS.dangerHex, }).setOrigin(0.5).setDepth(D.modal)); } - const btn = new Button(this, CX, CY + h/2 - 50, 'Next round', () => { + const btn = new Button(this, CX, CY + h / 2 - 50, 'Next round', () => { for (const o of items) o.destroy(); btn.destroy(); this.gs = startNextRound(this.gs); @@ -1599,7 +1599,7 @@ export default class Phase10Game extends Phaser.Scene { const p = this.opponentPortraits[s]; if (!p) continue; if (winner === s) p.playEmotion?.('win'); - else p.playEmotion?.('loss'); + else p.playEmotion?.('loss'); } const overlay = this.add.rectangle(CX, CY, GAME_WIDTH, GAME_HEIGHT, 0x000000, 0.65) @@ -1607,7 +1607,7 @@ export default class Phase10Game extends Phaser.Scene { const w = 720, h = 360; this.add.rectangle(CX, CY, w, h, COLORS.panel, 1) .setStrokeStyle(2, COLORS.accent).setDepth(D.modal); - this.add.text(CX, CY - h/2 + 56, msg, { + this.add.text(CX, CY - h / 2 + 56, msg, { fontFamily: 'Righteous', fontSize: '42px', color: youWon ? COLORS.goldHex : COLORS.textHex, }).setOrigin(0.5).setDepth(D.modal);