As a beginner in JsPsych, I'm diving into creating a basic math quiz task to sharpen my skills. The goal is to generate random math questions as prompts and stop the task after 10 correct answers. I've managed to code that selects random math problems and loops successfully. However, I'm facing a challenge pinpointing the error location, which could be
- where correct answers are defined
- where correct answers are counted
- where question looping occurs
Below is my code. Do let me know if any clarification is needed. Thank you in advance! Edit: I'm including another attempt with different code but same issue
<!DOCTYPE html>
<html>
<head> <!-- all preloads go into head -->
<title>Math Quiz</title>
<!-- any plugins go here-->
<script src="jspsych/dist/jspsych.js"></script>
<script src = "jspsych/dist/plugin-survey-text.js"></script>
<link href="jspsych/dist/jspsych.css" rel="stylesheet" type="text/css" />
</head>
<body> <!-- all script for tasks go into body-->
<script>
var jsPsych = initJsPsych();
var timeline = [];
// create a randomly selected math problem prompt and define correct answer
var test = {
type: jsPsychSurveyText,
questions: [
{
prompt: function() {
var MathQuest = [
'2+2', '3+7', 'How many weeks in a year?'
];
var mathProblems = jsPsych.randomization.sampleWithReplacement(MathQuest, 1)[0];
return mathProblems;
},
name: 'resp',
}
],
post_trial_gap: 500,
on_finish: function(data) {
var correctResponses = {
'2+2' : '4',
'3+7' : '10',
'How many weeks in a year?' : '52'
};
var response = data.response;
if (correctResponses[data.prompt] === response) {
data.correct = true;
} else {
data.correct = false;
}
}
}; // end test trial
// Create a loop node for the test with accuracy criteria:
var correctCount = 0; // Counter for correct responses
var loopNode = {
timeline: [test],
loop_function: function(data) {
// Check if the loop should continue based on the number of correct responses
if (correctCount < 10) {
if (data.values()[0].correct) {
correctCount++;
}
return true; // Continue the loop
} else {
return false; // End the loop
}
console.log("Correct Count: " + correctCount);
},
};
jsPsych.run([loopNode]);
</script>
</body>
</html>
2nd attempt:
<!DOCTYPE html>
<html>
<head> <!-- all preloads go into head -->
<title>Math Quiz Take 2</title>
<!-- any plugins go here-->
<script src="jspsych/dist/jspsych.js"></script>
<script src = "jspsych/dist/plugin-survey-text.js"></script>
<link href="jspsych/dist/jspsych.css" rel="stylesheet" type="text/css" />
</head>
<body> <!-- all script for tasks go into body-->
<script>
var jsPsych = initJsPsych();
var timeline = [];
var mathQuestions = [
{math: '2+2 = ?', correct: '4'},
{math: '2x3 = ?', correct: '6'},
{math: '5x7 = ?', correct: '35'}
];
var test = {
type: jsPsychSurveyText,
questions: [
{
prompt: jsPsych.timelineVariable('math'),
name: 'resp'
}
],
on_finish: function(data) {
data.correct=jsPsych.timelineVariable('correct');
var acc = 0;
var response = data.response.resp;
if (response == data.correct){
acc++;
}
}
};
var mathQuestionProcedure = {
timeline: [test],
timeline_variables: mathQuestions,
loop_function: function(data) {
if (acc < 2) {
return true; //go to criteria
} else {
return false; //end loop
}
}
}
timeline.push(mathQuestionProcedure);
jsPsych.run([mathQuestionProcedure])
</script>
</body>
</html>