Mouse left and right buttons on pavlovia

URL of experiment: Pavlovia

Description of the problem:

The participants are asked to recall a sequence of squares by clicking the left mouse button. If they want to correct, they should press the right mouse button. Following code works on psychopy, but fails on pavlovia. On pavlovia, the correction doesn’t work. Also, I am able to select an empty square using right button (only left should be doing that).

I already disabled the context menu (document.addEventListener('contextmenu',event => event.preventDefault());)

python:

for square in squares:
    if mouse.isPressedIn(square, buttons=[0]): # left key       
        if square.name not in mouse.clickSequence:
            square.fillColor = [1,-1,-1]
            mouse.clickSequence.append(square.name)          
            print("element added: " + str(mouse.clickSequence))
            thisExp.addData('clickSequence', mouse.clickSequence)
            
    elif mouse.isPressedIn(square, buttons=[2]): # right key   
        if square.name in mouse.clickSequence: # if square clicked twice, remove it
            square.fillColor = [1,1,1]
            mouse.clickSequence.remove(square.name)  
            print("element removed: " + str(mouse.clickSequence))
            thisExp.addData('clickSequence', mouse.clickSequence)

#all clicked?
if len(mouse.clickSequence) >= trial_length:
    continueRoutine = False

js:

var _pj;
function _pj_snippets(container) {
    function in_es6(left, right) {
        if (((right instanceof Array) || ((typeof right) === "string"))) {
            return (right.indexOf(left) > (- 1));
        } else {
            if (((right instanceof Map) || (right instanceof Set) || (right instanceof WeakMap) || (right instanceof WeakSet))) {
                return right.has(left);
            } else {
                return (left in right);
            }
        }
    }
    container["in_es6"] = in_es6;
    return container;
}
_pj = {};
_pj_snippets(_pj);
for (var square, _pj_c = 0, _pj_a = squares, _pj_b = _pj_a.length; (_pj_c < _pj_b); _pj_c += 1) {
    square = _pj_a[_pj_c];
    if (mouse.isPressedIn(square, {"buttons": [0]})) {
        if ((! _pj.in_es6(square.name, mouse.clickSequence))) {
            square.fillColor = [1, (- 1), (- 1)];
            mouse.clickSequence.push(square.name);
            console.log(("element added: " + mouse.clickSequence.toString()));
            psychoJS.experiment.addData("clickSequence", mouse.clickSequence);
        }
    } else {
        if (mouse.isPressedIn(square, {"buttons": [2]})) {
            if (_pj.in_es6(square.name, mouse.clickSequence)) {
                square.fillColor = [1, 1, 1];
                mouse.clickSequence.remove(square.name);
                console.log(("element removed: " + mouse.clickSequence.toString()));
                psychoJS.experiment.addData("clickSequence", mouse.clickSequence);
            }
        }
    }
}
if ((mouse.clickSequence.length >= trial_length)) {
    continueRoutine = false;
}

I suspect that you need to separate the isPressedIn code from checking which button has been pressed. Checking which button is pressed needs to be done in a specific way, which should be in my crib sheet as well as elsewhere on this form (I’m on my phone).

Thanks, I fixed it already.

for square in squares:
    buttons = mouse.getPressed()
    if mouse.isPressedIn(square) and buttons[0] == 1: # left key       
        if square.name not in mouse.clickSequence:
            square.fillColor = [1,-1,-1]
            mouse.clickSequence.append(square.name)   
            print("element added: " + str(mouse.clickSequence))
            thisExp.addData('clickSequence', mouse.clickSequence)
            
    elif mouse.isPressedIn(square) and buttons[2] == 1: # right key   
        if square.name in mouse.clickSequence: # if square clicked twice, remove it
            square.fillColor = [1,1,1]
            mouse.clickSequence.remove(square.name)  
            print("element removed: " + str(mouse.clickSequence))
            thisExp.addData('clickSequence', mouse.clickSequence)
  
# all clicked?
if len(mouse.clickSequence) >= trial_length:
    continueRoutine = False

Also, there is no remove in JS, so I did something like this for web version:

idx = util.index(mouse.clickSequence, square.name);
mouse.clickSequence.splice(idx);