start: der ewige krueis

engine/system/physics.ts

@@ -5,12 +5,12 @@ import $ from "#/engine/Scene.ts";
 import { createVector, getDotProduct, type Vector } from "#/engine/Vector.ts";
 
 export enum Shape {
-	Cirle,
+	Circle,
 	Rect,
 	Polygon,
 }
 
-const CIRCLE = Shape.Cirle;
+const CIRCLE = Shape.Circle;
 const RECT = Shape.Rect;
 const POLYGON = Shape.Polygon;
 
@@ -64,7 +64,7 @@ export function createCollider(
 			width = size;
 			height = size;
 			if (offset === undefined) {
-				offset = createVector();
+				offset = createVector(-radius, -radius);
 			}
 			break;
 		}

game/entities/hero/entity.ts

@@ -1,8 +1,8 @@
+import { createCircle } from "#/engine/Circle.ts";
 import { defineEntity } from "#/engine/Entity.ts";
 import { keyboardInput } from "#/engine/Keyboard.ts";
 import { createEffect, createSignal } from "#/engine/lib/Signal.ts";
 import { pointer } from "#/engine/Pointer.ts";
-import { createRect } from "#/engine/Rect.ts";
 import $ from "#/engine/Scene.ts";
 import {
 	createSprite,
@@ -30,7 +30,7 @@ const process = defineEntity("hero", {
 	sprite: createSprite(idleSrc, createVector(-8, -8)),
 	animation: createSpriteAnimation(500, 2),
 	velocity: createVector(),
-	collider: createCollider(Shape.Rect, createRect(24, 16)),
+	collider: createCollider(Shape.Circle, createCircle(8)),
 });
 
 createEffect(() => {

game/entities/portal/entity.ts

@@ -1,5 +1,5 @@
+import { createCircle } from "#/engine/Circle.ts";
 import { defineEntity } from "#/engine/Entity.ts";
-import { createRect } from "#/engine/Rect.ts";
 import {
 	createSprite,
 	createSpriteAnimation,
@@ -16,5 +16,5 @@ defineEntity("portal", {
 	position,
 	sprite: createSprite(portalSrc, createVector(-8, -8)),
 	animation: createSpriteAnimation(400, 0),
-	collider: createCollider(Shape.Rect, createRect(16, 16)),
+	collider: createCollider(Shape.Circle, createCircle(8)),
 });

main.ts

@@ -39,6 +39,13 @@ function debug(ctx: CanvasRenderingContext2D) {
 			2,
 			2,
 		);
+
+		if (collider.value.shape === 0) {
+			// @ts-ignore
+			ctx.arc(pos.x, pos.y, collider.value.body.radius, 0, 2 * Math.PI);
+			ctx.strokeStyle = "white";
+			ctx.stroke();
+		}
 	}
 }