Search code examples
javascriptprocessingp5.jsmouseclick-event

How to enable right click in p5.js?


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.


Solution

  • 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
            // ...
        } 
    }