### Creating the Enemy Chaser (Step by Step)
**Overview:** Add a heart-shaped Enemy Chaser that patrols, bounces on walls, and defeats the player on touch. Created with Copilot and shared as a chapter of memory and code.
---
#### 1) Create the object class
- **File:** objects/EnemyChaser.js
```js
class EnemyChaser extends InteractiveLevelObject {
constructor(x, y, tileSize, type, tileMapHandler, extraAttributes = {}) {
super(x, y, tileSize, type, tileMapHandler, extraAttributes);
this.tileMapHandler = tileMapHandler;
this.speed = extraAttributes.speed || 1;
this.direction = 1; // 1 = right, -1 = left
this.collidesWithWalls = extraAttributes.collidesWithWalls ?? true;
this.animation = SpritePixelArrays.ENEMY_CHASER.animation[0];
}
draw(spriteCanvas) {
const newX = this.x + this.speed * this.direction;
// Next tile check
const tileX = this.tileMapHandler.getTileValueForPosition(
this.direction > 0 ? newX + this.tileSize - 1 : newX
);
const tileY = this.tileMapHandler.getTileValueForPosition(this.y);
const tileType = this.tileMapHandler.getTileLayerValueByIndex(tileY, tileX);
// Wall collision bounce
if (this.collidesWithWalls && tileType !== 0) {
this.direction *= -1;
} else {
this.x = newX;
}
// Player collision
const player = this.tileMapHandler?.player;
if (
player &&
Math.abs(this.x - player.x) < this.tileSize / 2 &&
Math.abs(this.y - player.y) < this.tileSize / 2
) {
PlayMode.playerDeath();
}
super.draw(spriteCanvas);
}
}
```
---
#### 2) Register the script
- **File:** index.html
```html
<script src="objects/EnemyChaser.js"></script>
```
---
#### 3) Add the type
- **File:** utils/ObjectTypes.js
```js
static get ENEMY_CHASER() {
return 'enemyChaser';
}
```
- **Map at the end:**
```js
[this.ENEMY_CHASER]: EnemyChaser
```
---
#### 4) Add sprite and attributes
- **File:** utils/SpritePixelArray.js
```js
this.ENEMY_CHASER = {
name: ObjectTypes.ENEMY_CHASER,
type: this.SPRITE_TYPES.object,
descriptiveName: "Enemy Chaser",
changeableAttributes: [
{ name: this.changeableAttributeTypes.speed, defaultValue: 1, minValue: 1, maxValue: 5 },
{
name: this.changeableAttributeTypes.collidesWithWalls,
defaultValue: true,
formElement: this.changeableAttributeFormElements.checkbox,
checkboxDescription: "Chaser collides with walls"
}
],
squishAble: false,
rotateable: false,
description: "Un enemigo feroz con forma de coraz贸n que patrulla y mata al jugador al tocarlo.",
animation: [{
sprite: [
["transp","AA0000","AA0000","transp","transp","AA0000","AA0000","transp"],
["AA0000","FF0000","FF0000","AA0000","AA0000","FF0000","FF0000","AA0000"],
["AA0000","FF0000","FFFFFF","FF0000","FF0000","FFFFFF","FF0000","AA0000"], // 馃憖 white eyes
["AA0000","FF0000","FF0000","FF0000","FF0000","FF0000","FF0000","AA0000"],
["transp","AA0000","FF0000","FF0000","FF0000","FF0000","AA0000","transp"],
["transp","transp","AA0000","AA0000","AA0000","AA0000","transp","transp"],
["transp","transp","transp","AA0000","AA0000","transp","transp","transp"],
["transp","transp","transp","transp","transp","transp","transp","transp"]
]
}]
};
```
---
#### Closing note
With Copilot the Enemy Chaser was created.
This heart-shaped foe patrols the level, collides with walls, and defeats the player on touch.
A chapter of memory and code, now shared with you.