Trigger once on overlap

[Glaydur]

So I was following the flappy box tutorial over at lessmilk and I wanted to make a detector box for incrementing score instead of looking at how many pipes have spawned. So I put the detectors where the holes are suppose to be and I check for an overlap between the bird and also the detector box so if it touches, +1 to the score. The problem is, since game.physics.overlap(...) triggers every frame, the score increments more than once. So is there any way for me to just trigger the overlap once and therefore increment the score only once?

 

relevant code in my game.js:

update: function() {    // Executed 60 times per second || Contains game logic    // Call restartGame if bird is out of screen(too high or too low)    if(this.bird.inWorld === false) {        this.restartGame();    }    game.physics.arcade.overlap(this.bird, this.pipes, this.restartGame, null, this);    game.physics.arcade.overlap(this.bird, this.detectors, this.updateScore, null, this);},

updateScore: function() {    this.score += 1;     this.labelScore.text = this.score;}

Or maybe there's a function that sets an it to a trigger similar to that in Unity3D? 

[Wavertron]

Destroy or reset the detector box position elsewhere when you do the +1. Then it won't be overlapping anymore

[megan]

I'm having a similar problem as Glaydur, but I also have an animation that plays after the first overlap, and before the sprite gets killed. The overlap gets triggered while the animation is playing, which is affecting the scoring of my game. 

 

Is there a way to keep the animation, and turn off physics or something after the first overlap?

 

This is the code I'm using to play the animation and kill the sprite:

goodItem.animations.play('explode', 10, false, true);goodItem.animations.killOnComplete = true;

[lewster32]

The most simple way to do this is to just to call .kill() on the score triggering object in the callback. In a Flappy Bird scenario, the object scrolls past and is usually killed on the left edge of the screen anyway, then typically an object pool is in place to revive it and put it back on the right, where it can live again to score another day

updateScore: function(bird, detector) { 
  // First ensure the detector we're hitting isn't dead already
  if (!detector.alive) {
    return;
  }
  // Okay, it is alive, so kill it and increment the score!
  detector.kill();
  this.score += 1;
  this.labelScore.text = this.score;
}

 

[piotr]

Is there a way to detect overlap once and not kill the detector? 

 

[lewster32]

Checking for and setting an arbitrary property on one or both of the colliding sprites ought to do it. Something like this: https://phaser.io/sandbox/edit/CyBbKymD (check the update tab for the overlapHandler method which does the magic). Note that hasOverlapped isn't a Phaser property, just a flag I'm manually creating on the overlapping sprites.

[piotr]

So neat! Thanks. I was already thinking about using timers to delay the callback... this looks better.