diff --git a/web/game.js b/web/game.js index b107e11..2319e91 100644 --- a/web/game.js +++ b/web/game.js @@ -36,8 +36,11 @@ let time = 0; // the function setup() is called once when the page is loaded function setup() { // create a canvas element and append it to the body + createCanvas(width, height); frameRate(120); + myBullet = new bullet(playerPosX, playerPosY, radius, shotSpeed); + // disable the outline of shapes Movementloop() noStroke(); @@ -107,43 +110,42 @@ async function Movementloop() { }); } -function shoot(directionX, directionY) { - shot = true; - hit = false; +// function shoot(directionX, directionY) { +// shot = true; +// hit = false; - if (!projectile) { - // Set the initial position of the projectile to the player's position - projectile = createVector(shotPosX, shotPosY); - targetX = directionX; - targetY = directionY; +// if (!projectile) { +// // Set the initial position of the projectile to the player's position +// projectile = createVector(shotPosX, shotPosY); +// targetX = directionX; +// targetY = directionY; - // Calculate the initial direction - direction = createVector(targetX - projectile.x, targetY - projectile.y); - direction.normalize(); - } +// // Calculate the initial direction +// direction = createVector(targetX - projectile.x, targetY - projectile.y); +// direction.normalize(); +// } - // Draw the small circle (projectile) - fill(255, 0, 0); - circle(projectile.x, projectile.y, projSize); +// // Draw the small circle (projectile) +// fill(255, 0, 0); +// circle(projectile.x, projectile.y, projSize); - // Move the projectile towards the movable circle - projectile.add(p5.Vector.mult(direction, shotSpeed)); +// // Move the projectile towards the movable circle +// projectile.add(p5.Vector.mult(direction, shotSpeed)); - if (dist(projectile.x, projectile.y, directionX, directionY) <= radius) { - projectile = null; - hit = true; - } - else if (projectile.x < 0 - 10 || projectile.x > width + 10 || projectile.y < 0 - 10 || projectile.y > height + 10) { - bounceX = projectile.x; - bounceY = projectile.y; - projectile = null; - shot = false; - } -} +// if (dist(projectile.x, projectile.y, directionX, directionY) <= radius) { +// projectile = null; +// hit = true; +// } +// else if (projectile.x < 0 - 10 || projectile.x > width + 10 || projectile.y < 0 - 10 || projectile.y > height + 10) { +// bounceX = projectile.x; +// bounceY = projectile.y; +// projectile = null; +// shot = false; +// } +// } // the function draw() is called every frame function draw() { - shot = false; textSize(10); keyPressed(); life(); @@ -171,30 +173,33 @@ function draw() { if (nextAttack == 1) { shotPosX = 500; shotPosY = 100; - shoot(playerPosX, playerPosY); + myBullet = new bullet(playerPosX, playerPosY, radius, shotSpeed, shotPosX, shotPosY); } if (nextAttack == 2) { shotPosX = random(0, 1000); shotPosY = 600; - shoot(playerPosX, playerPosY); + myBullet = new bullet(playerPosX, playerPosY, radius, shotSpeed, shotPosX, shotPosY); } if (nextAttack == 3) { shotPosX = 0; shotPosY = random(0, 600); - shoot(playerPosX, playerPosY); + myBullet = new bullet(playerPosX, playerPosY, radius, shotSpeed, shotPosX, shotPosY); } if (nextAttack == 4) { shotPosX = 1000; shotPosY = random(0, 600); - shoot(playerPosX, playerPosY); } } if (patern == 2) { shotPosX = bounceX; shotPosY = bounceY; - shoot(playerPosX, playerPosY); + myBullet = new bullet(playerPosX, playerPosY, radius, shotSpeed, shotPosX, shotPosY); } } + if (myBullet) { + myBullet.draw(); + ({ hit, shot } = myBullet.update(playerPosX, playerPosY)); + } } } diff --git a/web/js/basicbullet.js b/web/js/basicbullet.js index 3c47d4a..3e08b72 100644 --- a/web/js/basicbullet.js +++ b/web/js/basicbullet.js @@ -1,42 +1,68 @@ class bullet { //Een constructor voert eerst de code uit die er in staat voordat de rest van de class wordt uitgevoerd. - constructor(targetx, targety, radius, speed) { - //"This" moet gebruikt worden om de variabelen aan te maken in de class en het zorgt er voor dat de variabelen niet alleen in de constructor gebruikt kunnen worden, - //maar ook in de rest van de class - this.x = targetx; - this.y = targety; - this.radius = radius; - this.speed = speed; - - // Set the initial position of the projectile to the player's position - let projectile = createVector(this.x, this.y); - this.x = directionX; - this.y = directionY; + constructor(targetx, targety, radius, speed, shotPosX, shotPosY) { + //"This" moet gebruikt worden om de variabelen aan te maken in de class en het zorgt er voor dat de variabelen niet alleen in de constructor gebruikt kunnen worden, + //maar ook in de rest van de class + this.targetx = targetx; + this.targety = targety; + this.x = shotPosX; + this.y = shotPosY; + this.radius = radius; + this.speed = speed; - // Calculate the initial direction - direction = createVector(targetX - projectile.x, targetY - projectile.y); - direction.normalize(); - -} - - - - -draw() { - //push en pop zorgen er voor dat de code tussen push en pop een eigen canvas heeft. Dus dat er meerdere projectielen tegelijk kunnen zijn. - fill(255, 0, 0); - circle(500, 500, 5); - projectile.add(p5.Vector.mult(direction, shotSpeed)); - if (dist(projectile.x, projectile.y, directionX, directionY) <= radius) { + + this.directionX = null; + this.directionY = null; + if ((this.directionX === null) || (this.directionY === null)) { + this.directionX = this.targetx; + this.directionY = this.targety; + } + + this.projectile = createVector(this.x, this.y); + // Calculate the initial direction + this.direction = createVector(this.targetx - this.projectile.x, this.targety - this.projectile.y); + this.direction.normalize(); + + } + + + + + draw() { + //push en pop zorgen er voor dat de code tussen push en pop een eigen canvas heeft. Dus dat er meerdere projectielen tegelijk kunnen zijn. + push(); + fill(0, 255, 0); + circle(this.projectile.x, this.projectile.y, this.radius); + pop(); + + // Set the initial position of the projectile to the player's position + + + + + + } + + // // Move the projectile towards the movable circle + update(targetx, targety) { + this.targetx = targetx; + this.targety = targety; + this.projectile.add(p5.Vector.mult(this.direction, this.speed)); + + let hit = false; + let shot = true; + + if (dist(this.projectile.x, this.projectile.y, this.targetx, this.targety) <= this.radius) { hit = true; - } - else if (projectile.x < 0 - 10 || projectile.x > width + 10 || projectile.y < 0 - 10 || projectile.y > height + 10) { - bounceX = projectile.x; - bounceY = projectile.y; shot = false; + } + else if (this.projectile.x < 0 - 10 || this.projectile.x > width + 10 || this.projectile.y < 0 - 10 || this.projectile.y > height + 10) { + // bounceX = this.projectile.x; + // bounceY = this.projectile.y; + shot = false; + } + return { hit, shot }; } - -} - - -} \ No newline at end of file + + + } \ No newline at end of file