diff --git a/src/games/zombies/tile.ts b/src/games/zombies/tile.ts index 468346b..fcf48f1 100644 --- a/src/games/zombies/tile.ts +++ b/src/games/zombies/tile.ts @@ -1,6 +1,8 @@ import Entity from "./entity"; import type Item from "./item"; +import planks from './assets/items/planks.jpg'; + export enum TileType { NORMAL, START, @@ -20,7 +22,7 @@ export default class Tile extends Entity { } protected draw(ctx: CanvasRenderingContext2D) { - ctx.font = '0.2px Arial'; + ctx.font = '0.3px Arial'; if (this.hovered) { ctx.fillStyle = `rgba(255, 255, 255, 0.2)`; @@ -47,11 +49,13 @@ export default class Tile extends Entity { ctx.drawImage(item.type, 0.1, 0.1, 0.8, 0.8); if (this.items.length > 1) { - ctx.fillText('💀', 0.85, 0.15); + ctx.fillStyle = 'black'; + ctx.fillText('💀', 0.8, 0.2); } } else { ctx.fillStyle = 'white'; ctx.fillRect(0.1, 0.1, 0.8, 0.8); + ctx.fillStyle = 'black'; ctx.fillText('❓', 0.5, 0.5); } } @@ -64,8 +68,8 @@ export default class Tile extends Entity { x += (Number(this.left < doorway.left) - Number(doorway.left < this.left)) * 0.5; y += (Number(this.top < doorway.top) - Number(doorway.top < this.top)) * 0.5; } - ctx.font = `0.4px Arial`; - ctx.fillText('⛔', x, y); + + ctx.drawImage(planks, x - 0.2, y - 0.2, 0.4, 0.4); } } diff --git a/src/games/zombies/tilemap.ts b/src/games/zombies/tilemap.ts index da2e973..1b8cb3a 100644 --- a/src/games/zombies/tilemap.ts +++ b/src/games/zombies/tilemap.ts @@ -197,11 +197,16 @@ export default class TileMap extends Entity { return this.characters[this.currentCharacterIdx]; } + get activeTiles() { + return this.tiles.filter(tile => ( + tile.items.length > 0 + || tile.type === TileType.LOCKED_DOOR + || (this.state === GameState.NORMAL && this.availableTiles.includes(tile)) + )); + } + public override handleMouseMove(x: number, y: number): void { - if (this.state !== GameState.NORMAL) { - return; - } - this.availableTiles.forEach(tile => tile.handleMouseMove(x - this.left, y - this.top)); + this.activeTiles.forEach(tile => tile.handleMouseMove(x - this.left, y - this.top)); } public override handleClick(x: number, y: number): void { @@ -281,7 +286,7 @@ export default class TileMap extends Entity { character.heal(character); } else if (item.type === ItemType.WEAPON_GRENADE && this.state === GameState.FIGHT) { this.killEnemy(); - } else if (item.type === ItemType.ITEM_PLANKS && character.lastDoor?.items.length === 0) { + } else if (item.type === ItemType.ITEM_PLANKS && character.lastDoor && !character.lastDoor.enemy) { character.lastDoor.type = TileType.LOCKED_DOOR; } else { success = false; @@ -310,6 +315,12 @@ export default class TileMap extends Entity { private killEnemy() { this.character.tile.killEnemy(); + this.character.tile.items.forEach((item) => { + if (item.isPickable) { + this.character.inventory.push(item); + this.character.tile.removeItem(item); + } + }); this.nextCharacter(); this.setNormalState(); } @@ -320,28 +331,20 @@ export default class TileMap extends Entity { ctx.lineWidth = 2; ctx.fillStyle = 'rgba(0, 255, 0, 0.5)'; - if (this.state === GameState.NORMAL && this.availableTiles.length > 0) { - ctx.beginPath(); - + if (this.state === GameState.NORMAL) { this.availableTiles.forEach(t => ctx.fillRect(t.centerX - t.width / 2, t.centerY - t.height / 2, t.width, t.height) ); - - ctx.stroke(); } const w = this.tileSize * 0.8; - this.characters.toReversed().forEach(c => + [...this.characters, this.character].forEach(c => ctx.drawImage(c.type, c.tile.centerX - w / 2, c.tile.centerY - w / 2, w, w) ); - this.tiles.forEach(t => { - if (t.items.length > 0 || (this.state === GameState.NORMAL && this.availableTiles.includes(t))) { - t.render(ctx); - } - }); + this.activeTiles.forEach(t => t.render(ctx)); - ctx.lineWidth = 3; + ctx.lineWidth = 5; ctx.strokeStyle = 'yellow'; ctx.strokeRect(this.character.tile.centerX - w / 2, this.character.tile.centerY - w / 2, w, w);