Alternating trial types sampling from separate variable sets

[veracityx]

Hi, I have a question about how to make two different types of trials randomly sample from two separate variable sets.

I'm trying to build an experiment that repeatedly alternates between two types of trials. For the first trial type (a “repeat” trial), the participant looks at a picture while listening to an audio description; on the next screen, they have to repeat that description into the microphone. For the second trial type, the participant looks at a picture and has to describe it themselves (a “describe” trial).

Let’s say the entire experiment will involve 5 such repetitions of repeat_trial + describe_trial pairs. That is, it will do: repeat_trial, describe_trial, repeat_trial, describe_trial, repeat_trial, describe_trial...etc.

My issue: repeat_trial needs to randomly sample (without replacement) from a set of 5 paired stimulus pictures and audio. describe_trial needs to randomly sample (without replacement) from a different set of 5 stimulus pictures. How can I put these two separate sets of stimulus items into timeline_variables? I've tried a nested array as well as combining the two separate stimulus sets together into one but neither works.

I’ve posted a simplified version of the code below. Any help would be greatly appreciated!

// Stimulus sets
  var repeat_stimuli = [
    { repeat_picture: "baseline1.png", repeat_audio: "rec1.m4a"},
    { repeat_picture: "baseline2.png", repeat_audio: "rec2.m4a"},
    { repeat_picture: "baseline3.png", repeat_audio: "rec3.m4a"},
    { repeat_picture: "baseline4.png", repeat_audio: "rec4.m4a"},
    { repeat_picture: "baseline5.png", repeat_audio: "rec5.m4a"}
    ];
    
  var describe_stimuli = [
    { describe_picture: "baseline6.png"},
    { describe_picture: "baseline7.png"},
    { describe_picture: "baseline8.png"},
    { describe_picture: "baseline9.png"},
    { describe_picture: "baseline10.png"}
    ];

// "Repeat"-type trial (listening + repeating)
  var repeat_trial_1 = {
      type: jsPsychAudioButtonResponse,
      prompt: function(){
                var baselinerepeat_html= `
                    <img src="${jsPsych.timelineVariable('repeat_picture')}" height = "400">`;
                return baselinerepeat_html;
            },   
      stimulus: jsPsych.timelineVariable('repeat_audio'),
      choices: [],   
      trial_ends_after_audio: true,
      response_allowed_while_playing: false
    };

  var repeat_trial_2 = {
      type: jsPsychHtmlAudioResponse,
      stimulus: `Repeat now`,   
      recording_duration: 8000,
      show_done_button: true,
      done_button_label: "Finish"
    };
  
// "Describe"-type trial
  var describe_trial = {
    type: jsPsychHtmlAudioResponse,
    stimulus: function(){
                var baselinedescribe_html= `
                    <img src="${jsPsych.timelineVariable('describe_picture')}" height = "400">`;
                return baselinedescribe_html;
            },   
    recording_duration: 8000,
    show_done_button: true,
    done_button_label: "Finish"
  };

// Timeline
  var main_timeline = {
    timeline: [repeat_trial_1, repeat_trial_2, describe_trial],
    timeline_variables: [repeat_stimuli, describe_stimuli],
    randomize_order: true,
  };
  timeline.push(main_timeline);

[Shaobin-Jiang]

I would suggest not relying on the randomize_order parameter but randomizing the stimulus yourself:

var main_timeline = {
  timeline: [repeat_trial_1, repeat_trial_2, describe_trial],
  timeline_variables: Array(repeat_stimuli.length), // preset the number of repetitions
  on_timeline_start: function () {
    let shuffled_repeat_stimuli = jsPsych.randomization.shuffle(repeat_stimuli);
    let shuffled_describe_stimuli = jsPsych.randomization.shuffle(describe_stimuli);
    this.timeline_variables = shuffled_repeat_stimuli.map((value, index) =>
      Object.assign({}, value, shuffled_describe_stimuli[index]),
    );
  },
};

[veracityx]

That makes sense. Thank you so much!