JsPsych: timeline nodes and plugins

Summary of previous session

Objectives

Objectives:

  • Learn how to easily adapt how a trial goes (adding a blank after a trial…)

  • Get familiar with reading the (jspsych) documentation

  • Learn to use timeline variables

  • (bonus) learn how to provide feedback

Reading documentation

Refreshing our previous script

Last time, we created a simple letter recognition task (file here), with a fixation cross before each trial. You should also have added a blank after each trial.

Now, we will try to do this using two trial parameters. Look up the html-keyboard-response plugin documentation to find the relevant parameters.

At first sight, nothing fits what we want. But we can have a look at the parameters available to all plugins.

Here, you should spot post_trial_gap, which seems to do what we want. We can use it to replace the blank screen trial. There seems to be nothing we can do about fixation cross, however: it must remain a standalone trial.

Documentation Sample The details of the parameter we are interested in.

How much should we use the documentation?

You may have noticed several interesting options while browsing the documentation. You are free to use them to improve your script, as they allow you to easily fine-tune your trials.

Sometimes, it is not obvious to find the behavior that you want to implement. In these cases, do not hesitate to use whatever solution/tricks you may find! The pre-coded functions are here to help you code faster (and with less risks of bugs), but a running code is always better than none! Of course, you should always have a quick look on the internet before giving up… :)

Exercise (~15 minutes)

Ok, let’s update our letter detection task. Now, the letter should be presented in either upper and lower case throughout the trials. Your job will be to only display the letter for a single second, and save the expected key as well as the actual response.

A possible solution here.

Exercise++

Could you add a confidence slider after each answer, with the help of the documentation?

Simplifying our timeline: variables

Our code is growing, yet our experiment stays, in fact, pretty simple. We can make everything much simpler using timeline variables. Timeline variables are well-explained in the official jsPsych documentation.

Note that the timeline is played entirely for each timeline_variable! In the code below, you will have two trials.

let timelineWithParameters = {
  timeline: [trial],
  timeline_variable: [{variable_name: value1}, {variable_name: value2}]
}

To access the variable in your trial, you will have to call jsPsych.timelineVariable("variable_name"), with variable_name being the name of your variable.

let trial = {
  type: ...,
  stimulus: jsPsych.timelineVariable("stimulus"),
}

You can also specify whether the order has to be randomized, and how many time you should repeat each trial.

let timelineWithParameters = {
  timeline: [trial],
  timeline_variable: [{variable: value1}, {variable: value2}]
  // Randomization and repetition
  randomize_order: true,
  repetitions: numberOfRepetitions;
}

Exercise (~15 min)

Part 1

Can you now simplify our last task? A possible solution here.

Part 2

If you run my solution (and perhaps yours), you may notice something wrong with the succession of trials: hopefully, we’ve previously seen how to fix it! Try to do it, maybe by breaking down a bit the existing simplicity we have !