keyboard events fireing multiple times

[forleafe]

My code has a setup function that runs at the start. Within that setup function I have the left and right arrow keys setting up movement like so:

 

left = keyboard(37);
left.press = function(){
  moveCharacterLeft();
};

 

It works fine. But then when I get a gameover my game runs a reset code and all variables are reset back to their former states and the setup function runs again.

Well this means that the above function runs again as well, and this makes it so that each time I get a gameover and reset the game, the above function will run multiple times for each button press. So after one game over, if I hit the left key, the moveCharacterLeft() function will fire twice, and my character moves twice as far.. Three times for the next gameover.. ect..

Does anyone know how I can prevent this from happening? Admittedly I don't quite understand what's happening here..

[FlashyGoblin]

You'll want to reset the keyboard when your current state shuts down.

shutdown: function(){
     if (this.game.device.desktop){
       var keyboard = this.game.input.keyboard;
       keyboard.reset();
       keyboard.stop();
     }
}

 

[forleafe]

this.game.device.desktop

Are these functions native to pixi? Because I coded my keyboard inputs pretty much using this guide:

https://github.com/kittykatattack/learningPixi#keyboard

[FlashyGoblin]

1 minute ago, forleafe said:

this.game.device.desktop

Are these functions native to pixi? Because I coded my keyboard inputs pretty much using this guide:

https://github.com/kittykatattack/learningPixi#keyboard

Doh!! I didn't check the thread category. It is Phaser.  So sorry. 

[forleafe]

;; RIP

[forleafe]

Sorry for the double post but this problem is really bugging me...

I've made some headway in pinpointing the issue to a piece of code that's adding listeners to the "window".

 

function keyboard(keyCode) {
  var key = {};
  key.code = keyCode;
  key.isDown = false;
  key.isUp = true;
  key.press = undefined;
  key.release = undefined;
  //The `downHandler`
  key.downHandler = function(event) {
    if (event.keyCode === key.code) {
      if (key.isUp && key.press) key.press();
      key.isDown = true;
      key.isUp = false;
    }
    event.preventDefault();
  };

  //The `upHandler`
  key.upHandler = function(event) {
    if (event.keyCode === key.code) {
      if (key.isDown && key.release) key.release();
      key.isDown = false;
      key.isUp = true;
    }
    event.preventDefault();
  };

  //Attach event listeners
  window.addEventListener(
    "keydown", key.downHandler.bind(key), false
  );
  window.addEventListener(
    "keyup", key.upHandler.bind(key), false
  );
  return key;
}

If you look down at the bottom, the event listeners are being added to the window. Perhaps they're being duplicated there every time my setup function re-runs after a game over? But I can't figure out how to dump event listeners from the friggin window!!!

[FlashyGoblin]

How about adding a boolean that you can keep track of so it only adds it once?

// this will only run once
if(!window.keysAdded){
   // add your keyboard listeners here.

   window.keysAdded = true;
}

 

[Taz]

2 hours ago, forleafe said:

  //Attach event listeners
  window.addEventListener(
    "keydown", key.downHandler.bind(key), false
  );
  window.addEventListener(
    "keyup", key.upHandler.bind(key), false
  );
  return key;
}

If you look down at the bottom, the event listeners are being added to the window. Perhaps they're being duplicated there every time my setup function re-runs after a game over? But I can't figure out how to dump event listeners from the friggin window!!!

You can call window.removeEventListener() with the same parameters to remove the listener. But since bind creates a new function, I think you'd need to save a reference to the new function, so that you can pass the same function to window.addEventListener() and window.removeEventListener().