How to enable right click in p5.js?

Question

I'm making a minesweeper clone, left click reveals the cell and right click is supposed to flag the cell.

I'm using the function mouseClicked() - this allows me to reveal on left click and also reveal on right click.

I tried using

if(mouseIsPressed) {
    if(mouseButton === LEFT) {
        reveal
    }
    if(mouseButton === RIGHT) {
        flag
    }
}

This registers once every frame that the button is held down. I just want a single right click. I imagine there is something simple that I'm missing, but I really can't find anything in the documentation or anyone asking about it online.

TL;DR - I just want to be able to right click in p5.js.

Answer 1

The mouseClicked() event only occurs once when the mouse button is pressed.

Set a state flag when the event occurs:

var rightPressed = false;

function mouseClicked() {
    if(mouseButton === RIGHT) {
        rightPressed = true;
    }
}

Reset the flag when the action which is triggered by the event was handled:

function draw() {

    if (rightPressed) {
        rightPressed = false

        // do somthing
        // ...
    } 
}

Answer 2

Use the mouseClicked() function and pass the event.

Then using event.button you can determine if it is a right click like so:

function mouseClicked(event){
  if(event.button === 2){ 
    // Right click 
  }
}