hypercross/boardgame-phaser
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

fix: fix ui bugs

Browse Source
This commit is contained in:
hypercross
2026-04-08 08:57:59 +08:00
parent d4819f7cc3
commit 2beff5c75c
6 changed files with 87 additions and 76 deletions
Download Patch File Download Diff File Expand all files Collapse all files
packages/onitama-game/src/scenes/OnitamaScene.ts
+10 -14
View File
@@ -4,14 +4,12 @@ import { prompts } from '@/game/onitama';
import { GameHostScene } from 'boardgame-phaser';
import { spawnEffect } from 'boardgame-phaser';
import { effect } from '@preact/signals-core';
import type { Signal } from '@preact/signals';
import { PawnSpawner, CardSpawner, BOARD_OFFSET, CELL_SIZE, CARD_WIDTH, CARD_HEIGHT } from '@/spawners';
import type { MutableSignal } from 'boardgame-core';
import { PawnSpawner, CardSpawner, BOARD_OFFSET, CELL_SIZE, CARD_WIDTH, CARD_HEIGHT, boardToScreen, BOARD_SIZE } from '@/spawners';
import type { HighlightData } from '@/spawners/HighlightSpawner';
import { createOnitamaUIState, clearSelection, selectPiece, selectCard, deselectCard, setValidMoves } from '@/state';
import type { OnitamaUIState, ValidMove } from '@/state';
const BOARD_SIZE = 5;
export class OnitamaScene extends GameHostScene<OnitamaState> {
private boardContainer!: Phaser.GameObjects.Container;
private gridGraphics!: Phaser.GameObjects.Graphics;
@@ -19,8 +17,8 @@ export class OnitamaScene extends GameHostScene<OnitamaState> {
private winnerOverlay?: Phaser.GameObjects.Container;
private cardLabelContainers: Map<string, Phaser.GameObjects.Text> = new Map();
// UI State managed by signal
public uiState!: Signal<OnitamaUIState>;
// UI State managed by MutableSignal
public uiState!: MutableSignal<OnitamaUIState>;
private highlightContainers: Map<string, Phaser.GameObjects.GameObject> = new Map();
private highlightDispose?: () => void;
@@ -189,10 +187,9 @@ export class OnitamaScene extends GameHostScene<OnitamaState> {
// Board cell clicks
for (let row = 0; row < BOARD_SIZE; row++) {
for (let col = 0; col < BOARD_SIZE; col++) {
const x = BOARD_OFFSET.x + col * CELL_SIZE + CELL_SIZE / 2;
const y = BOARD_OFFSET.y + row * CELL_SIZE + CELL_SIZE / 2;
const pos = boardToScreen(col, row);
const zone = this.add.zone(x, y, CELL_SIZE, CELL_SIZE).setInteractive();
const zone = this.add.zone(pos.x, pos.y, CELL_SIZE, CELL_SIZE).setInteractive();
zone.on('pointerdown', () => {
if (this.state.winner) return;
@@ -308,16 +305,15 @@ export class OnitamaScene extends GameHostScene<OnitamaState> {
// Create new highlights
for (const move of validMoves) {
const key = `${move.card}-${move.toX}-${move.toY}`;
const x = BOARD_OFFSET.x + move.toX * CELL_SIZE + CELL_SIZE / 2;
const y = BOARD_OFFSET.y + move.toY * CELL_SIZE + CELL_SIZE / 2;
const pos = boardToScreen(move.toX, move.toY);
const circle = this.add.circle(x, y, CELL_SIZE / 3, 0x3b82f6, 0.3).setDepth(100);
const circle = this.add.circle(pos.x, pos.y, CELL_SIZE / 3, 0x3b82f6, 0.3).setDepth(100);
circle.setInteractive({ useHandCursor: true });
circle.on('pointerdown', () => {
this.onHighlightClick({
key,
x,
y,
x: pos.x,
y: pos.y,
card: move.card,
fromX: move.fromX,
fromY: move.fromY,