Click on one of four images
Jaap MurreThe waitfor ... or ... construct allows two or more events to be specified, where the first one to occur is handled and the rest is ignored. So, if we click on b3, the script is no longer waiting for the other three blocks (images) to be clicked and moves past the final 'or' clause.
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 n,
size = 40,
b1 = main.addblock("left","top",size,size),
b2 = main.addblock("right","top",size,size),
b3 = main.addblock("left","bottom",size,size),
b4 = main.addblock("right","bottom",size,size);
b1.preload("color_cars1.png"); // preload each image in each block where it will be shown
b2.preload("color_cars2.png");
b3.preload("color_cars3.png");
b4.preload("color_cars4.png");
image.await("preloading_completed"); // Wait until all images are preloaded
// The waitfor ... or ... construct allows two or more events to be specified,
// where the first one to occur is handled and the rest is ignored. So, if we
// click on b3, the script is no longer waiting for clicks on the other blocks.
waitfor { // waitfor is not part of normal JavaScript so it (only) appears we have an error
b1.setimage("color_cars1.png");
b1.await('click');
n = 1;
} or {
b2.setimage("color_cars2.png");
b2.await('click');
n = 2;
} or {
b3.setimage("color_cars3.png");
b3.await('click');
n = 3;
} or {
b4.setimage("color_cars4.png");
b4.await('click');
n = 4;
}
text("You clicked on image " + n);
await(3000);
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.
color_cars1.png
color_cars2.png
color_cars3.png
color_cars4.png