Drag and drop position saving (online)

Online experiments
1

OS: Sequoia 15.4.1
PsychoPy version: 2024.2.4

I have created a ranking for my online experiment coded with the Builder and run on JATOS. This is my first time using PsychoPy, so I’m quite new to everything.
In the ranking routine, participants drag and drop images (and some image and sound combinations that play sound upon hovering) according to their perceived ranking on an x,y plane.
I want to record the final position of each image, but I’ve been struggling with this: no matter what I tried with End routine, the positions are not saved in the csv downloaded from JATOS.

This is what I have for the routine’s code component:

Begin experiment:

```draggables = [image_2, image_3, image_4, image_5, image_6, image_7, image_8, image_9, image_10, image_11, image_12, image_13, image_14, image_15, image_16];
sounds = [sound_5, sound_6, sound_7, sound_8, sound_9];
dragging = null;
offsetX = 0;
offsetY = 0;

dragSoundPairs = [
{ img: image_12, sound: sound_5 },
{ img: image_13, sound: sound_6 },
{ img: image_14, sound: sound_7 },
{ img: image_15, sound: sound_8 },
{ img: image_16, sound: sound_9 }
];

hoverStates = Array(dragSoundPairs.length).fill(false);```

Begin routine:

for (let i = 0; i < dragSoundPairs.length; i++) {dragSoundPairs[i].sound.stop();}

Each frame:

let mouseX = mouse.getPos()[0];let mouseY = mouse.getPos()[1];

if (mouse.getPressed()[0]) {
if (dragging === null) {
for (let i = 0; i < draggables.length; i++) {
let img = draggables[i];
let imgX = img.pos[0];
let imgY = img.pos[1];
let imgW = img.size[0];
let imgH = img.size[1];

        if (mouseX > imgX - imgW/2 && mouseX < imgX + imgW/2 &&
            mouseY > imgY - imgH/2 && mouseY < imgY + imgH/2) {
            dragging = img;
            offsetX = imgX - mouseX;
            offsetY = imgY - mouseY;
            break;
        }
    }
} else {
    dragging.pos = [mouseX + offsetX, mouseY + offsetY];
}

} else {
dragging = null;
}

for (let i = 0; i < dragSoundPairs.length; i++) {
let img = dragSoundPairs[i].img;
let sound = dragSoundPairs[i].sound;

let imgX = img.pos[0];
let imgY = img.pos[1];
let imgW = img.size[0];
let imgH = img.size[1];

let isHovering = (
    mouseX > imgX - imgW/2 && mouseX < imgX + imgW/2 &&
    mouseY > imgY - imgH/2 && mouseY < imgY + imgH/2
);

if (isHovering && !hoverStates[i]) {
    sound.play(); 
    hoverStates[i] = true;
} else if (!isHovering && hoverStates[i]) {
    sound.stop(); 
    hoverStates[i] = false;
}

}```

End routine (not saving position):

```window.trialNumber += 1;
const row = { trialNumber: window.trialNumber };

for (const img of draggables) {
const x = img.pos[0];
const y = img.pos[1];

psychoJS.experiment.addData(finalPos_${img.name}_x, x);
psychoJS.experiment.addData(finalPos_${img.name}_y, y);

row[finalPos_${img.name}_x] = x;
row[finalPos_${img.name}_y] = y;
}
window.myRows.push(row);```

I would be super grateful for any hints!
Thank you so much in advance.