I have a game that automatically plays in full screen with
this.scale.startFullscreen();
and i want to give a user an option to quit full screen by pressing 'x' in top right corner. So i wrote:
this.add.text(750, 20, 'X', { fontSize: '20px'});
this.exitFullScreen = this.add.rectangle(770, 30, 60, 60, 0xfff);
this.exitFullScreen.setInteractive();
this.exitFullScreen.on('pointerup', this.scale.stopfullScreen);
but that doesn't work, i also tried putting this.scale.stopfullScreen inside a callback function and i also added conditional if (isFullscreen()), but that didn't work either. Is there any way i can give user an option to quit full screen, ideally without removing this.scale.startFullscreen(); at the beginning of create()?
The problem is this line this.exitFullScreen.on('pointerup', this.scale.stopfullScreen); the eventlistener .on('pointerup', ...) calls the passed callback function with a different context.
Just change the eventlistener to .on('pointerup', () => this.scale.stopFullscreen()); and it should work.
Or you could pass the correct context (for the function) as third parameter to the eventlistener, like this: .on('pointerup', this.scale.stopFullscreen, this.scale);