From 53db7e795c4f0023a9f8d715fca88d7c90d7fabb Mon Sep 17 00:00:00 2001 From: Darius Schefer Date: Sun, 31 Aug 2025 22:34:02 +0200 Subject: [PATCH] Bad collision --- src/components/Amogus/Amogus.tsx | 59 +++++++++++++++++++------- src/components/Amogus/style.module.css | 4 ++ 2 files changed, 48 insertions(+), 15 deletions(-) diff --git a/src/components/Amogus/Amogus.tsx b/src/components/Amogus/Amogus.tsx index e7c5500..535fd00 100644 --- a/src/components/Amogus/Amogus.tsx +++ b/src/components/Amogus/Amogus.tsx @@ -12,6 +12,9 @@ type Amogus = { speedY: number; }; +const amogusWidth = 70; +const amogusHeight = 70; + const { innerWidth: width, innerHeight: height } = window; const getImage = (sus: Amogus) => (sus.isImposter ? imposter : amogus); @@ -24,6 +27,9 @@ const makeInitialCrewmates: Amogus[] = () => { makeCrewmate(false), makeCrewmate(false), makeCrewmate(false), + makeCrewmate(false), + makeCrewmate(false), + makeCrewmate(false), ]; }; @@ -32,14 +38,15 @@ const randNum: number = (min: number, max: number) => const makeCrewmate: Amogus = (imposter: boolean) => ({ isImposter: imposter, - posX: randNum(0, width - 90), - posY: randNum(0, height - 120), - speedX: Math.random() > 0.5 ? randNum(5, 15) : randNum(-5, -15), - speedY: Math.random() > 0.5 ? randNum(5, 15) : randNum(-5, -15), + posX: randNum(0, width - amogusWidth), + posY: randNum(0, height - amogusHeight), + speedX: Math.random() > 0.5 ? randNum(3, 10) : randNum(-3, -10), + speedY: Math.random() > 0.5 ? randNum(3, 10) : randNum(-3, -10), }); const intersect: Bool = (c1: Crewmate, c2: Crewmate) => - Math.abs(c1.posX - c2.posX) < 80 && Math.abs(c1.posY - c2.posY) < 90; + Math.abs(c1.posX - c2.posX) < amogusWidth - 20 && + Math.abs(c1.posY - c2.posY) < amogusHeight - 20; const doMove = (crewmates: Amogus[]) => crewmates.map((c) => ({ @@ -48,16 +55,37 @@ const doMove = (crewmates: Amogus[]) => posY: c.posY + c.speedY, })); -const doCollision = (crewmates: Amogus[]) => +const doCollisionWalls = (crewmates: Amogus[]) => crewmates.map((c) => { - if (c.posX > width - 90) { - return { ...c, posX: width - 90, speedX: c.speedX * -1 }; - } else if (c.posX < 0) { - return { ...c, posX: 0, speedX: c.speedX * -1 }; - } else if (c.posY > height - 120) { - return { ...c, posY: height - 120, speedY: c.speedY * -1 }; - } else if (c.posY < 0) { - return { ...c, posY: 0, speedY: c.speedY * -1 }; + if (c.posX > width - amogusWidth) { + return { + ...c, + posX: width - amogusWidth, + speedX: c.speedX * -1, + }; + } else if (c.posX < -20) { + return { ...c, posX: -20, speedX: c.speedX * -1 }; + } else if (c.posY > height - amogusHeight) { + return { + ...c, + posY: height - amogusHeight, + speedY: c.speedY * -1, + }; + } else if (c.posY < -20) { + return { ...c, posY: -20, speedY: c.speedY * -1 }; + } else return c; + }); + +const doCollisionOthers = (crewmates: Amogus[]) => + crewmates.map((c) => { + const intersections = crewmates + .filter((o) => intersect(c, o)) + .filter((o) => Math.abs(o.posX - c.posX) > 1e-3) // don't collide with yourself pls + .filter((o) => Math.abs(o.posY - c.posY) > 1e-3); + if (intersections.some((o) => Math.abs(o.posX - c.posX) < 50)) { + return { ...c, speedX: c.speedX * -1 }; + } else if (intersections.some((o) => Math.abs(o.posY - c.posY) < 50)) { + return { ...c, speedY: c.speedY * -1 }; } else return c; }); @@ -88,7 +116,8 @@ export default function Amogus() { useEffect(() => { const timer = setInterval(() => { setCrewmates((c) => doMove(c)); - setCrewmates((c) => doCollision(c)); + setCrewmates((c) => doCollisionWalls(c)); + setCrewmates((c) => doCollisionOthers(c)); setCrewmates((c) => doKills(c)); setCrewmates((c) => checkReset(c)); }, 50); diff --git a/src/components/Amogus/style.module.css b/src/components/Amogus/style.module.css index 02b7665..53ffe35 100644 --- a/src/components/Amogus/style.module.css +++ b/src/components/Amogus/style.module.css @@ -1,4 +1,8 @@ .container { z-index: 100; position: absolute; + scale: 50%; + display: flex; + justify-content: center; + align-items: center; }