feat: spawn orbs when sprinting

pixselve-school · Jan 24, 2024 · 22b57e3 · 22b57e3
1 parent 9b1a40e
commit 22b57e3
Show file tree

Hide file tree

Showing 6 changed files with 43 additions and 5 deletions.
diff --git a/packages/client/src/app/canvas.tsx b/packages/client/src/app/canvas.tsx
@@ -116,6 +116,16 @@ export function Canvas({ centered }: { centered?: boolean }) {
       c.fill();
     });
 
+    // Draw all orbs
+    api.scene.orbs.forEach((orb) => {
+      const screenOrb = worldToScreen(orb.position, camera);
+      c.beginPath();
+      c.arc(screenOrb.x, screenOrb.y, 5 * orb.size, 0, 2 * Math.PI); // Draw a circle for each orb
+      // use blue color
+      c.fillStyle = "blue";
+      c.fill();
+    });
+
     // Draw all players
     api.scene.players.forEach((player) => {
       player.body.forEach((bodyPart) => {

diff --git a/packages/server/src/handleFrame.ts b/packages/server/src/handleFrame.ts
@@ -6,6 +6,7 @@ import {
   Player,
   SPRINT_SPEED,
   MAX_ANGLE,
+  ORB_SPRINTING_DROP_RATE,
 } from "@viper-vortex/shared";
 
 function movePlayer(player: Player, gameMap: GameMap) {
@@ -15,6 +16,20 @@ function movePlayer(player: Player, gameMap: GameMap) {
   const head = getPlayerHead(player);
   const speed = player.isSprinting ? SPRINT_SPEED : BASE_SPEED;
 
+  if (player.isSprinting) {
+    player.orbToDrop += ORB_SPRINTING_DROP_RATE;
+    if (player.orbToDrop >= 1) {
+      player.orbToDrop -= 1;
+      // drop an orb
+      const lastBodyPart = player.body[player.body.length - 1];
+      gameMap.orbs.push({
+        id: Math.random().toString(),
+        position: { x: lastBodyPart.x, y: lastBodyPart.y },
+        size: 1,
+      });
+    }
+  }
+
   const currentAngle = player.angle;
   const targetAngle = player.desiredAngle;
 
@@ -70,8 +85,8 @@ export default function handleFrame(
         gameMap.food.splice(i, 1);
         // add a new body part
         player.body.push({
-          x: player.body[player.body.length - 1].x + 2,
-          y: player.body[player.body.length - 1].y + 2,
+          x: player.body[player.body.length - 1].x,
+          y: player.body[player.body.length - 1].y,
         });
       }
     }

diff --git a/packages/server/src/index.ts b/packages/server/src/index.ts
@@ -36,6 +36,7 @@ io.on(SOCKET_EVENTS.CONNECT, (socket) => {
     isSprinting: false,
     angle: 0,
     desiredAngle: 0,
+    orbToDrop: 0,
   };
 
   gameMap.players.push(player);

diff --git a/packages/shared/src/constants.ts b/packages/shared/src/constants.ts
@@ -22,6 +22,11 @@ export const FOOD_PICKUP_RADIUS = 20;
  */
 export const MAX_ANGLE = Math.PI / 20;
 
+/**
+ * The rate at which a player will drop an orb when sprinting.
+ */
+export const ORB_SPRINTING_DROP_RATE = 0.1;
+
 /**
  * Enum for socket events.
  * @enum {string}

diff --git a/packages/shared/src/types.ts b/packages/shared/src/types.ts
@@ -6,6 +6,7 @@ export type GameMap = {
   height: number;
   players: Player[];
   food: Food[];
+  orbs: Orb[];
 };
 
 /**
@@ -17,8 +18,12 @@ export type Player = {
   name: string;
   color: string;
   isSprinting: boolean;
-  angle: number; // in radians
-  desiredAngle: number; // in radians
+  // in radians
+  angle: number;
+  // in radians
+  desiredAngle: number;
+  // 0 - 1: will vary based on `ORB_SPRINTING_DROP_RATE`
+  orbToDrop: number;
 };
 
 /**
@@ -29,7 +34,8 @@ export type Player = {
 export type Orb = {
   id: string;
   position: Position;
-  size: number; // 1 - 10
+  // 1 - 10
+  size: number;
 };
 
 /**

diff --git a/packages/shared/src/utils.ts b/packages/shared/src/utils.ts
@@ -13,6 +13,7 @@ export function newGameMap(): GameMap {
     height: 1000,
     players: [],
     food: randomFood(AMOUNT_OF_FOOD),
+    orbs: [],
   };
 }