Corsi Blocks Complete Example - Dutch
Jaap MurreThis is a much more extensive example than the minimal demo. This version includes a practice phase with feedback on common errors and is generally more robust (e.g., if subjects click on the background an ‘error flash’ is shown). This version has Dutch instructions. An English version is forthcoming.
If you are a registered user and signed in, you can here copy this script and its stimuli to your own account, where you can edit it and change it in any way you want.
It is absolutely free to register (no credit card info asked!). You can then instantly copy this experiment with one click and edit it, change its accompanying texts, its landing page, stimuli, etc. Invite your colleagues, friends, or students to check out your experiment. There is no limit on how many people can do your experiment, even with a free account.
The catch? There is no catch! Just keep in mind that with a free account, you cannot collect data. For teaching that is usually not a problem. For research, prepaid data collection (unlimited subjects) starts as low as €10.00 for a 10-day period.
var coords = [[10,10],[20,40],[20,80],[40,30],[45,60], // block coordinates %
[60,10],[60,75],[70,50],[80,20],[85,45]]; // [[left,top], ...]
// Blocks 0 to 9
var stimuli_corsibasics = [
[[], [] ],
[[1], [1] ],
[[9,7], [6,3] ],
[[5,8,0], [6,9,4] ],
[[7,2,8,6], [6,0,3,9] ],
[[4,2,0,3,1], [7,5,8,3,0] ],
[[3,9,2,4,8,7], [6,1,9,4,7,3] ],
[[4,1,7,9,3,0,6], [6,9,1,7,4,2,8] ],
[[3,8,2,9,6,1,7,4], [5,0,1,3,2,6,4,7] ],
[[2,7,0,8,6,3,1,9,4],[7,1,3,9,4,2,5,6,8] ]
];
function shortalert(message,ms_ok,left,top,width,height,color)
{
ms_ok = ms_ok || 1000;
left = left || 30;
top = top || 20;
width = width || 40;
height = height || 20;
color = color || '#f5f5dc';
var b = addblock(left,top,width,height,color,message);
if ($.type(ms_ok) === 'number')
{
await(ms_ok);
}
else
{
var b_ok = addblock(left+width-9,top+height-7,7,5,'lightgrey',ms_ok);
b_ok.style('font-size','70%')
.style('border','solid #a9a9a9 thin')
.style('cursor','pointer')
.style('opacity','0.7');
b_ok.await('click');
b_ok.destroy();
}
b.destroy();
}
function show_flash(e)
{
var x = addblock(e.event.layerX*100/e.event.target.clientWidth - 2.5,
e.event.layerY*100/e.event.target.clientHeight - 2.5,
5,5)
.style('color','red')
.icon('star');
await(250);
x.destroy();
}
function show_start()
{
// b_start = addblock(-20, 50, 10, 8, 'gold','start');
// await(500);
// b_start.destroy();
main.style('background-color','beige');
await(250);
main.style('background-color','white');
}
function show_blinks(series,blocks,block_color)
{
var i, b, b_start;
for (i = 0; i < series.length; i++) // 'Play' series
{
b = series[i]; // [2,5,...] i = 0 -> b = 2
blocks[b].style("background-color","black");
await(500);
blocks[b].style("background-color",block_color);
await(500);
}
show_start();
}
function corsibasics_example()
{
main.setfontsize(60);
var blocks = [], i, b, series, e, block,
block_color = "lightgrey",
span = 2, errors, attempts = 0, correct = 0, total_correct = 0,
kessels_score;
instruction('U ziet steeds een aantal blokjes na elkaar even zwart worden.'
+ ' Na afloop moet u de reeks blokjes in dezelfde volgorde aanklikken.'
+ ' U ziet verschillende reeksen. Ze worden steeds langer.','OK', 'Instructie');
instruction('We beginnen met een voorbeeld zodat u even kunt oefenen.', 'OK', ' ');
instruction("Na iedere reeks volgt een korte 'flits' van de achtergrond. Daarna kunt u de blokjes aanklikken in dezelfde volgorde.", 'OK', ' ');
for (i = 0; i < coords.length; i++) // Create block layout, use `i` as id
{
blocks.push(addblock(coords[i][0],coords[i][1],10,10,block_color,'',i));
}
await(1000);
series = [3,6];
show_blinks(series,blocks,block_color);
errors = 0;
for (i = 0; i < 2; i++) // Have subject click series
{
e = await("click",4000); // Event `e` also contains target node
if (e.type !== 'timeout')
{
b = parseInt(e.event.target.id); // parseInt turns a string into a number or NaN on strange behavior (drag or click anywhere)
if (e.event.target.id === 'undefined' || isNaN(b))
{
show_flash(e);
i--;
continue;
}
blocks[b].blink("black",250); // 250 ms blink to black
if (series[i] !== b) // Count errors
{
++errors;
console.log("Error? ",i,series,series[i],b);
}
console.log(series[i],b,errors)
}
else
{
alert("Het is de bedoeling dat u de blokjes aanklikt die zojuist werden getoond. We beginnen even opnieuw.");
await(1000);
show_blinks(series,blocks,block_color);
i = -1;
errors = 0;
continue;
}
}
await(500);
if (errors > 0)
{
alert("Let er goed op dat u de blokjes in dezelfde volgorde aanklikt als getoond.");
}
else
{
shortalert('Correct!',null,null,null,25,15);
}
await(2000);
series = [4,2,9];
show_blinks(series,blocks,block_color);
errors = 0;
for (i = 0; i < 3; i++) // Have subject click series
{
e = await("click",2000); // Event `e` also contains target node
if (e.type !== 'timeout')
{
b = parseInt(e.event.target.id); // parseInt turns a string into a number or NaN on strange behavior (drag or click anywhere)
if (e.event.target.id === 'undefined' || isNaN(b))
{
show_flash(e);
i--;
continue;
}
blocks[b].blink("black",250); // 250 ms blink to black
if (series[i] !== b) // Count errors
{
++errors;
}
}
}
await(500);
if (e.type === 'timeout')
{
alert("Het is de bedoeling dat u de blokjes aanklikt die zojuist werden getoond.");
}
else if (errors > 0)
{
alert("Let er goed op dat u de blokjes in dezelfde volgorde aanklikt als zojuist getoond.");
}
else if (errors === 0)
{
shortalert('Correct!',null,null,null,25,15);
}
await(2000);
for (i = 0; i < blocks.length; i++) // Create block layout, use `i` as id
{
blocks[i].destroy();
}
blocks = [];
log(total_correct,"total_correct_corsibasics_example");
}
function corsibasics()
{
main.setfontsize(60);
var blocks = [], i, b, series, e, block,
block_color = "lightgrey",
span = 2, errors, attempts = 0, correct = 0, total_correct = 0,
kessels_score;
for (i = 0; i < coords.length; i++) // Create block layout, use `i` as id
{
blocks.push(addblock(coords[i][0],coords[i][1],10,10,block_color,'',i));
}
while (true) // Do 'forever', but really only until `break` is called
{
await(2000);
series = stimuli_corsibasics[span][attempts];
// series = [2,5,1,7,8, ...]
show_blinks(series,blocks,block_color);
errors = 0;
for (i = 0; i < span; i++) // Have subject click series
{
e = await("click"); // Event `e` also contains target node
b = parseInt(e.event.target.id); // parseInt turns a string into a number or NaN on strange behavior (drag or click anywhere)
if (e.event.target.id === 'undefined' || isNaN(b))
{
show_flash(e);
i--;
continue;
}
blocks[b].blink("black",250); // 250 ms blink to black
if (series[i] !== b) // Count errors
{
++errors;
}
}
++attempts;
if (errors === 0)
{
++correct;
++total_correct
if (attempts === 2) // If twice correct, increase span
{
++span;
attempts = 0;
correct = 0;
}
}
else if (errors > 0)
{
if (attempts === 2) // If twice wrong, stop test
{
if (correct === 0)
{
--span;
kessels_score = span*total_correct; // Kessels et al. (2000)
break; // Break out of while loop
}
else
{
++span;
attempts = 0;
correct = 0;
}
}
}
}
for (i = 0; i < blocks.length; i++) // Create block layout, use `i` as id
{
blocks[i].destroy();
}
blocks = [];
response.span = span;
console.log("Corsi Span: ",span," Kessels Score: ",kessels_score);
log(total_correct,"total_correct_corsibasics");
log(span,"span_corsibasics");
log(kessels_score,"kessels_score_corsibasics");
}
// Note that data are are stored only if you have a paid NeuroTask account
main.setfontsize(60);
instruction("Welkom bij de Corsi Blokken taak","OK"," ");
corsibasics_example();
instruction("Nu volgt de eigenlijke test. Hierbij krijgt u geen feedback meer.","OK"," ");
corsibasics();
instruction("Uw spanne is {span} blokken. <br /><br />Bedankt voor het meedoen!","OK"," ");
You can download the files as follows: Click on the file (link) and then right-click and choose Save as... from the menu. Some media files (e.g., sound) will have a download button for this purpose.