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

style: stack Rush Hour buttons vertically on the left side 

- Move Undo, Reset, Hint, and Levels buttons from horizontal bottom layout
  to a vertical stack centered on the left side of the screen
- Calculate button positions dynamically based on total height and gap
- Improve usability by grouping controls alongside the playfield
This commit is contained in:
Brian Fertig 2026-06-08 18:32:50 -06:00
parent 58f72e3d91
commit c01027e6c5
1 changed files with 19 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

28
public/src/games/rushhour/RushHourGame.js
View File

@ -235,15 +235,25 @@ export default class RushHourGame extends Phaser.Scene {
this.layer.add(this.movesText);
this.updateMoves();
const by = GAME_HEIGHT - 70;
const undo = new Button(this, BOARD_LEFT + 90, by, 'Undo', () => this.undo(),
{ width: 150, height: 56, fontSize: 22 });
const reset = new Button(this, BOARD_LEFT + 256, by, 'Reset', () => this.resetLevel(),
{ width: 150, height: 56, fontSize: 22, variant: 'ghost' });
const hint = new Button(this, BOARD_LEFT + 422, by, 'Hint', () => this.showHint(),
{ width: 150, height: 56, fontSize: 22, variant: 'ghost' });
const levels = new Button(this, BOARD_LEFT + BOARD_PX - 110, by, 'Levels', () => this.showLevelSelect(),
{ width: 200, height: 56, fontSize: 22, variant: 'ghost' });
// Buttons stacked vertically on the left side, between screen edge and playfield
const BTN_W = 150;
const BTN_H = 56;
const BTN_GAP = 12;
const BTN_X = BOARD_LEFT / 2;
const totalH = 4 * BTN_H + 3 * BTN_GAP;
let btnY = GAME_HEIGHT / 2 - totalH / 2;
const undo = new Button(this, BTN_X, btnY, 'Undo', () => this.undo(),
{ width: BTN_W, height: BTN_H, fontSize: 22 });
btnY += BTN_H + BTN_GAP;
const reset = new Button(this, BTN_X, btnY, 'Reset', () => this.resetLevel(),
{ width: BTN_W, height: BTN_H, fontSize: 22, variant: 'ghost' });
btnY += BTN_H + BTN_GAP;
const hint = new Button(this, BTN_X, btnY, 'Hint', () => this.showHint(),
{ width: BTN_W, height: BTN_H, fontSize: 22, variant: 'ghost' });
btnY += BTN_H + BTN_GAP;
const levels = new Button(this, BTN_X, btnY, 'Levels', () => this.showLevelSelect(),
{ width: BTN_W, height: BTN_H, fontSize: 22, variant: 'ghost' });
this.undoBtn = undo;
this.layer.add([undo, reset, hint, levels]);
this.updateMoves();