Hello,
i'm pleased to write first tutorial on this community forum 😃
Just finished writing simple class allowing me to dynamically spawn NPCs with help of Polygon from Tiled map editor, and decided to share 😉 Before we start i would like to point out that i'm relatively new to JS/TS, and i understand it probably could be written in a better way.
Final outcome
Check the sample video!
Let's begin
To detect shapes collisions i used library @Samarium mentioned in another post - SAT, so first step will be installing SAT:
npm install sat
Next, let's create a class responsible for our spawns. I attach link to download a ready .ts file, as it's code is very self explanatory. Maybe tommorow i will edit my post and go over it step by step to make a real tutorial (i'm pretty tired already 😉).
Now open your map's .ts file (for example /src/modules/main/server/maps/mapname.ts) and import the class:
import { Spawn } from '../utils/Spawn'
Below, in map's onLoad method create object of Spawn class, and pass shapes and map to constructor:
const spawns = new Spawn(this.getShapes(), this);
spawns.populate();
Now open Tiled editor and insert your polygons. Assign it custom properties:
spawn (string): 'zombie' // some name)
quantity (int): 10 // amount of NPC to spawn
Next, you have to map npc name assigned in Tiled editor to Event class. I did it by inserting code below inside the class, but you can come up with a better solution:
import { Skeleton, Zombie } from "../events/undeads"
const NPC = {
'zombie': Zombie,
'skeleton': Skeleton
}
And... I think that's it. I hope it helps 😉
Edit: i just realized there could be just the map instance in Spawn constructor, i'll fix it tommorow 🙂