randomization/shuffle timeline error

[Nega100]

Hi all
I have some difficulty in this code. My plan is to random/shuffle the 4 blocks of the timeline. Thanks for the help.

 var dot_block_1 = {
    timeline: [
        {
            type: 'html-keyboard-response',
            stimulus: '+',
            choices: jsPsych.NO_KEYS,
            trial_duration: 1000
        },
        {
            type: 'html-button-response',
            stimulus: function() {
              var html= '<img src=' +jsPsych.timelineVariable('pici', true)+ '></img>'
              return html
            },
            choices: ['blue', 'green', 'red', 'yellow'],
            data: jsPsych.timelineVariable('correct_response'),
            on_finish: function(data) {
              if(data.button_pressed==jsPsych.timelineVariable('correct_response', true)){
                data.correct = true;
              }else{
                data.correct= false;
                console.log(jsPsych.timelineVariable('correct_response', true))
              }
            }
        }
    ],
    timeline_variables: [
        { pici: "jspsych-6.2/exp/img/red_25.jpeg", correct_response: 0},
        { pici: "jspsych-6.2/exp/img/red_10.jpeg", correct_response: 1},
        { pici: "jspsych-6.2/exp/img/red_30.jpeg", correct_response: 2},
    ]
}
//timeline.push(dot_block_1);

var dot_block_2 = {
    timeline: [
        {
            type: 'html-keyboard-response',
            stimulus: '+',
            choices: jsPsych.NO_KEYS,
            trial_duration: 1000
        },
        {
            type: 'html-button-response',
            stimulus: function() {
              var html= '<img src=' +jsPsych.timelineVariable('pici', true)+ '></img>'
              return html
            },
            choices: ['blue', 'green', 'red', 'yellow'],
            data: jsPsych.timelineVariable('correct_response'),
            on_finish: function(data) {
              if(data.button_pressed==jsPsych.timelineVariable('correct_response', true)){
                data.correct = true;
              }else{
                data.correct= false;
                console.log(jsPsych.timelineVariable('correct_response', true))
              }
            }
        }
    ],
    timeline_variables: [
        { pici: "jspsych-6.2/exp/img/biru_20.jpeg", correct_response: 0},
        { pici: "jspsych-6.2/exp/img/biru_10.jpeg", correct_response: 1},
        { pici: "jspsych-6.2/exp/img/red_15.jpeg", correct_response: 2},
    ]
}
//timeline.push(dot_block_2);

var dot_block_3 = {
    timeline: [
        {
            type: 'html-keyboard-response',
            stimulus: '+',
            choices: jsPsych.NO_KEYS,
            trial_duration: 1000
        },
        {
            type: 'html-button-response',
            stimulus: function() {
              var html= '<img src=' +jsPsych.timelineVariable('pici', true)+ '></img>'
              return html
            },
            choices: ['blue', 'green', 'red', 'yellow'],
            data: jsPsych.timelineVariable('correct_response'),
            on_finish: function(data) {
              if(data.button_pressed==jsPsych.timelineVariable('correct_response', true)){
                data.correct = true;
              }else{
                data.correct= false;
                console.log(jsPsych.timelineVariable('correct_response', true))
              }
            }
        }
    ],
    timeline_variables: [
        { pici: "jspsych-6.2/exp/img/hijau_20.jpeg", correct_response: 0},
        { pici: "jspsych-6.2/exp/img/hijau_10.jpeg", correct_response: 1},
        { pici: "jspsych-6.2/exp/img/hijau_30.jpeg", correct_response: 2},
    ]
}
//timeline.push(dot_block_3);

var dot_block_4 = {
    timeline: [
        {
            type: 'html-keyboard-response',
            stimulus: '+',
            choices: jsPsych.NO_KEYS,
            trial_duration: 1000
        },
        {
            type: 'html-button-response',
            stimulus: function() {
              var html= '<img src=' +jsPsych.timelineVariable('pici', true)+ '></img>'
              return html
            },
            choices: ['blue', 'green', 'red', 'yellow'],
            data: jsPsych.timelineVariable('correct_response'),
            on_finish: function(data) {
              if(data.button_pressed==jsPsych.timelineVariable('correct_response', true)){
                data.correct = true;
              }else{
                data.correct= false;
                console.log(jsPsych.timelineVariable('correct_response', true))
              }
            }
        }
    ],
    timeline_variables: [
        { pici: "jspsych-6.2/exp/img/yellow_20.jpeg", correct_response: 0},
        { pici: "jspsych-6.2/exp/img/yellow_10.jpeg", correct_response: 1},
        { pici: "jspsych-6.2/exp/img/yellow_30.jpeg", correct_response: 2},
    ]
}
//timeline.push(dot_block_4);

var newLine = [dot_block_1, dot_block_2, dot_block_3, dot_block_4];
var NLArray = jsPsych.randomization.repeat(newLine, 1);
timeline.push(NLArray)

and this is the error :
Trial level node is missing the "type" parameter. The parameters for the node are: {"0":{"timeline":[{"type":"html-keyboard-response","stimulus":"+","choices":"none","trial_duration":1000},{"type":"html-button-response","choices.......
Uncaught TypeError TypeError: Cannot read properties of undefined (reading 'info')

[jodeleeuw]

Hi @Nega100,

NLArray is an array, so you can't push that directly onto the timeline, since all items on the timeline need to be either objects with a type property (trials) or timeline property (nested timelines).

Try timeline = timeline.concat(NLArray) instead, which will add each item in the array to the timeline individually.

[Nega100]

Thanks Josh for the answer!..sorry for late respon.