Event handlers not working

Hello, for some reason I can’t seem to get any of the this.input.on event handlers to work. They seem to just do nothing for me.

 this.input.on('pointermove', function(pointer){
     //....
 })

That’s the correct event (although you should use Phaser.Input.Events.POINTER_MOVE). Is the code you posted in the scene’s create() function?

@prob yeah it just seems to do nothing. I can’t even get a console.log or anything out it. It doesn’t throw an error. it just never fires.

how would i use Phaser.Input.Events.POINTER_MOVE ?

P.S.
I’m on current version of phaser 3 (3.18.1)

Phaser.Input.Events.POINTER_MOVE is just a global variable with a value of 'pointermove'. So your function of:

this.input.on('pointermove', function(pointer){
     //....
 })

turns into:

this.input.on(Phaser.Input.Events.POINTER_MOVE, function(pointer){
     //....
 })

It’s not 100% required, as even Rich, the creator of phaser, uses the string literals all the time. However, it is good practice in case the event name ever gets changed and you update your project.

As far as your problem is concerned, can you supply us with a whole block of code with this issue isolated?

ah gotcha. so even something like:

function create() {
 //...
      this.input.on(Phaser.Input.Events.POINTER_MOVE, function(pointer){
        console.log('test')
      })
}

just does nothing. i’m frankly baffled as to why.
here is my config if that helps.

const config = {
  title: "Keith Leon",
  banner: false,
  pixelArt: true,
  backgroundColor: 0xffffff,
  type: Phaser.AUTO,
  parent: "game",
  physics: {
    default: 'arcade',
    arcade: {
        gravity: { y: 300 },
        debug: false
    }
  },
  autoCenter: true, 
  scale: {
    mode: Phaser.Scale.FIT,
    autoCenter: Phaser.Scale.CENTER_BOTH,
    parent: 'game',
    width: '100%',
    height: '100%'
  },
  scene: {
    preload: preload,
    create: create,
    update: update
  },
  audio: {
    noAudio: true
  }
};

I went over to https://labs.phaser.io/edit.html and pasted your code and it works as expected. The problem must be somewhere else in your project.

const config = {
  title: "Keith Leon",
  banner: false,
  pixelArt: true,
  backgroundColor: 0xffffff,
  type: Phaser.AUTO,
  parent: "game",
  physics: {
    default: 'arcade',
    arcade: {
        gravity: { y: 300 },
        debug: false
    }
  },
  autoCenter: true, 
  scale: {
    mode: Phaser.Scale.FIT,
    autoCenter: Phaser.Scale.CENTER_BOTH,
    parent: 'game',
    width: '100%',
    height: '100%'
  },
  scene: {
    create: create
  },
  audio: {
    noAudio: true
  }
};
var game = new Phaser.Game(config);

function create() {
      this.input.on(Phaser.Input.Events.POINTER_MOVE, function(pointer){
        console.log('test')
      })
}
1 Like

ah what a cool tool. so thanks for the help this lead me to figuring out my issue.

i have some weird things going on for my purposes and i have this set in CSS to push the canvas to the back of the page

canvas{
    z-index: -10;
    position: fixed;
}

turns out the z-index: -10 property here prevents the canvas from detecting the pointer moving. it still picks up the pointer clicking, but it can’t track its movement or even detect something like pointerdown.

Weird. thank you so much!