Transfering JavaScript experiment to online PsychoPy

I’m interested in adding abbreviated 9-item Raven’s standard progressive matrice to m0y experiment. Unfortunately, I couldn’t find any versions of it in Pavlovia, (not compatible) so this is what I’ve found: jspsych-demos/tasks/rpm at main · nivlab/jspsych-demos · GitHub So, can I use this JavaScript experiment in my online PsychoPy experiment? How can I directly transfer this experiment to PsychoPy

jsPsych is a different JavaScript library than what PsychoPy uses (which is PsychoJS), so there’s no way to incorporate it directly into a PsychoPy study. You can host a jsPsych study on pavlovia, but you can’t mix it into a PsychoPy experiment.

However, someone has already made at least one version of Raven’s matrices in PsychoPy, and you can clone it from here: Jordan Fuller / Ravens Progressive Matrices · GitLab

See clone and fork instructions here: Pavlovia

2 Likes

Thank you so much but when I tried to run this one I got this:(Symbol Not Found in PyQt6 on macOS Mojave when Running PsychoPy) so,I’ve been trying to recreate it now but although I made the image options on the right side are draggable, for some reason I cannot drag them to the big picture here; below I’m attaching the code and mask component. Am I missing something





There is no “image1”, there is only a component named “image”. If you put “image.pos” instead, it should work.

You’ll probably run into the same error with “image2” because the name of the component is “image_2”, and the underscore does matter.

Basically the names of the components need to match the names of the images in the code.

yes,but image is not draggable

It’s not listed under “clickable stimuli” in mouse_7. That’s the only thing I can think of.

I changed it a bit because mouse is pressed in wouldnt work online this is how it looks now and i also unclicked the draggable button participants can just click. But now I get–: * TypeError: obj.contains is not a function

currentcode:
// Get the mouse position once per frame
let mouseX = mouse.getPos()[0];
let mouseY = mouse.getPos()[1];

// List of all draggable images
let draggableImages = [image_2, image_3, image_4, image_5, image_6, image_7];

// Target image (where the other images will be dropped into)
let targetImage = image;

// Variable to store the dragged image’s name when it’s dropped
let draggedImage = null;

// Loop through all draggable images to check for drag-and-drop
for (let i = 0; i < draggableImages.length; i++) {
let img = draggableImages[i]; // Get the current draggable image

// Check if any mouse button is pressed and the mouse is over the image
if (mouse.getPressed()[0] === 1 || mouse.getPressed()[1] === 1 || mouse.getPressed()[2] === 1) {
    if (mouseX > img.pos[0] - (img.size[0] / 2) &&
        mouseX < img.pos[0] + (img.size[0] / 2) &&
        mouseY > img.pos[1] - (img.size[1] / 2) &&
        mouseY < img.pos[1] + (img.size[1] / 2)) {
            // Drag: Move the image to follow the mouse
            img.pos = [mouseX, mouseY];
    }
}

// Check if all mouse buttons are released (drop action) inside the target image
if (mouse.getPressed()[0] === 0 && mouse.getPressed()[1] === 0 && mouse.getPressed()[2] === 0) {
    if (mouseX > targetImage.pos[0] - (targetImage.size[0] / 2) &&
        mouseX < targetImage.pos[0] + (targetImage.size[0] / 2) &&
        mouseY > targetImage.pos[1] - (targetImage.size[1] / 2) &&
        mouseY < targetImage.pos[1] + (targetImage.size[1] / 2)) {
            // Drop: Snap the image into the target image's position
            img.pos = [targetImage.pos[0], targetImage.pos[1]];
            
            // Record the image that was dragged into the target
            draggedImage = img.name;
    }
}

}

// At the end of the trial, check if the correct image was dragged into the target
if (draggedImage !== null) {
if (draggedImage === ‘image_3’) { // Replace ‘image_3’ with the correct image name
console.log("Correct decision: " + draggedImage);
} else {
console.log("Wrong decision: " + draggedImage);
}
}

What do you think I am missing? Thank you!

Based on this earlier thread I think it’s an issue with the “clickable stimuli” list: TypeError: obj.contains is not a function when using variable clickable stimuli - #11 by darsyq

However, you actually don’t need that list at all with your current code because you’re checking each image manually anyway, so the fastest solution may be to simply clear the “clickable objects” field for mouse_7 and try running it again.

That kinda works but Interestingly when I click one of the options all of them disappears now:




Make sure that all of the properties of the images are set to update every frame, but I’m not sure why it would fail that way in particular, there’s nothing in your code that should make it do that.

yes, they’re, in each frame; I’m also seeing this: **Alert 4205: Python Syntax Error in ‘Each Frame’ tab. See 'let mouseX = mouse.getPos()[0];
’ on line number 1 of the ‘Each Frame’ tab.
For more info see https://docs.psychopy.org/alerts/4205.htmlAlert 4205: Python Syntax Error in ‘Each Frame’ tab. See 'let mouseX = mouse.getPos()[0];
’ on line number 1 of the ‘Each Frame’ tab.
For more info see https://docs.psychopy.org/alerts/4205.html#### Running: /Users/ilkekavusturan/Downloads/99-master 2/son33_lastrun.py #####
File “/Users/ilkekavusturan/Downloads/99-master 2/son33_lastrun.py”, line 2176
let mouseX = mouse.getPos()[0];
^
SyntaxError: invalid syntax
################ Experiment ended with exit code 1 [pid:16612] #################
should I change the first line of the code

That’s an issue with the code component - you have javascript in the Python box. If you’re only running it online, just get rid of the code in the Python box (just make sure it’s not on Auto->JS)