raycasting implementedgit status

Author: yk-tuturu

src/bundles/robot_minigame/functions.ts

@@ -5,176 +5,211 @@
 
 import context from 'js-slang/context';
 
-const robotPos: Point = {x: 0, y: 0};
+type Point = {x: number, y: number};
+type Wall = {p1: Point, p2: Point};
 
-const DIRECTIONS = {
-  UP: 0,
-  RIGHT: 1,
-  DOWN: 2,
-  LEFT: 3
-};
+type Polygon = Point[];
+
+type StateData = {
+  isInit: boolean,
+  width: number,
+  height: number,
+  walls: Polygon[],
+  movePoints: Point[],
+  message: String,
+  success: boolean,
+  messages: String[]
+}
 
-let robotRotation = 1;
+type Robot = {
+  x: number; // the top left corner
+  y: number;
+  dx: number;
+  dy: number;
+  radius: number
+}
 
-// default grid width and height is 25
-context.moduleContexts.robot_minigame.state = {
+let stateData: StateData = {
   isInit: false,
-  width: 25,
-  height: 25,
+  width: 500,
+  height: 500,
   walls: [],
   movePoints: [],
   message: 'moved successfully',
-  success: true
-};
+  success: true,
+  messages: []
+}
 
-type Point = {x: number, y: number};
-type Wall = {p1: Point, p2: Point};
+let robot: Robot = {
+  x: 25, // default start pos, puts it at the top left corner of canvas without colliding with the walls
+  y: 25,
+  dx: 1,
+  dy: 0,
+  radius: 20 //give the robot a circular hitbox
+}
+
+let bounds: Point[] = []
+
+// default grid width and height is 25
+context.moduleContexts.robot_minigame.state = stateData;
 
 export function set_pos(x: number, y: number): void {
-  robotPos.x = x;
-  robotPos.y = y;
+  robot.x = x;
+  robot.y = y;
 }
 
-export function set_grid_width(width: number) {
-  context.moduleContexts.robot_minigame.state.width = width;
+export function set_width(width: number) {
+  stateData.width = width;
 }
 
-export function set_grid_height(height: number) {
-  context.moduleContexts.robot_minigame.state.height = height;
+export function set_height(height: number) {
+  stateData.height = height;
 }
 
-export function init(gridWidth: number, gridHeight: number, posX: number, posY: number) {
-  set_grid_width(gridWidth);
-  set_grid_height(gridHeight);
+export function init(width: number, height: number, posX: number, posY: number) {
+  set_width(width);
+  set_height(height);
   set_pos(posX, posY);
-  context.moduleContexts.robot_minigame.state.movePoints.push({x: posX, y: posY});
-  context.moduleContexts.robot_minigame.state.isInit = true;
+  stateData.movePoints.push({x: posX, y: posY});
+  stateData.isInit = true;
+
+  bounds = [
+    {x: 0, y: 0},
+    {x: width, y: 0},
+    {x: width, y: height},
+    {x: 0, y: height}
+  ]
+
 }
 
 export function turn_left() {
   if (alrCollided()) return;
 
-  robotRotation -= 1;
-  if (robotRotation < 0) {
-    robotRotation = 3;
-  }
+  let currentAngle = Math.tan(robot.dy / robot.dx);
+  currentAngle -= Math.PI / 2;
+
+  robot.dx = Math.cos(currentAngle);
+  robot.dy = Math.sin(currentAngle);
 }
 
 export function turn_right() {
   if (alrCollided()) return;
 
-  robotRotation = (robotRotation + 1) % 4;
+  let currentAngle = Math.tan(robot.dy / robot.dx);
+  currentAngle += Math.PI / 2;
+
+  robot.dx = Math.cos(currentAngle);
+  robot.dy = Math.sin(currentAngle);
 }
 
-// takes the top left and bottom right corners of walls
-// in terms of grid boxes
-// grid starts from (0, 0) at the top left corner btw
-export function set_wall(x1: number, y1: number, x2: number, y2: number) {
-  const wall: Wall = {p1: {x: x1, y: y1}, p2: {x: x2, y: y2}};
-  context.moduleContexts.robot_minigame.state.walls.push(wall);
+export function set_rect_wall(x: number, y: number, width: number, height: number) {
+  const polygon: Polygon = [
+    {x: x, y: y},
+    {x: x + width, y: y},
+    {x: x+width, y: y+height},
+    {x: x, y:y+height}
+  ]
+
+  stateData.walls.push(polygon);
 }
 
-export function move_forward(dist: number): void {
+export function move_forward(): void {
   if (alrCollided()) return;
 
-  simulate(dist);
+  const collisionPoint: Point | null = raycast(stateData.walls)
+  if (collisionPoint !== null) {
+    let nextPoint: Point = {
+      x: collisionPoint.x - robot.dx * (robot.radius + 5),
+      y: collisionPoint.y - robot.dy * (robot.radius + 5)
+    }
+    
+    robot.x = nextPoint.x;
+    robot.y = nextPoint.y;
+    stateData.movePoints.push(nextPoint);
+  }
 }
 
 export function getX():number {
-  return robotPos.x;
+  return robot.x;
 }
 
 export function getY():number {
-  return robotPos.y;
-}
-
-function simulate(moveDist: number) {
-  let dx: number = 0;
-  let dy: number = 0;
-  switch (robotRotation) {
-    case DIRECTIONS.UP:
-      dy = -1;
-      break;
-    case DIRECTIONS.RIGHT:
-      dx = 1;
-      break;
-    case DIRECTIONS.DOWN:
-      dy = 1;
-      break;
-    case DIRECTIONS.LEFT:
-      dx = -1;
-      break;
-  }
+  return robot.y;
+}
 
-  // moves robot by one grid box and checks collision
-  for (let i = 0; i < moveDist; i++) {
-    robotPos.x += dx;
-    robotPos.y += dy;
-
-    const walls = context.moduleContexts.robot_minigame.state.walls;
-    for (let j = 0; j < walls.length; j++) {
-      if (checkWallCollision(walls[j], robotPos)) {
-        context.moduleContexts.robot_minigame.state.success = false;
-        context.moduleContexts.robot_minigame.state.message = 'collided';
-        context.moduleContexts.robot_minigame.state.movePoints.push({x: robotPos.x, y: robotPos.y});
-        return;
+function raycast(polygons: Polygon[]): Point | null {
+  let nearest: Point | null = null;
+  let minDist = Infinity;
+
+  for (const polygon of polygons) {
+      stateData.messages.push("checking polygon");
+      const numVertices = polygon.length;
+      
+      for (let i = 0; i < numVertices; i++) {
+          const x1 = polygon[i].x, y1 = polygon[i].y;
+          const x2 = polygon[(i + 1) % numVertices].x, y2 = polygon[(i + 1) % numVertices].y;
+
+          const intersection = getIntersection(robot.x, robot.y, robot.dx + robot.x, robot.dy + robot.y, x1, y1, x2, y2);
+          
+          if (intersection.collided && intersection.dist < minDist) {
+              minDist = intersection.dist
+              nearest = {x: intersection.x, y: intersection.y};
+          }
       }
-    }
   }
 
-  context.moduleContexts.robot_minigame.state.movePoints.push({x: robotPos.x, y: robotPos.y});
-
-  // OLD CODE
-  // let destX = robotPos.x + moveDist * Math.cos(robotAngle);
-  // let destY = robotPos.y + moveDist * Math.sin(robotAngle);
-  // let destPoint: Point = {x: destX, y: destY}
+  // if no collisions with obstacles, check the outer bounds of map
+  if (nearest === null) {
+    for (let i = 0; i < bounds.length; i++) {
+      const x1 = bounds[i].x, y1 = bounds[i].y;
+      const x2 = bounds[(i + 1) % bounds.length].x, y2 = bounds[(i + 1) % bounds.length].y;
 
-  // for (let i = 0; i < steps; i++) {
-  //     let distX: number = moveSpeed * Math.cos(robotAngle);
-  //     let distY: number = moveSpeed * Math.sin(robotAngle);
+      const intersection = getIntersection(robot.x, robot.y, robot.dx + robot.x, robot.dy + robot.y, x1, y1, x2, y2);
 
-  //     robotPos.x += distX;
-  //     robotPos.y += distY;
-
-  //     for (let j = 0; j < walls.length; j++) {
-  //         if(checkWallCollision(walls[j], robotPos)) {
-  //             addMessage("Collided with wall!!");
-  //             addMessage(`Position: (${robotPos.x.toFixed(3)}, ${robotPos.y.toFixed(3)}), Rotation: ${robotAngle}\n`);
-  //             return;
-  //         }
-  //     }
-
-  //     if (distanceBetween(destPoint, robotPos) < robotRadius) {
-  //         robotPos = destPoint;
-  //         addMessage(`Robot moved forward by ${moveDist} at angle ${robotAngle} radians\n`);
-  //         addMessage(`Position: (${robotPos.x.toFixed(3)}, ${robotPos.y.toFixed(3)}), Rotation: ${robotAngle}\n`);
-  //         return;
-  //     }
-  // }
+      if (intersection.collided && intersection.dist < minDist) {
+        minDist = intersection.dist
+        nearest = {x: intersection.x, y: intersection.y};
+      }
+    }
+  }
 
+  return nearest; // Closest intersection point
 }
 
-function checkWallCollision(wall: Wall, pos: Point): boolean {
-  // // Apply the distance formula
-  // const p1 = wall.p1;
-  // const p2 = wall.p2;
-
-  // const numerator = Math.abs((p2.y - p1.y) * pos.x - (p2.x - p1.x) * pos.y + p2.x * p1.y - p2.y * p1.x);
-  // const denominator = Math.sqrt((p2.y - p1.y) ** 2 + (p2.x - p1.x) ** 2);
-
-  // return numerator / denominator < robotRadius;
-
-  const p1 = wall.p1;
-  const p2 = wall.p2;
-
-  const minX = Math.min(p1.x, p2.x);
-  const maxX = Math.max(p1.x, p2.x);
-  const minY = Math.min(p1.y, p2.y);
-  const maxY = Math.max(p1.y, p2.y);
-
-  return pos.x >= minX && pos.x <= maxX && pos.y >= minY && pos.y <= maxY;
+//Determine if a ray and a line segment intersect, and if so, determine the collision point
+function getIntersection(x1, y1, x2, y2, x3, y3, x4, y4){
+  var denom = ((x2 - x1)*(y4 - y3)-(y2 - y1)*(x4 - x3));
+  var r;
+  var s;
+  var x;
+  var y;
+  var b = false;
+
+  //If lines not collinear or parallel
+  if(denom != 0){
+    //Intersection in ray "local" coordinates
+    r = (((y1 - y3) * (x4 - x3)) - (x1 - x3) * (y4 - y3)) / denom;
+
+    //Intersection in segment "local" coordinates
+    s = (((y1 - y3) * (x2 - x1)) - (x1 - x3) * (y2 - y1)) / denom;
+
+    //The algorithm gives the intersection of two infinite lines, determine if it lies on the side that the ray is defined on
+    if (r >= 0)
+    {
+      //If point along the line segment
+      if (s >= 0 && s <= 1)
+      {
+        b = true;
+        //Get point coordinates (offset by r local units from start of ray)
+        x = x1 + r * (x2 - x1);
+        y = y1 + r * (y2 - y1);
+      }
+    }
+  }
+  var p = {collided: b, x: x, y: y, dist: r};
+  return p;
 }
 
 function alrCollided() {
-  return !context.moduleContexts.robot_minigame.state.success;
+  return !stateData.success;
 }

src/bundles/robot_minigame/index.ts

@@ -11,7 +11,7 @@
 export {
   init,
   set_pos,
-  set_wall,
+  set_rect_wall,
   move_forward,
   turn_left,
   turn_right,