A library for managing your camera.
const camera = new Camera({
"target": {"x": 2, "y": 2},
"frame": {"width": 16, "height": 9},
"zones": [{"x1": 0, "x2": 5, "y1": 0, "y2": 0}]
})The target moves around the world, and the camera follows. For most of the game, this is the player character.
The target's position is centered in the frame.
The width and height of the view space into the game. This is the absolute dimensions you will ever see on the screen.
The frame can also support a zoom into the world.
A zone is a space within the world that constrains the camera. While the camera's target is within a zone, the camera will continue to follow the target, but if the target gets near the edge of the zone, it will lock and won't leak over the edge.
If the zone is smaller than the frame, it just centers within the zone, and does not move.
If 2 zones are overlapping, and the camera's target is already focused in one of them, it will continue to respect the zone it was previously in. If 2 zones are overlapping, and the camera's target steps into both of them at the same time, it will use the zone defined higher in the list.
The zones can be formatted by either 4 positions or 2 positions + 2 dimensions. As such, both of these zones are identical:
{"x1": 0, "x2": 5, "y1": 0, "y2": 0} // 4 positions
{"x": 0, "y": 0, "width": 5, "height": 5} // 2 positions & 2 dimensionsAfter passing in the zone with either format, the zone will be mutated to include the other format. If both formats are provided, it respected the 4 positions.
In the 4 positions format, x1 should be less than x2, and y1 should be less than y2. If this is not true, it will mutate the zone to correct it.
Zone coordinates are inclusive, so 0x0-5x5 will include 5x5.
- Should this package also own the pointer math? (it has variables like frame and zoom and offset)
- Will this package ship with the +0.5 on the camera to "center it on the tile"? That seems very specific to tile-based games.
- This should link to a ReactCam and PixiCam renderer.