macOS control-click should be interpreted as a right-click

[BigZaphod]

Version

• Phaser Version: 3.15.1

• Operating system: macOS 10.14.2

• Browser: Safari 12.0.2

Description

On macOS, it is a common convention to use control-click in place of right-click when you have a trackpad. Phaser is instead triggering a normal left click when I control-click. However if I use the two-finger tap gesture to simulate a right-click, then Phaser considers the event a right click. Mac apps need to handle control-click correctly to be a good citizen.

This bug can be seen on this unmodified sample: http://labs.phaser.io/edit.html?src=src/input/mouse/right%20mouse%20button.js

I ran across an older issue about this: #2167 and there is a comment that a fix was applied, but either the fix is no longer there or it doesn't work anymore.

[BigZaphod]

Note that this convention applies on macOS even when an external mouse is plugged in. Holding control and clicking the left button of a physical mouse also triggers the context menu throughout macOS.

[BigZaphod]

Horrifying workaround:

Phaser.Input.Pointer.prototype.__rightButtonDown = Phaser.Input.Pointer.prototype.rightButtonDown;
Phaser.Input.Pointer.prototype.rightButtonDown = function() {
  return this.__rightButtonDown() || (this.event.ctrlKey && this.leftButtonDown());
}

[photonstorm]

That issue is from the Phaser 2 days! We'll need to use a similar approach this time. We can't just right-click with the ctrl key, because that blocks Windows modification key + clicks, so it'll need a macOS check combined with it (and the option to disable if it needed).

[BigZaphod]

Something I ran into using the hack workaround I posted above is that when control-clicking, leftButtonDown() still returns true because, of course, it's technically true. I wonder if it should explicitly return false in the control-click case on mac? Something to think about, anyway, because it might be reasonable to have written code like:

if (pointer.leftButtonDown()) { 
  /* do stuff */
} else {
  /* do other click stuff that triggers when another mouse button is clicked */
}

[BigZaphod]

This is still an issue in Phaser 1.16.1. My hack workaround still works, though:

Phaser.Input.Pointer.prototype.__rightButtonDown = Phaser.Input.Pointer.prototype.rightButtonDown
Phaser.Input.Pointer.prototype.__leftButtonDown = Phaser.Input.Pointer.prototype.leftButtonDown
Phaser.Input.Pointer.prototype.rightButtonDown = function () {
  return this.__rightButtonDown() || (this.event.ctrlKey && this.__leftButtonDown())
}
Phaser.Input.Pointer.prototype.leftButtonDown = function () {
  return !this.event.ctrlKey && this.__leftButtonDown()
}

[photonstorm]

Thank you for submitting this feature request. We have implemented this and the feature has been pushed to the master branch. It will be part of the next release. If you get time to build and test it for yourself we would appreciate that.