Experimental canvas 2D engine for tile-based sidescroller/sandbox games, created strictly for educational purposes.
thevoid.cafe
entity-component-system
game-engine
canvas-2d
1import { Entity, System, type Cosmic } from "@cosmic/core";
2import { Transform, Renderable } from "@cosmic/kit/components";
3
4export class RenderingSystem extends System {
5 public requiredComponents = new Set([Transform.name, Renderable.name]);
6 private context: CanvasRenderingContext2D;
7
8 constructor(engine: Cosmic) {
9 super();
10 this.context = engine.getContext();
11 }
12
13 public update(entities: Entity[]): void {
14 this.context.clearRect(0, 0, 9999, 9999);
15
16 entities.forEach((entity) => {
17 const transform = entity.getComponent(Transform)!;
18
19 this.context.strokeStyle = "#bf1d70";
20 if (transform.isCollidingWithEntity) this.context.strokeStyle = "#d6a5b0";
21 if (transform.isCollidingWithCanvasBoundaries) this.context.strokeStyle = "purple";
22
23 this.context.strokeRect(transform.x, transform.y, transform.width, transform.height);
24 });
25 }
26}