From cd171c859c26696a7cea24747bea4e385de394d3 Mon Sep 17 00:00:00 2001 From: tekki mariani Date: Mon, 23 Mar 2026 19:40:27 +0000 Subject: [PATCH] =?UTF-8?q?=E2=9C=A8=20fix=20depth=20sorting=20for=20world?= =?UTF-8?q?=20objects=20by=20tileY?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Fixes #31. All trees, rocks, seedlings and buildings now use tileY+5 as depth instead of a fixed value, so objects further down the screen always render in front of objects above them regardless of spawn order. Build ghost moved to depth 1000/1001. Co-Authored-By: Claude Sonnet 4.6 --- src/scenes/GameScene.ts | 7 ++++--- src/systems/BuildingSystem.ts | 4 ++-- src/systems/ResourceSystem.ts | 4 ++-- src/systems/TreeSeedlingSystem.ts | 2 +- 4 files changed, 9 insertions(+), 8 deletions(-) diff --git a/src/scenes/GameScene.ts b/src/scenes/GameScene.ts index 530018c..7af88ba 100644 --- a/src/scenes/GameScene.ts +++ b/src/scenes/GameScene.ts @@ -179,18 +179,19 @@ export class GameScene extends Phaser.Scene { const name = `bobj_${building.id}` if (this.children.getByName(name)) continue + const worldDepth = building.tileY + 5 if (building.kind === 'chest') { - const g = this.add.graphics().setName(name).setDepth(8) + const g = this.add.graphics().setName(name).setDepth(worldDepth) g.fillStyle(0x8B4513); g.fillRect(wx - 10, wy - 7, 20, 14) g.fillStyle(0xCD853F); g.fillRect(wx - 9, wy - 6, 18, 6) g.lineStyle(1, 0x5C3317); g.strokeRect(wx - 10, wy - 7, 20, 14) } else if (building.kind === 'bed') { - this.add.image(wx, wy, 'bed_obj').setName(name).setDepth(8) + this.add.image(wx, wy, 'bed_obj').setName(name).setDepth(worldDepth) } else if (building.kind === 'stockpile_zone') { this.add.image(wx, wy, 'stockpile_obj').setName(name).setDepth(4).setAlpha(0.8) } else if (building.kind === 'forester_hut') { // Draw a simple log-cabin silhouette for the forester hut - const g = this.add.graphics().setName(name).setDepth(8) + const g = this.add.graphics().setName(name).setDepth(worldDepth) // Body g.fillStyle(0x6B3F16); g.fillRect(wx - 12, wy - 9, 24, 18) // Roof diff --git a/src/systems/BuildingSystem.ts b/src/systems/BuildingSystem.ts index 3e52d8a..2d7d7d4 100644 --- a/src/systems/BuildingSystem.ts +++ b/src/systems/BuildingSystem.ts @@ -32,7 +32,7 @@ export class BuildingSystem { create(): void { this.ghost = this.scene.add.rectangle(0, 0, TILE_SIZE, TILE_SIZE, 0x00FF00, 0.35) - this.ghost.setDepth(20) + this.ghost.setDepth(1000) this.ghost.setVisible(false) this.ghost.setStrokeStyle(2, 0x00FF00, 0.8) @@ -40,7 +40,7 @@ export class BuildingSystem { fontSize: '10px', color: '#ffffff', fontFamily: 'monospace', backgroundColor: '#000000aa', padding: { x: 3, y: 2 } }) - this.ghostLabel.setDepth(21) + this.ghostLabel.setDepth(1001) this.ghostLabel.setVisible(false) this.ghostLabel.setOrigin(0.5, 1) diff --git a/src/systems/ResourceSystem.ts b/src/systems/ResourceSystem.ts index d490726..f2a7950 100644 --- a/src/systems/ResourceSystem.ts +++ b/src/systems/ResourceSystem.ts @@ -47,10 +47,10 @@ export class ResourceSystem { sprite.setOrigin(0.5, 0.75) } - sprite.setDepth(5) + sprite.setDepth(node.tileY + 5) const healthBar = this.scene.add.graphics() - healthBar.setDepth(6) + healthBar.setDepth(node.tileY + 6) healthBar.setVisible(false) this.sprites.set(node.id, { sprite, node, healthBar }) diff --git a/src/systems/TreeSeedlingSystem.ts b/src/systems/TreeSeedlingSystem.ts index 5167293..9c42121 100644 --- a/src/systems/TreeSeedlingSystem.ts +++ b/src/systems/TreeSeedlingSystem.ts @@ -110,7 +110,7 @@ export class TreeSeedlingSystem { const key = `seedling_${Math.min(s.stage, 2)}` const sprite = this.scene.add.image(x, y, key) .setOrigin(0.5, 0.85) - .setDepth(5) + .setDepth(s.tileY + 5) this.sprites.set(s.id, sprite) }