How to get mouse pointer position when it's out of canvas bounds

[Kacper Pietrzak]

Hey Guys!

I am making a game when I need the player to look at mouse pointer. I implemented this. But Phaser seems to be giving coordinates only inside canvas bounds.
 which gives effect like this: demo

I get mouse coordinates like this:

lookAtMouse() {
    const mouseX = this.game.input.mousePointer.worldX,
      mouseY = this.game.input.mousePointer.worldY;

    this.lookAt( mouseX, mouseY );
}

lookAt( targetX, targetY ) {
    const targetPoint = new Phaser.Point( targetX, targetY ),
      entityCenter = new Phaser.Point( this.body.x, this.body.y );
    let targetAngle = ( 360 / ( 2 * Math.PI ) ) * this.game.math.angleBetweenPoints( targetPoint, entityCenter ) - 90;

    if ( targetAngle < 0 ) {
      targetAngle += 360;
    }
    this.angle = targetAngle;
}

Is there any way that I can get mouse coordinates outside of the canvas ?

[Ralph]

If its outside the canvas yet still on the webpage I would use plain javascript to find its position, not phaser. I don't have time to show you right now, but a quick google should get you there. If the mouse is out of the browser i dont know if you could find its position.

 

Edit: You could also expand your canvas to be the whole page but make it appear to be what you have right now. 

[Kacper Pietrzak]

Yeah I made canvas 100% page size, adding full screen mode to it solved my problem, thank you