Building in experiment with different combinations of stimuli for each subject

[rbruno1]

Is there a way for the user to tell the program in Cognition.run which condition you are running. For example, if I want to assign different orders of stimuli to different people, can I do that? Or, would that necessitate building multiple versions of the experiment, each with a different link?

Here is source code, though it is subject to change:

var welcome = {
  type: "html-keyboard-response",
  stimulus: "Welcome to the experiment. Press any key to begin."
}
var instructions = {
  type: "html-keyboard-response",
  stimulus: "<p>In this experiment, two images will appear on the screen. If the audio (or audio segment) matches the image on the left, press the letter F on the keyboard as fast as you can. If the audio (or audio segment) matches the image on the right, press the letter J as fast as you can.</p>" +
          "<p>Press any key to begin.</p>", 
  post_trial_gap: 1000


var video_trial_1 = {
  type:'video-keyboard-response',
  stimulus: [
    'banjobandage200f.mp4'
  ],
  post_trial_gap: 1000,
  choices: ['f', 'j'],
  data: {condition: 'banjo', correct_response: 'j'},
  width:1000
}

var video_trial_2 = {
  type:'video-keyboard-response',
  stimulus: [
    'banjobandage300j.mp4'
  ],
  post_trial_gap: 1000,
  choices: ['f', 'j'],
  data: {condition: 'banjo', correct_response: 'j'},
  width:1000
}

var video_trial_3 = {
  type:'video-keyboard-response',
  stimulus: [
    'bandagebanjo0j.mp4'
  ],
  post_trial_gap: 1000,
  choices: ['f', 'j'],
  data: {condition: 'bandage', correct_response: 'f'},
  width:1000
}

var video_trial_4 = {
  type:'video-keyboard-response',
  stimulus: [
    'bandagebanjo300f.mp4'
  ],
  post_trial_gap: 1000,
  choices: ['f', 'j'],
  data: {condition: 'bandage', correct_response: 'f'},
  width:1000
}

var video_trial_5 = {
  type:'video-keyboard-response',
  stimulus: [
    'bandagebanjo100f.mp4'
  ],
  post_trial_gap: 1000,
  choices: ['f', 'j'],
  data: {condition: 'bandage', correct_response: 'f'},
  width:1000
}

var video_trial_6 = {
  type:'video-keyboard-response',
  stimulus: [
    'banjobandage0f.mp4'
  ],
  post_trial_gap: 1000,
  choices: ['f', 'j'],
  data: {condition: 'banjo', correct_response: 'j'},
  width:1000
}

var video_trial_7 = {
  type:'video-keyboard-response',
  stimulus: [
    'banjobandage100j.mp4'
  ],
  post_trial_gap: 1000,
  choices: ['f', 'j'],
  data: {condition: 'banjo', correct_response: 'f'},
  width:1000
}

var video_trial_8 = {
  type:'video-keyboard-response',
  stimulus: [
    'bandagebanjo200j.mp4'
  ],
  post_trial_gap: 1000,
  choices: ['f', 'j'],
  data: {condition: 'bandage', correct_response: 'j'},
  width:1000
}

var video_trial_9 = {
  type:'video-keyboard-response',
  stimulus: [
    'muffinmushroom0f.mp4'
  ],
  post_trial_gap: 1000,
  choices: ['f', 'j'],
  data: {condition: 'muffin', correct_response: 'j'},
  width:1000
}

var video_trial_10 = {
  type:'video-keyboard-response',
  stimulus: [
    'muffinmushroom300j.mp4'
  ],
  post_trial_gap: 1000,
  choices: ['f', 'j'],
  data: {condition: 'muffin', correct_response: 'f'},
  width:1000
}

var video_trial_11 = {
  type:'video-keyboard-response',
  stimulus: [
    'mushroommuffin200j.mp4'
  ],
  post_trial_gap: 1000,
  choices: ['f', 'j'],
  data: {condition: 'mushroom', correct_response: 'j'},
  width:1000
}

var video_trial_12 = {
  type:'video-keyboard-response',
  stimulus: [
    'muffinmushroom200f.mp4'
  ],
  post_trial_gap: 1000,
  choices: ['f', 'j'],
  data: {condition: 'muffin', correct_response: 'f'},
  width:1000
}

var video_trial_13 = {
  type:'video-keyboard-response',
  stimulus: [
    'muffinmushroom100j.mp4'
  ],
  post_trial_gap: 1000,
  choices: ['f', 'j'],
  data: {condition: 'muffin', correct_response: 'j'},
  width:1000
}

var video_trial_14 = {
  type:'video-keyboard-response',
  stimulus: [
    'mushroommuffin100f.mp4'
  ],
  post_trial_gap: 1000,
  choices: ['f', 'j'],
  data: {condition: 'mushroom', correct_response: 'f'},
  width:1000
}

var video_trial_15 = {
  type:'video-keyboard-response',
  stimulus: [
    'mushroommuffin300f.mp4'
  ],
  post_trial_gap: 1000,
  choices: ['f', 'j'],
  data: {condition: 'mushroom', correct_response: 'f'},
  width:1000
}

var video_trial_16 = {
  type:'video-keyboard-response',
  stimulus: [
    'mushroommuffin0j.mp4'
    ],
  post_trial_gap: 1000,
  choices: ['f', 'j'],
  data: {condition: 'mushroom', correct_response: 'j'},
  width:1000
}

var goodbye = {
  type: "html-keyboard-response",
  stimulus: "Thank you for your participation! Press any key to see how you did on the following page!"
}

jsPsych.init({
  timeline: [welcome, instructions, video_trial_1, video_trial_2, video_trial_3, video_trial_4, video_trial_5, video_trial_6, video_trial_7, video_trial_8, video_trial_9, video_trial_10, video_trial_11, video_trial_12, video_trial_13, video_trial_14, video_trial_15, video_trial_16, goodbye],
  on_finish: function () {
    jsPsych.data.displayData();
  }
})

[becky-gilbert]

Yes, you can do this in a single experiment in cognition.run. If you click on your expeirment settings in cognition.run, then go to Design -> Configuration -> Advanced -> Inter experiment conditions, then enter the number of conditions that you want counterbalanced. Then when you run your experiment, you'll automatically have access to the condition number assigned to the participant with a variable CONDITION (this is explained in the text below the "Inter experiment conditions" box). Then, in your code, you can use the CONDITION variable to change the way your experiment is set up, e.g.

// create a variable called stimuli and give it different values based on the condition number
var stimuli;
if (CONDITION == 1) {
  stimuli = stimuli_version_1;
} else if (CONDITION == 2) {
  stimuli = stimuli_version_2;
} else {
  stimuli = stimuli_version_3;
}
// then set up the experiment using the stimuli array

I hope that helps. Let us know if you need any further guidance.

[rbruno1]

is this close for a start? The experiment doesn't run but I'm just wondering if this is how the set up should look. I'm also trying to find out how to make the trials run without replacement. Any help would be appreciated (I am still learning).

timeline = [];

var stimuli;
if (CONDITION == 1) {
  stimuli = stimuli_version_1;
} else if (CONDITION == 2) {
  stimuli = stimuli_version_2;
} else if (CONDITION == 3) {
  stimuli = stimuli_version_3;
} else {
  stimuli = stimuli_version_4;
}
var welcome = {
  type: "html-keyboard-response",
  stimulus: "Welcome to the experiment. Press any key to begin."
}
timeline.push(welcome);

var instructions = {
  type: "html-keyboard-response",
  stimulus: "<p>In this experiment, two images will appear on the screen. If the audio (or audio segment) matches the image on the left, press the letter F on the keyboard as fast as you can. If the audio (or audio segment) matches the image on the right, press the letter J as fast as you can.</p>" +
          "<p>Press any key to begin.</p>", 
  post_trial_gap: 1000
}
timeline.push(instructions);

var stimuli_version_1 = [
      { stimulus: "bandagebanjo0j.mp4",  correct_response: 'j'},
      { stimulus: "bandagebanjo100f.mp4",  correct_response: 'f'},
      { stimulus: "bandagebanjo200j.mp4",  correct_response: 'j'},
      { stimulus: "bandagebanjo300f.mp4",  correct_response: 'f'}
  ];

var stimuli_version_2 = [
      { stimulus: "banjobandage0f.mp4",  correct_response: 'f'},
      { stimulus: "banjobandage100j.mp4",  correct_response: 'j'},
      { stimulus: "banjobandage200f.mp4",  correct_response: 'f'},
      { stimulus: "banjobandage300j.mp4",  correct_response: 'j'}
  ];

var stimuli_version_3 = [
      { stimulus: "muffinmushroom0f.mp4",  correct_response: 'f'},
      { stimulus: "muffinmushroom100j.mp4",  correct_response: 'j'},
      { stimulus: "muffinmushroom200f.mp4",  correct_response: 'f'},
      { stimulus: "muffinmushroom300j.mp4",  correct_response: 'j'}
  ];
  
var stimuli_version_4 = [
      { stimulus: "mushroommuffin0j.mp4",  correct_response: 'f'},
      { stimulus: "mushroommuffin100f.mp4",  correct_response: 'f'},
      { stimulus: "mushroommuffin200f.mp4",  correct_response: 'f'},
      { stimulus: "mushroommuffin300j.mp4",  correct_response: 'j'}
  ];
  
/// unsure after this. 

var test = {
      type: "video-keyboard-response",
      stimulus: jsPsych.timelineVariable('stimulus'),
      choices: ['f', 'j'],
      data: {
        task: 'response',
        correct_response: jsPsych.timelineVariable('correct_response')
      },
      on_finish: function(data){
        data.correct = jsPsych.pluginAPI.compareKeys(data.response, data.correct_response);
      }
    }
    
var procedure = {
      timeline: [test],
      timeline_variables: stimuli_version_1, stimuli_version_2, stimuli_version_3, stimuli_version_4,
      repetitions: 4
    }
    timeline.push(procedure);
    
jsPsych.init({
  timeline: [timeline],
  on_finish: function () {
    jsPsych.data.displayData();
  }
})

[becky-gilbert]

It is close! Just a few things. First, you want to define your different stimuli version arrays before you reference them in the CONDITION if statment. Second, for the timeline_variables in your procedure, you just want to use the stimuli array, since that variable will contain one of your four stimuli version arrays, and each participant only does one of the versions (unless I've misunderstood?). So you could try this:

timeline = [];

// define the stimuli arrays for the different versions
var stimuli_version_1 = [
      { stimulus: "bandagebanjo0j.mp4",  correct_response: 'j'},
      { stimulus: "bandagebanjo100f.mp4",  correct_response: 'f'},
      { stimulus: "bandagebanjo200j.mp4",  correct_response: 'j'},
      { stimulus: "bandagebanjo300f.mp4",  correct_response: 'f'}
  ];

var stimuli_version_2 = [
      { stimulus: "banjobandage0f.mp4",  correct_response: 'f'},
      { stimulus: "banjobandage100j.mp4",  correct_response: 'j'},
      { stimulus: "banjobandage200f.mp4",  correct_response: 'f'},
      { stimulus: "banjobandage300j.mp4",  correct_response: 'j'}
  ];

var stimuli_version_3 = [
      { stimulus: "muffinmushroom0f.mp4",  correct_response: 'f'},
      { stimulus: "muffinmushroom100j.mp4",  correct_response: 'j'},
      { stimulus: "muffinmushroom200f.mp4",  correct_response: 'f'},
      { stimulus: "muffinmushroom300j.mp4",  correct_response: 'j'}
  ];
  
var stimuli_version_4 = [
      { stimulus: "mushroommuffin0j.mp4",  correct_response: 'f'},
      { stimulus: "mushroommuffin100f.mp4",  correct_response: 'f'},
      { stimulus: "mushroommuffin200f.mp4",  correct_response: 'f'},
      { stimulus: "mushroommuffin300j.mp4",  correct_response: 'j'}
  ];

// select which stimuli array to use, based on the condition
var stimuli;
if (CONDITION == 1) {
  stimuli = stimuli_version_1;
} else if (CONDITION == 2) {
  stimuli = stimuli_version_2;
} else if (CONDITION == 3) {
  stimuli = stimuli_version_3;
} else {
  stimuli = stimuli_version_4;
}

var welcome = {
  type: "html-keyboard-response",
  stimulus: "Welcome to the experiment. Press any key to begin."
}
timeline.push(welcome);

var instructions = {
  type: "html-keyboard-response",
  stimulus: "<p>In this experiment, two images will appear on the screen. If the audio (or audio segment) matches the image on the left, press the letter F on the keyboard as fast as you can. If the audio (or audio segment) matches the image on the right, press the letter J as fast as you can.</p>" +
          "<p>Press any key to begin.</p>", 
  post_trial_gap: 1000
}
timeline.push(instructions);
  
var test = {
      type: "video-keyboard-response",
      stimulus: jsPsych.timelineVariable('stimulus'),
      choices: ['f', 'j'],
      data: {
        task: 'response',
        correct_response: jsPsych.timelineVariable('correct_response')
      },
      on_finish: function(data){
        data.correct = jsPsych.pluginAPI.compareKeys(data.response, data.correct_response);
      }
    }
    
var procedure = {
      timeline: [test],
      timeline_variables: stimuli, // the stimuli array used here will depend on the counterbalanced condition number
      repetitions: 4
    }
    timeline.push(procedure);
    
jsPsych.init({
  timeline: [timeline],
  on_finish: function () {
    jsPsych.data.displayData();
  }
})

Also, one cool thing about cognition.run is that in the preview mode (while editing the source code), you can click on "Set condition" (under the preview area), and manually set the condition number to test that it's working.