hey,
i have a school project where I need to let creatures interact with each other this is done by collision I already have made a big part but now I wanted to make that u can eat the red circles by moving on them with the white one het movement is already done but I am struggling with the part of collision
if u could help me it would be much appreciated
we can also call on discord if u wish to explain it
let MAX_NUM = 50;
let circles = [];
class Circle {
constructor(x, y,) {
this.x = x;
this.y = y;
this.speedX = random(-15, 15);
this.speedY = random(-14, 14);
this.width = random(25, 50);
this.height = random(25, 50);
this.color = color(random(255), random(20), random(20), 100);
}
checkBoundary() {
if (this.x < 0) {
this.x = 0;
this.speedX *= -1;
}
if (this.x > width) {
this.x = width;
this.speedX *= -1;
}
if (this.y < 0) {
this.y = 0;
this.speedY *= -1;
}
if (this.y > height) {
this.y = height;
this.speedY *= -1;
}
}
update() {
this.x += this.speedX;
this.y += this.speedY;
}
display() {
push();
fill(this.color);
ellipse(this.x, this.y, this.width, this.height);
pop();
}
boem() {
if (this.x > width / 2) {
this.speedX = (this.x - width / 2) / (height / 2 - this.y);
} else {
this.speedX = -(this.x - width / 2) / (height / 2 - this.y);
}
if (this.y > width / 2) {
this.speedY = -(height / 2 - this.y) / (height / 2 - this.y);
} else {
this.speedY = (height / 2 - this.y) / (height / 2 - this.y);
}
}
}
class WhiteCell {
constructor(x, y) {
this.x = x;
this.y = y;
this.h = 50;
this.w = 50;
}
verschijn() {
fill('white')
ellipse(this.x, this.y, this.w, this.h);
}
moveLinks() {
this.x -= 5;
}
moveRechts() {
this.x += 5;
}
moveUp() {
this.y -= 5;
}
moveDown() {
this.y += 5;
}
}
let teller = 0;
let links = false;
let rechts = false;
let down = false;
let up = false;
function setup() {
createCanvas(800, 800);
background(0);
noStroke();
witte = new WhiteCell(400, 600);
}
function draw() {
background(0, 50);
for (let i = 0; i < circles.length; i++) {
circles[i].checkBoundary();
circles[i].update();
circles[i].display();
if (teller === 20) {
circles.splice(1)
background('darkred')
teller = 0;
}
}
fill('gray')
rect(10, 10, 780, 20)
fill('red');
rect(10, 10, 39 * teller, 20);
fill('white')
textSize(10)
text("POWERBAR", 15, 25)
fill('white')
textSize(20);
text('PRESS R TO USE POWER', 10, 60)
text('FILL THE BAR BY CLICKING ON THE SCREEN TO CENTER THE CELLS AND LET THEM IMPLODE', 10, 100, 780);
text('USE ARROWS TO MOVE THE BLOODCELL', 10, 200)
witte.verschijn();
if (keyIsDown(RIGHT_ARROW)) {
witte.moveRechts();
}
if (keyIsDown(DOWN_ARROW)) {
witte.moveDown();
}
if (keyIsDown(UP_ARROW)) {
witte.moveUp()
}
if (keyIsDown(LEFT_ARROW)) {
witte.moveLinks();
}
}
function mousePressed() {
if (circles.length < MAX_NUM) {
for (let i = 0; i < 5; i++) {
circles.push(new Circle(mouseX, mouseY));
}
} else {
circles.forEach(item => item.boem());
teller += 1;
}
}
function keyPressed() {
if (key == "r") {
for (let i = 0; i < circles.length; i++) {
circles[i].speedX = random(-2, 2) * teller;
circles[i].speedY = random(-2, 2) * teller;
}
teller = 0;
}
}
function keyIsDown() {
if (keyCode === LEFT_ARROW) {
witte.moveLinks();
}
if (keyCode === UP_ARROW) {
witte.moveUp();
}
if (keyCode === DOWN_ARROW) {
witte.moveDown();
}
if (keyCode === RIGHT_ARROW) {
witte.moveRechts();
}
}