Schluffe/nage
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

WIP

Browse Source
This commit is contained in:
Schluffe
2026-02-18 20:35:44 +01:00
parent 966e83076f
commit 8ea950db5a
7 changed files with 120 additions and 80 deletions
Download Patch File Download Diff File Expand all files Collapse all files
engine/AABB.ts
-43
View File
@@ -1,43 +0,0 @@
import { copyVector, type Vector } from "#/engine/Vector.ts";
export type AABB = {
position: Vector;
width: number;
height: number;
};
export function createAABB(
position: Vector,
width: number,
height: number,
): AABB {
return {
position,
width,
height,
};
}
export function fromMinMax(min: Vector, max: Vector): AABB {
return {
position: copyVector(min),
width: max.x - min.x,
height: max.y - min.y,
};
}
export function drawAABB(
ctx: CanvasRenderingContext2D,
aabb: AABB,
color: string = "#fff",
): void {
ctx.save();
ctx.strokeStyle = color;
ctx.strokeRect(
aabb.position.x - 0.5,
aabb.position.y - 0.5,
aabb.width,
aabb.height,
);
ctx.restore();
}
engine/Circle.ts
+18 -1
View File
@@ -12,15 +12,32 @@ export function createCircle(position: Vector, radius: number): Circle {
};
}
export function drawCircle(
export function strokeCircle(
ctx: CanvasRenderingContext2D,
circle: Circle,
color: string = "#fff",
alpha: number = 1.0,
): void {
ctx.save();
ctx.strokeStyle = color;
ctx.globalAlpha = alpha;
ctx.beginPath();
ctx.arc(circle.position.x, circle.position.y, circle.radius, 0, 2 * Math.PI);
ctx.stroke();
ctx.restore();
}
export function fillCircle(
ctx: CanvasRenderingContext2D,
circle: Circle,
color: string = "#fff",
alpha: number = 1.0,
): void {
ctx.save();
ctx.fillStyle = color;
ctx.globalAlpha = alpha;
ctx.beginPath();
ctx.arc(circle.position.x, circle.position.y, circle.radius, 0, 2 * Math.PI);
ctx.fill();
ctx.restore();
}
engine/Rect.ts
+63
View File
@@ -0,0 +1,63 @@
import { copyVector, type Vector } from "#/engine/Vector.ts";
export type Rect = {
position: Vector;
width: number;
height: number;
};
export function createRect(
position: Vector,
width: number,
height: number,
): Rect {
return {
position,
width,
height,
};
}
export function fromMinMax(min: Vector, max: Vector): Rect {
return {
position: copyVector(min),
width: max.x - min.x,
height: max.y - min.y,
};
}
export function strokeRect(
ctx: CanvasRenderingContext2D,
rect: Rect,
color: string = "#fff",
alpha: number = 1.0,
): void {
ctx.save();
ctx.strokeStyle = color;
ctx.globalAlpha = alpha;
ctx.strokeRect(
rect.position.x - 0.5,
rect.position.y - 0.5,
rect.width,
rect.height,
);
ctx.restore();
}
export function fillRect(
ctx: CanvasRenderingContext2D,
rect: Rect,
color: string = "#fff",
alpha: number = 1.0,
): void {
ctx.save();
ctx.strokeStyle = color;
ctx.globalAlpha = alpha;
ctx.fillRect(
rect.position.x - 0.5,
rect.position.y - 0.5,
rect.width,
rect.height,
);
ctx.restore();
}
engine/dev/main.tsx
+4
View File
@@ -18,6 +18,7 @@ import {
setScene,
} from "#/engine/Scene.ts";
import { setScale, viewport } from "#/engine/Viewport.ts";
import { strokeRect } from "../Rect.ts";
import { InputField } from "./controls/InputField.tsx";
import { RangeSlider } from "./controls/RangeSlider.tsx";
import { GraphBrowser } from "./GraphBrowser.tsx";
@@ -115,6 +116,7 @@ const DevTools: Component<{ gameContainer: HTMLElement }> = ({
processProxy(...args);
ctx.save();
ctx.globalAlpha = 0.75;
ctx.lineWidth = 1;
ctx.strokeStyle = "#6572f5";
viewport.ctx.strokeRect(
@@ -131,6 +133,8 @@ const DevTools: Component<{ gameContainer: HTMLElement }> = ({
2,
2,
);
ctx.beginPath();
ctx.fill();
ctx.restore();
};
};
engine/lib/geometry.ts
+32 -32
View File
@@ -1,5 +1,5 @@
import type { AABB } from "#/engine/AABB.ts";
import type { Circle } from "#/engine/Circle.ts";
import type { Rect } from "#/engine/Rect";
import type { Vector } from "#/engine/Vector.ts";
export function isPointInCircle(point: Vector, circle: Circle): boolean {
@@ -9,15 +9,15 @@ export function isPointInCircle(point: Vector, circle: Circle): boolean {
return dx * dx + dy * dy <= circle.radius ** 2;
}
export function isPointInAABB(point: Vector, aabb: AABB): boolean {
const rx = aabb.position.x;
const ry = aabb.position.y;
export function isPointInRect(point: Vector, rect: Rect): boolean {
const rx = rect.position.x;
const ry = rect.position.y;
return (
point.x >= rx &&
point.x <= rx + aabb.width &&
point.x <= rx + rect.width &&
point.y >= ry &&
point.y <= ry + aabb.height
point.y <= ry + rect.height
);
}
@@ -28,7 +28,7 @@ export function circleIntersectCircle(a: Circle, b: Circle): boolean {
return dx * dx + dy * dy <= (a.radius + b.radius) ** 2;
}
export function AABBIntersectAABB(a: AABB, b: AABB): boolean {
export function RectIntersectRect(a: Rect, b: Rect): boolean {
const ax = a.position.x;
const ay = a.position.y;
const bx = b.position.x;
@@ -42,14 +42,14 @@ export function AABBIntersectAABB(a: AABB, b: AABB): boolean {
);
}
export function circleIntersectAABB(circle: Circle, aabb: AABB): boolean {
export function circleIntersectRect(circle: Circle, rect: Rect): boolean {
const cx = circle.position.x;
const cy = circle.position.y;
const rx = aabb.position.x;
const ry = aabb.position.y;
const rx = rect.position.x;
const ry = rect.position.y;
const dx = cx - Math.max(rx, Math.min(cx, rx + aabb.width));
const dy = cy - Math.max(ry, Math.min(cy, ry + aabb.height));
const dx = cx - Math.max(rx, Math.min(cx, rx + rect.width));
const dy = cy - Math.max(ry, Math.min(cy, ry + rect.height));
return dx * dx + dy * dy <= circle.radius ** 2;
}
@@ -62,7 +62,7 @@ export function circleContainsCircle(a: Circle, b: Circle): boolean {
return a.radius >= b.radius + distance;
}
export function AABBContainsAABB(a: AABB, b: AABB): boolean {
export function RectContainsRect(a: Rect, b: Rect): boolean {
const ax = a.position.x;
const ay = a.position.y;
const bx = b.position.x;
@@ -76,44 +76,44 @@ export function AABBContainsAABB(a: AABB, b: AABB): boolean {
);
}
export function AABBContainsCircle(aabb: AABB, circle: Circle): boolean {
const rx = aabb.position.x;
const ry = aabb.position.y;
export function RectContainsCircle(rect: Rect, circle: Circle): boolean {
const rx = rect.position.x;
const ry = rect.position.y;
const cx = circle.position.x;
const cy = circle.position.y;
return (
rx <= cx - circle.radius &&
rx + aabb.width >= cx + circle.radius &&
rx + rect.width >= cx + circle.radius &&
ry <= cy - circle.radius &&
ry + aabb.height >= cy + circle.radius
ry + rect.height >= cy + circle.radius
);
}
export function circleContainsAABB(circle: Circle, aabb: AABB): boolean {
const radiusSquare = circle.radius ** 2;
export function circleContainsRect(circle: Circle, rect: Rect): boolean {
const radSquare = circle.radius ** 2;
const dax = aabb.position.x - circle.position.x;
const day = aabb.position.y - circle.position.y;
if (dax * dax + day * day > radiusSquare) {
const dax = rect.position.x - circle.position.x;
const day = rect.position.y - circle.position.y;
if (dax * dax + day * day > radSquare) {
return false;
}
const dbx = aabb.position.x + aabb.width - circle.position.x;
const dby = aabb.position.y - circle.position.y;
if (dbx * dbx + dby * dby > radiusSquare) {
const dbx = rect.position.x + rect.width - circle.position.x;
const dby = rect.position.y - circle.position.y;
if (dbx * dbx + dby * dby > radSquare) {
return false;
}
const dcx = aabb.position.x - circle.position.x;
const dcy = aabb.position.y + aabb.height - circle.position.y;
if (dcx * dcx + dcy * dcy > radiusSquare) {
const dcx = rect.position.x - circle.position.x;
const dcy = rect.position.y + rect.height - circle.position.y;
if (dcx * dcx + dcy * dcy > radSquare) {
return false;
}
const ddx = aabb.position.x + aabb.width - circle.position.x;
const ddy = aabb.position.y + aabb.height - circle.position.y;
if (ddx * ddx + ddy * ddy > radiusSquare) {
const ddx = rect.position.x + rect.width - circle.position.x;
const ddy = rect.position.y + rect.height - circle.position.y;
if (ddx * ddx + ddy * ddy > radSquare) {
return false;
}