Still working on it, still new bugs every time I reupload and try to run it.
I have tried to split the code into several parts, basically taking virtual_chinrest and posting the main part of it in a code block to begin before the experiment
// Add the new properties to the existing “data” variable
data.dataType = “configurationData”;
data.ballPosition = ;
data.fullScreenClicked = false;
data.sliderClicked = false;
// Define a distanceSetup object
const distanceSetup = {};
distanceSetup.round = function (value, decimals) {
return Number(Math.round(value + “e” + decimals) + “e-” + decimals);
};
distanceSetup.px2mm = function (cardImageWidth) {
const cardWidth = 85.6; //card dimension: 85.60 × 53.98 mm (3.370 × 2.125 in)
const px2mm = cardImageWidth / cardWidth;
data.px2mm = distanceSetup.round(px2mm, 2);
return px2mm;
};
// Function to configure blind spot
function configureBlindSpot() {
drawBall();
$(“#blind-spot”).css({ visibility: “visible” });
$(document).on(“keydown”, recordPosition);
}
// Function to draw the ball animation
function drawBall(pos = 180) {
const mySVG = SVG(“svgDiv”);
const cardWidthPx = getCardWidth();
const rectX = distanceSetup.px2mm(cardWidthPx) * pos;
const ballX = rectX * 0.6;
let ball = mySVG.circle(30).move(ballX, 50).fill(“#f00”);
window.ball = ball;
let square = mySVG.rect(30, 30).move(Math.min(rectX - 50, 950), 50);
// Save square position data
data.squarePosition = distanceSetup.round(square.cx(), 2);
data.rectX = rectX;
data.ballX = ballX;
}
// Function to animate the ball
function animateBall() {
ball.animate(7000)
.during(function (pos) {
moveX = -pos * data.ballX;
window.moveX = moveX;
moveY = 0;
ball.attr({ transform: “translate(” + moveX + “,” + moveY + “)” });
})
.loop(true, false)
.after(function () {
animateBall();
});
$(“#start”).attr(“disabled”, true);
}
// Function to record position data
function recordPosition(event, angle = 13.5) {
if (event.keyCode == 32) {
data.ballPosition.push(distanceSetup.round(ball.cx() + moveX, 2));
const sum = data.ballPosition.reduce((a, b) => a + b, 0);
const ballPosLen = data.ballPosition.length;
data.avgBallPos = distanceSetup.round(sum / ballPosLen, 2);
const ball_sqr_distance = (data.squarePosition - data.avgBallPos) / data.px2mm;
const viewDistance = ball_sqr_distance / Math.radians(angle);
data.viewDistance_mm = distanceSetup.round(viewDistance, 2);
let counter = Number($(“#click”).text());
counter = counter - 1;
$(“#click”).text(Math.max(counter, 0));
if (counter <= 0) {
ball.stop();
$(document).off(“keydown”, recordPosition);
// Add next step to advance in the experiment here
} else {
ball.stop();
animateBall();
}
}
}
// Helper function to convert degrees to radians
Math.radians = function (degrees) {
return degrees * Math.PI / 180;
};
// Helper function to get card width
function getCardWidth() {
const cardWidth = 0; // Assign a default value (e.g., 0)
then running
python configureBlindSpot()
before the experiment and
python animateBall()
before the routine
while finally running
python recordPosition()
at the end of routine.
This has thus far only let to dispair. Can any one tell me if they have successfully implemented something similar in their experiments.
I really hope I can get some help here as I feel I am getting pretty deep into a rabbit hole