diff --git a/web/game.js b/web/game.js index d905635..0e67fa3 100644 --- a/web/game.js +++ b/web/game.js @@ -58,7 +58,7 @@ async function readLoop() { } } } - + } // Sluit de poort async function disconnect() { @@ -72,21 +72,20 @@ const width = 1000; const height = 600; // Player variables -let Playerposx = 500; -let Playerposy = 300; const playerSize = 10; -let radius = playerSize/2; -let playerX = 500 -let playerY = 300; +let radius = playerSize / 2; +let playerPosX = 500 +let playerPosY = 300; let playerSpeed = 3; let squareX = 100; let squareY = 100; const squareSize = 100; -let startPosX; -let startPosY; -let shotSpeed = 5; + +let shotSpeed = 2; +let projectile; +let shot = false; // the function setup() is called once when the page is loaded function setup() { @@ -99,36 +98,40 @@ function setup() { } function keyPressed() { - if (keyIsDown(LEFT_ARROW) && playerX > 0+radius) { - playerX -= playerSpeed; + if (keyIsDown(LEFT_ARROW) && playerPosX > 0 + radius) { + playerPosX -= playerSpeed; } - if (keyIsDown(RIGHT_ARROW) && playerX < width-radius) { - playerX += playerSpeed; + if (keyIsDown(RIGHT_ARROW) && playerPosX < width - radius) { + playerPosX += playerSpeed; } - if (keyIsDown(UP_ARROW) && playerY > 0+radius) { - playerY -= playerSpeed; - } - if (keyIsDown(DOWN_ARROW) && playerY < height-radius) { - playerY += playerSpeed; + if (keyIsDown(UP_ARROW) && playerPosY > 0 + radius) { + playerPosY -= playerSpeed; + } + if (keyIsDown(DOWN_ARROW) && playerPosY < height - radius) { + playerPosY += playerSpeed; } } async function Movementloop() { if (booleanArray[1]) { - playerX += playerSpeed;} + playerPosX += playerSpeed; + } if (booleanArray[3]) { - playerX -= playerSpeed;} + playerPosX -= playerSpeed; + } if (booleanArray[2]) { - playerY += playerSpeed;} + playerPosY += playerSpeed; + } if (booleanArray[0]) { - playerY -= playerSpeed;} -} + playerPosY -= playerSpeed; + } +} function object_collision() { var squareCenterX = squareX + squareSize / 2; var squareCenterY = squareY + squareSize / 2; - var distance = dist(playerX, playerY, squareCenterX, squareCenterY); + var distance = dist(playerPosX, playerPosY, squareCenterX, squareCenterY); if (distance < squareSize / 2 + radius) { squareX = random(0, width - squareSize); @@ -136,30 +139,35 @@ function object_collision() { } } -async function shoot(startPosX, startPosY) { - circle(startPosX, startPosY, 30); - let shootingCirclePos = createVector(startPosX, startPosY); - let targetCirclePos = createVector(playerX, playerY); +function shoot(directionX, directionY) { + shot = true; + circle(500, 100, 50); - let direction = p5.Vector.sub(targetCirclePos, shootingCirclePos); + if (!projectile) { + // Set the initial position of the projectile to the player's position + projectile = createVector(500, 100); + } + + // Draw the small circle (projectile) + fill(255, 0, 0); + circle(projectile.x, projectile.y, 5); + + // Move the projectile towards the movable circle + let target = createVector(directionX, directionY); + let direction = target.copy().sub(projectile); direction.normalize(); direction.mult(shotSpeed); - - shootingCirclePos.add(direction); - - circle(shootingCirclePos.x, shootingCirclePos.y, 5); + projectile.add(direction); } // the function draw() is called every frame function draw() { keyPressed(); - // clear the background with a transparent black color background(0, 0, 0, 100); - shoot(500,100); - // draw a circle at the mouse position - - circle(constrain(playerX,0+radius,width-radius), constrain(playerY,0+radius,height-radius), playerSize); - square(squareX,squareY,squareSize); + circle(constrain(playerPosX, 0 + radius, width - radius), constrain(playerPosY, 0 + radius, height - radius), playerSize); + // square(squareX,squareY,squareSize); object_collision(); + + shoot(playerPosX, playerPosY); } \ No newline at end of file