From 6e95c538fbef20b0462e90411aa56019176291e1 Mon Sep 17 00:00:00 2001 From: Schluffe Date: Mon, 16 Mar 2026 00:18:11 +0100 Subject: [PATCH] WIP WIP WIP --- engine/dev/draw.ts | 37 ++++++++++++++++++++++++++ engine/dev/main.tsx | 12 +++++++++ engine/system/processPhysics.ts | 21 +++++++++++++++ game/entities/hero/entity.ts | 10 +++++++ game/scenes/barScene/scene.ts | 47 +-------------------------------- main.ts | 3 +++ 6 files changed, 84 insertions(+), 46 deletions(-) create mode 100644 engine/dev/draw.ts create mode 100644 engine/system/processPhysics.ts diff --git a/engine/dev/draw.ts b/engine/dev/draw.ts new file mode 100644 index 0000000..f251aec --- /dev/null +++ b/engine/dev/draw.ts @@ -0,0 +1,37 @@ +import type { Polygon } from "#/engine/Polygon.ts"; +import type { Vector } from "#/engine/Vector.ts"; + +export function drawPoint( + ctx: CanvasRenderingContext2D, + position: Vector, + radius: number = 1, + color: string = "#fff", +): void { + ctx.beginPath(); + ctx.arc(position.x, position.y, radius, 0, 2 * Math.PI); + ctx.fillStyle = color; + ctx.fill(); +} + +export function drawPolygon( + ctx: CanvasRenderingContext2D, + polygon: Polygon, + color: string = "#fff", +): void { + drawPoint(ctx, polygon.position); + ctx.beginPath(); + ctx.moveTo( + polygon.points[0].x + polygon.position.x, + polygon.points[0].y + polygon.position.y, + ); + + for (let i = polygon.points.length - 1; i >= 0; i--) { + ctx.lineTo( + polygon.points[i].x + polygon.position.x, + polygon.points[i].y + polygon.position.y, + ); + } + + ctx.strokeStyle = color; + ctx.stroke(); +} diff --git a/engine/dev/main.tsx b/engine/dev/main.tsx index 5d20975..dc8fdf6 100644 --- a/engine/dev/main.tsx +++ b/engine/dev/main.tsx @@ -3,6 +3,7 @@ import { type Component, createEffect, createSignal, onMount } from "solid-js"; import { render } from "solid-js/web"; import $, { currentScene, + type SceneChange, type SceneData, sceneChangeSet, sceneGraph, @@ -121,6 +122,17 @@ const DevTools: Component<{ gameContainer: HTMLElement }> = ({ document.addEventListener("mousemove", handleMouseMove); document.addEventListener("mouseup", stopResizing); + + if (location.hash) { + const callback: SceneChange = (sceneData) => { + const name = location.hash.substring(1); + if (sceneData.name !== name) { + setScene(name).catch(console.error); + } + sceneChangeSet.delete(callback); + }; + sceneChangeSet.add(callback); + } }); return ( diff --git a/engine/system/processPhysics.ts b/engine/system/processPhysics.ts new file mode 100644 index 0000000..0afa818 --- /dev/null +++ b/engine/system/processPhysics.ts @@ -0,0 +1,21 @@ +import $ from "#/engine/Scene.ts"; +import type { Vector } from "#/engine/Vector.ts"; + +export type Collider = {}; + +export type Collision = {}; + +export function moveAndCollide( + collider: Collider, + velocity: Vector, + delta: number, +): Collision {} + +export function processPhysics( + ctx: CanvasRenderingContext2D, + delta: number, +): void { + for (const [id, collider] of $("collider")!.entries()) { + const position = $("position")!.get(id); + } +} diff --git a/game/entities/hero/entity.ts b/game/entities/hero/entity.ts index 7070040..0e8e021 100644 --- a/game/entities/hero/entity.ts +++ b/game/entities/hero/entity.ts @@ -1,3 +1,4 @@ +import { createCircle } from "#/engine/Circle.ts"; import { defineEntity } from "#/engine/Entity.ts"; import { keyboardInput } from "#/engine/Keyboard.ts"; import { pointer } from "#/engine/Pointer.ts"; @@ -7,6 +8,10 @@ import { createSpriteAnimation, defineSpriteSheet, } from "#/engine/Sprite.ts"; +import { + type Collider, + moveAndCollide, +} from "#/engine/system/processPhysics.ts"; import { createVector, type Vector } from "#/engine/Vector.ts"; import charIdle from "#/game/assets/char-idle.png"; @@ -18,11 +23,13 @@ const process = defineEntity("hero", { sprite: createSprite(idleSrc), animation: createSpriteAnimation(500, 2), velocity: createVector(), + collider: createCircle(createVector(), 8), }); process((id, delta) => { const position = $("position").get(id)!.value; const velocity = $("velocity").get(id)!.value; + const collider = $("collider").get(id)!.value; if (pointer.isDown) { position.x = pointer.position.x; @@ -39,4 +46,7 @@ process((id, delta) => { velocity.x = 0; velocity.y = 0; + + const collision = moveAndCollide(collider, velocity, delta); + console.log(collision); }); diff --git a/game/scenes/barScene/scene.ts b/game/scenes/barScene/scene.ts index 819a62d..bccf16b 100644 --- a/game/scenes/barScene/scene.ts +++ b/game/scenes/barScene/scene.ts @@ -1,53 +1,8 @@ -import { createPolygon, type Polygon } from "#/engine/Polygon.ts"; import { defineScene } from "#/engine/Scene.ts"; -import { createVector, type Vector } from "#/engine/Vector.ts"; import data from "./data.json"; const { process, linkScenes } = defineScene(data); linkScenes(["testScene"] as const); -const polygon = createPolygon(createVector(32, 32), [ - createVector(0, 0), - createVector(0, 16), - createVector(16, 16), -]); - -function drawPoint( - ctx: CanvasRenderingContext2D, - position: Vector, - radius: number = 2, - color: string = "#fff", -): void { - ctx.beginPath(); - ctx.arc(position.x, position.y, radius, 0, 2 * Math.PI); - ctx.fillStyle = color; - ctx.fill(); -} - -function drawPoly( - ctx: CanvasRenderingContext2D, - poly: Polygon, - trigger: boolean = false, -): void { - drawPoint(ctx, poly.position); - ctx.beginPath(); - ctx.moveTo( - poly.points[0].x + poly.position.x + 0.5, - poly.points[0].y + poly.position.y + 0.5, - ); - - for (let i = poly.points.length - 1; i >= 0; i--) { - ctx.lineTo( - poly.points[i].x + poly.position.x + 0.5, - poly.points[i].y + poly.position.y + 0.5, - ); - } - - ctx.strokeStyle = trigger ? "red" : "orange"; - ctx.stroke(); -} - -process((ctx, _delta) => { - drawPoly(ctx, polygon); -}); +process((_ctx, _delta) => {}); diff --git a/main.ts b/main.ts index 964e0b9..a072b7c 100644 --- a/main.ts +++ b/main.ts @@ -3,6 +3,7 @@ import { listenPointer } from "#/engine/Pointer.ts"; import { currentScene, setScene } from "#/engine/Scene.ts"; import { animateSprites } from "#/engine/system/animateSprites.ts"; import { drawSprites } from "#/engine/system/drawSprites.ts"; +import { processPhysics } from "#/engine/system/processPhysics.ts"; import { initViewport, resetCtx, @@ -19,6 +20,8 @@ function animate(timestamp: number): void { resetCtx(); currentScene.process(viewport.ctx, delta); + processPhysics(viewport.ctx, delta); + animateSprites(delta); drawSprites(viewport.ctx);