// jsPsych plugin for showing animations
// Josh de Leeuw
(function( $ ) {
jsPsych.categorize_animation = (function(){
var plugin = {};
plugin.create = function(params) {
stims = params["stimuli"];
trials = new Array(stims.length);
for(var i = 0; i < trials.length; i++)
{
trials[i] = {};
trials[i]["type"] = "categorize_animation";
trials[i]["stims"] = stims[i];
trials[i]["frame_time"] = params["frame_time"];
trials[i]["timing"] = params["timing"];
trials[i]["key_answer"] = params["key_answer"][i];
trials[i]["text_answer"] = params["text_answer"][i];
trials[i]["choices"] = params["choices"];
trials[i]["correct_text"] = params["correct_text"];
trials[i]["incorrect_text"] = params["incorrect_text"];
trials[i]["allow_response_before_complete"] = params["allow_response_before_complete"] || false;
trials[i]["reps"] = params["reps"] || -1; // default of -1, which allows indefinitely
if(params["prompt"] != undefined){
trials[i]["prompt"] = params["prompt"];
}
if(params["data"]!=undefined){
trials[i]["data"] = params["data"][i];
}
}
return trials;
}
plugin.trial = function($this, block, trial, part)
{
var animate_frame = -1;
var reps = 0;
var showAnimation = true;
var responded = false;
var timeoutSet = false;
switch(part)
{
case 1:
var startTime = (new Date()).getTime();
// show animation
animate_interval = setInterval(function(){
$this.html(""); // clear everything
animate_frame++;
if(animate_frame == trial.stims.length)
{
animate_frame = 0;
reps++;
// check if reps complete //
if(trial.reps != -1 && reps >= trial.reps) {
// done with animation
showAnimation = false;
}
}
if( showAnimation ) {
$this.append($('
', {
"src": trial.stims[animate_frame],
"class": 'animate'
}));
}
if(!responded && trial.allow_response_before_complete) {
// in here if the user can respond before the animation is done
if(trial.prompt != undefined) { $this.append(trial.prompt); }
} else if(!responded) {
// in here if the user has to wait to respond until animation is done.
// if this is the case, don't show the prompt until the animation is over.
if( !showAnimation )
{
if(trial.prompt != undefined) { $this.append(trial.prompt); }
}
} else {
// user has responded if we get here.
// show feedback
var feedback_text = "";
if(block.data[block.trial_idx]["correct"])
{
feedback_text = trial.correct_text.replace("&ANS&", trial.text_answer);
} else {
feedback_text = trial.incorrect_text.replace("&ANS&", trial.text_answer);
}
$this.append(feedback_text);
// set timeout to clear feedback
if(!timeoutSet)
{
timeoutSet = true;
setTimeout(function(){plugin.trial($this, block, trial, part + 1);}, trial.timing[0]);
}
}
}, trial.frame_time);
// attach response function
var resp_func = function(e) {
if(!trial.allow_response_before_complete && showAnimation)
{
return false;
}
var flag = false; // valid keystroke?
var correct = false; // correct answer?
if(e.which==trial.key_answer) // correct category
{
flag = true;
correct = true;
}
else
{
// check if the key is any of the options, or if it is an accidental keystroke
for(var i=0;i