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

ui: reposition control buttons in BlokusGame 

Adjust button coordinates in buildControls() to update the control tray layout.
Pass, Rotate, and Flip buttons are moved lower and centered relative to the tray,
while New and Leave buttons are positioned at the bottom right.
This commit is contained in:
Brian Fertig 2026-06-02 14:05:41 -06:00
parent 6a33bf500b
commit aa920fddfb
1 changed files with 9 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
public/src/games/blokus/BlokusGame.js
View File

@ -296,11 +296,15 @@ export default class BlokusGame extends Phaser.Scene {
}
buildControls() {
this.rotateBtn = new Button(this, SIDE_X - 95, 610, '↻ Rotate', () => this.rotateSelection(), { width: 170, height: 48, fontSize: 20 }).setDepth(DEPTH.button);
this.flipBtn = new Button(this, SIDE_X + 95, 610, '↔ Flip', () => this.flipSelection(), { width: 170, height: 48, fontSize: 20 }).setDepth(DEPTH.button);
this.passBtn = new Button(this, SIDE_X, 674, 'Pass', () => this.humanPass(), { variant: 'ghost', width: 360, height: 48, fontSize: 20 }).setDepth(DEPTH.button);
new Button(this, SIDE_X - 95, 750, 'New', () => this.scene.restart(), { variant: 'ghost', width: 170, height: 44, fontSize: 18 }).setDepth(DEPTH.button);
new Button(this, SIDE_X + 95, 750, 'Leave', () => this.scene.start('GameMenu'), { variant: 'ghost', width: 170, height: 44, fontSize: 18 }).setDepth(DEPTH.button);
const trayCenter = TRAY_X + (TRAY_COLS * TRAY_SLOT_W) / 2;
this.passBtn = new Button(this, trayCenter, 898, 'Pass', () => this.humanPass(), { variant: 'ghost', width: 360, height: 48, fontSize: 20 }).setDepth(DEPTH.button);
this.rotateBtn = new Button(this, trayCenter - 95, 838, '↻ Rotate', () => this.rotateSelection(), { width: 170, height: 48, fontSize: 20 }).setDepth(DEPTH.button);
this.flipBtn = new Button(this, trayCenter + 95, 838, '↔ Flip', () => this.flipSelection(), { width: 170, height: 48, fontSize: 20 }).setDepth(DEPTH.button);
const rightPad = 20;
const gap = 20;
const leaveX = GAME_WIDTH - rightPad - 85;
new Button(this, leaveX - 170 - gap, 1030, 'New', () => this.scene.restart(), { variant: 'ghost', width: 170, height: 44, fontSize: 18 }).setDepth(DEPTH.button);
new Button(this, leaveX, 1030, 'Leave', () => this.scene.start('GameMenu'), { variant: 'ghost', width: 170, height: 44, fontSize: 18 }).setDepth(DEPTH.button);
}
buildStatus() {