diff --git a/src/games/jigsaw/JigsawGame.js b/src/games/jigsaw/JigsawGame.js index 5a4396b..2fd4e80 100644 --- a/src/games/jigsaw/JigsawGame.js +++ b/src/games/jigsaw/JigsawGame.js @@ -503,11 +503,14 @@ export default class JigsawGame extends Phaser.Scene { // piece's hit area. (With the old ±cell box, ~35 neighbour pairs overlapped // and the click resolved to whichever had the highest index — the bottom- // right piece — far away from the cursor.) - // Pieces stay interactive only for the hover cursor. The actual grab is - // resolved centrally in onTableDown (nearest piece to the pointer) so a - // click can never resolve to a distant neighbour's overlapping hit box. + // Pieces stay interactive for the hover cursor AND to consume the + // pointerdown (forwarding it to the central grab resolver). Without the + // pointerdown handler here, a click that lands inside the piece's custom + // hit area is consumed by the piece (topOnly=true) and never reaches the + // background's onTableDown — leaving the piece un-grabbable. const grab = this.cell * GRAB_FRAC; - img.setInteractive({ useHandCursor: true, hitArea: new Phaser.Geom.Rectangle(-grab, -grab, grab * 2, grab * 2), hitAreaCallback: Phaser.Geom.Rectangle.Contains }); + img.setInteractive({ useHandCursor: true, hitArea: new Phaser.Geom.Rectangle(img.displayOriginX - grab, img.displayOriginY - grab, grab * 2, grab * 2), hitAreaCallback: Phaser.Geom.Rectangle.Contains }); + img.on('pointerdown', (pointer) => this.onTableDown(pointer)); this.pieces.push({ r, c, img, home, placed: false, key, depth: 10 }); } }