P5.Play - Collision problems

Question

hoping someone can help me with this. I'm trying to create a game where balloons get popped by bullet. Sort of similar to balloons tower defence. My only problem is that the frames are drawn every 60 seconds and each loop happens once per 60 seconds meaning that the bullet getting removed happens before the balloons change. So far I've got:

Bullet is fired.
Bullets checks whether it has hit a balloon.
If hit remove bullet and change blue balloon to red balloon.

This would be easier if there was some way of checking which bullet collides with which balloon but as far as I can tell through the P5.Play reference theres no way to do this. Sorry if this is stupid question I feel like I've been stuck on this issue for ages :( Thanks for the help! Code:

Bullets:

  function bulletTime() {
    bullet = createSprite(player.position.x, player.position.y, 3, 10);
    bullet.setSpeed(4, 270);
    bullet.setCollider("rectangle", 0, -2, 3, 10);
    bullet.debug = true;
    bullet.addToGroup(bullets);
  }
  // deletes bullets when they leave the screen prevents memory overload
  function bulletDelete(){
    for (i = 0; i < bullets.length; i++) {
      if (bullets[i].overlap(balloons)){
        bullet2 = createSprite(bullets[i].position.x, bullets[i].position.y+3, 3, 10);
        bullet2.addToGroup(bullets2);
        bullets[i].remove();
        setTimeout(bullet2.remove(),10);
      }
    }
  }

Balloons:

// pops Balloons 
function popBalloon(){
  for (i = 0; i < balloons.length; i++) {
    if (balloons[i].overlap(bullets2)) {
      if (balloonsRed.contains(balloons[i])){
        balloons[i].addImage("redPop",redPop);
        balloons[i].changeAnimation("redPop");
        balloons[i].remove();
        score += 100;
      }

      if (balloonsBlue.contains(balloons[i]) ){
        balloons[i].addImage("redBalloon",redBalloon);
        balloons[i].changeAnimation("redBalloon");
        balloons[i].addToGroup(recentlyHit);
      }
    }
  }
}

score 1 · Answer 1 · answered Oct 07 '22 at 04:00

In case anyone else has a similar issue. HardcoreGameDev had it right! Here's the working code.

// pops Balloons 
function popBalloon(){
  for (j = 0; j < balloons.length; j++) {
    for (i = 0; i < bullets.length; i++) {
      if (bullets[i].overlap(balloons[j])){
        if (balloonsRed.contains(balloons[j])){
          bullets[i].remove();
          balloons[j].remove();
          return;
        }
        if (balloonsBlue.contains(balloons[j])){
          print("blue")
          bullets[i].remove();
          balloon = createSprite(balloons[j].position.x, balloons[j].position.y, 30, 30); 
          balloon.addSpeed(0.5,90);
          balloon.addToGroup(balloons);
          balloon.debug = true;
          balloon.addImage("red",redBalloon);
          balloon.changeAnimation("red");
          balloon.scale = 0.2;
          balloon.setCollider("circle",0,0,120);
          balloon.addToGroup(balloonsRed);
          balloons[j].remove();
          return;
        }
        }
      }
    }
  }

I know the code is arbitrary at some points :)

score 0 · Accepted Answer · answered Oct 07 '22 at 03:44

Your issue seems to related to your step 3.

If hit remove bullet and change blue balloon to red balloon.

The bullet attempted to remove itself / delete when a collision happens.

This actually implemented as "when the bullet hit a balloon the bullet disappears", so the balloon may never detect any collisions.

Since the balloon states are triggered by bullet, the popBalloon function should be called inside bulletDelete to update the specific balloon that got hit.

P5.Play - Collision problems

2 Answers2