psychopy.org | Reference | Downloads | Github

Pavlovia/JS Mouse Pressed and Mouse Contains

I am currently working on a version of the BART task stored here: Jason Geller / bart_new_online · GitLab.

I would like to include clicks on two shapes (a plus sign to inflate the balloon) and a stop sign (to stop inflating the balloon).

I currently have been using this code that has been floating around:

if (plus1.contains(mouse) && mouse.getPressed()[0] === 1){
    nPumps = (nPumps + 1);
    if (nPumps > maxPumps) {
        popped = true;
        continueRoutine = false;
    }
}
if (stop1.contains(mouse) && mouse.getPressed()[0] === 1){
    popped = false;
    continueRoutine = false;
}

It allows me to hover over the shapes (plus1 and stop1) to inflate and quit but when I try to click my mouse I get this error:

Any suggestions?

My guess would be that plus1 and stop1 aren’t recognized as PsychoJS objects and so don’t provide the contains function. Maybe they’ve got subtly different names?

To get a better grasp on this, it could be handy to print these two objects to the console and/or expose them to the window; then you can inspect them while the task is running. See the tutorials over here: Thomas Pronk / assignment_stroop · GitLab

Hi @thomas_pronk,

Thanks for replying! I thought that might be the case as well. I tried calling the shapes as an object.

var clickable_stimuli = [plus1, stop1]; 

console.log(clickable_stimuli[0])

It prints out that it is a shape object.

Also, I can interact with the objects themselves by hovering over them. It is the clicking action that is not working.

I cloned your repo to take a peek, but first a question: should I look at BART_v3_6.22.21_jf or BART_v3_6.22.21_jg?

Sorry. BART_v3_6.22.21_jg is the one I am working from.

@thomas_pronk, any luck?

Seems like there are a few unanswered questions on the forum that would benefit from a solution.

If you’ve found other people asking the same question, please could you post a list of links to the relevant threads?

Thnx for the heads-up! Bit busy today but less so tomorrow, so then I’ll take a dive

2 Likes

Thanks for the links to other users reporting click-issues!

Took a little dive, where I explored the issue from two angles.

  • I applied your “detect click” logic to one of my demos, and that worked fine. See Thomas Pronk / demo_buttons · GitLab
  • I looked around in your generated JS, and there I saw an issue. More below…

In the generated code I saw this…

          for (const obj of [[plus1, stop1]]) {
            if (obj.contains(mouse_real)) {
              gotValidClick = true;
              mouse_real.clicked_name.push(obj.name)
            }
          }

Note the double set of brackets. That means this code defines an array with one element, whose value is an array [plus1, stop1]. Next, we treat this element as VisualStim (and check whether this element contains the mouse by calling .contains on it.

Tracing this to the builder, the issue is likely the “Clickable stimuli” field in the “mouse_real” Mouse component. Instead of having [plus1, stop1] there, try plus1, stop1

Thanks for trying to figure this out @thomas_pronk

Upon further investigation, the mouse was saving on every click, and not every frame.