Restrict or detect which mouse button triggers events?

[AgileInteractive]

When I add a Tap event, using mouse as input will trigger the event on all buttons (left-, middle-, right-click, even forward/back-clicks).

How do I limit the Tap listener to only be used on left-click?

[jo-m1b]

Same for me ! right-click is reconized by "press" event if i have tap and press on same element.

Maybe it could be great to have with the event :

• event.pointerType = "mouse", "pen" or "touch" like https://developer.mozilla.org/en-US/docs/Web/API/PointerEvent/pointerType
• event.button = 0,1,2,3,4 like https://developer.mozilla.org/en-US/docs/Web/API/MouseEvent/button

Then we could deal with it like that :

domElement.addEventListener("contextmenu", event => event.preventDefault());

domElement.addEventListener("tap", function(event){
    if ( event.pointerType == "mouse" && event.button == 2 ) {
        //  do something
    }
});

[AgileInteractive]

Pixi.js has the same thing, where it solved it just like you suggest.

[biodiv]

You can access the original pointerEvent event using event.live.srcEvent.

I also added the recognizer option supportedButtons in v2.1.4:

const options = {
    "supportedButtons" : [2]
};

const tap = new Tap(rectangle, options);

This option can also be used for Pan and Press.

Be aware, that Tap uses pointerEvent.button instead of pointerEvent.buttons. The numbers differ between the two.

[jo-m1b]

hey ty ty a lot for this quick update !