Reference Prior Text Responses in Timeline Variable #3124

ggreeley · 2023-09-08T00:27:06Z

ggreeley
Sep 8, 2023

Hi everyone!

I've hit a wall trying to accomplish something that I think should be rather straightforward: I'd like to present participants with their own previously recalled words. This previous recall will be free recall, such that different participants will recall different words, in different overall quantities, in different orders, and they are expected to recall some non-presented words. Following this recall task, I'd like to show them each word and collect a confidence rating

Currently I'm using the following plugin to facilitate free recall: https://www.npmjs.com/package/@pcllab/plugin-free-recall?activeTab=readme - this works well and produces data as expected. I've successfully used jsPsych.data.get().filter({recall_phase: "recall-1"}).count(); to count responses, and have also been able to use jsPsych.data.get().filter({recall_phase: "recall-1"}).values()[1].response; to extract specific single responses with the [1], [2], etc. index (note that the [0] index for is empty because the most recent recall trial just logs the page submission). So, I'm confident accessing the data produced by this plugin is possible.

To present each word following recall, I'm thinking that a using a timeline variable makes sense. That is, I've tried using ${jsPsych.timelineVariable('response')} in the following variable:

// create variable for subsequent confidence task, which should reference recall data
    var recall_phase_1_words = {
      type: jsPsychHtmlKeyboardResponse,
      stimulus: function() {
        return `<p>How confident (1-9) that you saw:<p></b><p style="font-size: 48px; font-family: monospace;"> ${jsPsych.timelineVariable('response')}</p>`
        }
    };

Then I set up a timeline variable to cycle through the responses, using the jsPsych.data.get().filter({recall_phase: "recall-1"})... as input for timeline_variable: as though I'm referencing JSON formatted stimuli in an external file. Here is an example:

// cycle through recalled words, showing each and asking for a response
    var recall_phase_1_conf_task = {
      timeline: [fixation, recall_phase_1_words],
      //timeline_variables: jsPsych.data.get().filter({recall_phase: "recall-1"}), // can't access property response
      //timeline_variables: jsPsych.data.get().filter({recall_phase: "recall-1"}).json(), // stimuli = undefined; timeline variable response not found
      randomize_order: true
    };

In the above example, I've commented-out a few unsuccessful attempts and noted what warning/error comes up.

I'm thinking this is just an issue of not understanding how to navigate the DataCollection object so I can pull out responses dynamically, but I'm not sure.

I'd greatly appreciate any and all help! Please let me know if I can provide any more information or context.

Below is a fully reproducible example - there is no study/encoding phase, but any words can be entered to work through the example:

<!DOCTYPE html>
<html>
  <head>
    <title>Prior Recall Responses in Timeline</title>
    <script src = "https://unpkg.com/[email protected]"></script>
    <script src = "https://unpkg.com/@jspsych/[email protected]"></script>


    <script src = "https://unpkg.com/react@18/umd/react.development.js"></script>
    <script src = "https://unpkg.com/react-dom@18/umd/react-dom.development.js"></script>
    <script src = "https://unpkg.com/@pcllab/plugin-free-recall"></script>

    <link href = "https://unpkg.com/[email protected]/css/jspsych.css" rel="stylesheet" type="text/css" />
  </head>
  <body></body>
  <script>

    // initialize jsPsych
    var jsPsych = initJsPsych(
      {
        on_finish: function() {
          jsPsych.data.displayData();
        }
      }
      );

    // set timeline as empty array, to be filled later on
    var timeline = [];

    // Recall 1 - Task
    // https://www.npmjs.com/package/@pcllab/plugin-free-recall?activeTab=readme
    var recall_phase_1 = {
      type: pcllabFreeRecall,
      stimulus: "<p>Enter words one at a time, pressing the ENTER key to submit each word.</p><p>The words you enter will appear below the text-box.</p>",
      button_label: "Done Recalling!",
      //show_button: false,
      data: {recall_phase: "recall-1"}
    };

    // feedback on performance
    var recall_phase_1_you_recalled_n = {
      type: jsPsychHtmlKeyboardResponse,
      stimulus: function () {

        //var last_item_recalled = jsPsych.data.get().filter({recall_phase: "recall-1"}).values()[0].response;
        var recall_1_count = jsPsych.data.get().filter({recall_phase: "recall-1"}).count();
        var recall_1_count_corrected = Math.round(recall_1_count - 1); // one additional blank trial at end for submitting page - remove this

        return `<p>You recalled ${recall_1_count_corrected} words.</p></b><p>Next you'll rate your confidence in each word...(ENTER to get started)</p>`

      },
      choices: ['Enter']
    };

    // fixation - not strictly needed, but fine to include
    var fixation = {
      type: jsPsychHtmlKeyboardResponse,
      stimulus: `<p style="font-size: 48px; font-family: monospace;">+</p>`,
      choices: 'NO_KEYS',
      trial_duration: 1000
    };

    // following pulls out specific recalled word, specifically the last word recalled
    // note that [0] response is undefined because the final recall trial is the submission, so [1] points to last valid submission
    //var last_item_recalled = jsPsych.data.get().filter({recall_phase: "recall-1"}).values()[1].response;

    // create variable for subsequent confidence task, which should reference recall data
    var recall_phase_1_words = {
      type: jsPsychHtmlKeyboardResponse,
      stimulus: function() {
        return `<p>How confident (1-9) that you saw:<p></b><p style="font-size: 48px; font-family: monospace;"> ${jsPsych.timelineVariable('response')}</p>`
        }
    };

    // cycle through recalled words, randomly, showing each and asking for a response
    var recall_phase_1_conf_task = {
      timeline: [fixation, recall_phase_1_words],
      //timeline_variables: jsPsych.data.get().filter({recall_phase: "recall-1"}), // can't access property response
      timeline_variables: jsPsych.data.get().filter({recall_phase: "recall-1"}).json(), // stimuli = undefined; timeline variable response not found
      randomize_order: true
    };

    // build experiment
    timeline.push(recall_phase_1);
    timeline.push(recall_phase_1_you_recalled_n);
    timeline.push(recall_phase_1_conf_task);

    // run
    jsPsych.run(timeline);
  </script>
</html>

Answered by ggreeley

Sep 9, 2023

Got it! The following works:

var looping_timeline = {
        timeline: [fixation, recall_phase_1_words],
        loop_function: function () {
            word_counter++;
            if (word_counter == jsPsych.data.get().filter({recall_phase: "recall-1"}).count() - 1) {
                return false
            } else {
                return true
            }
        }
    };

Thank you again for your help! Figuring the issue was with the loop_function syntax, I did some digging and came across #1911 - combined with the docs on the main page, I was able to work it out.

Thanks again @jodeleeuw!

View full answer

ggreeley · 2023-09-08T17:34:12Z

ggreeley
Sep 8, 2023
Author

Following up on this, based on #2256, it seems like using a function in timeline_variable may not be possible at all (at least as of 2021). I've also tried adapting the approach used in #3083, using a call function, which also doesn't seem to work.

So, adding to the question above, if using a function isn't possible in timeline_variable, is there another way to accomplish this?

0 replies

jodeleeuw · 2023-09-08T21:31:19Z

jodeleeuw
Sep 8, 2023
Maintainer

Hi @ggreeley,

One issue here is that timeline_variables: jsPsych.data.get().filter({recall_phase: "recall-1"}) is executed when the script loads. This is basically asking jsPsych to get the data immediately upon load, but there's no data at this point because nothing has run yet, since jsPsych.run() occurs much later. (This is one of the more confusing aspects of working with jsPsych.)

Normally the solution to something like this is to wrap the parameter value in a function, which delays execution until the relevant moment in the experiment. But we don't support that for timeline variables yet. Definitely still on the list of things to do.

My typical pattern for this situation is to use a looping timeline.

let word_counter = 0;
const looping_timeline = {
	timeline: [fixation, recall_phase_1_words],
	loop_function: () => {
		// return true to repeat, false to continue to next part of experiment
		word_counter++;
		return word_counter <= jsPsych.data.get().filter({recall_phase: "recall-1"}).values()[0].response.length;
	}
}

To change the word that shows up in recall_phase_1_words use the word_counter variable.

var recall_phase_1_words = {
      type: jsPsychHtmlKeyboardResponse,
      stimulus: function() {
        return `<p>How confident (1-9) that you saw:<p></b><p style="font-size: 48px; font-family: monospace;"> ${ jsPsych.data.get().filter({recall_phase: "recall-1"}).values()[0].response[word_counter}</p>`
        }
    };

I didn't confirm that this works yet, but I think it's the right general idea. It'll depend a bit on how the plugin saves its data.

4 replies

ggreeley Sep 9, 2023
Author

Thanks for your quick reply! That makes a lot of sense.

I think this is very close, but now I'm running into a "Trial level node is missing the "type" parameter. The parameters for the node are: {}" error.

I modified the code you posted above the following way:

var timeline = [];

// Recall 1 - Task
// https://www.npmjs.com/package/@pcllab/plugin-free-recall?activeTab=readme
var recall_phase_1 = {
      type: pcllabFreeRecall,
      stimulus: "<p>Enter words one at a time, pressing the ENTER key to submit each word.</p><p>The words you enter will appear below the text-box.</p>",
      button_label: "Done Recalling!",
      //show_button: false,
      data: {recall_phase: "recall-1"}
    };

var fixation = {
      type: jsPsychHtmlKeyboardResponse,
      stimulus: `<p style="font-size: 48px; font-family: monospace;">+</p>`,
      choices: 'NO_KEYS',
      trial_duration: 1000
    };

// count words, start at 0
let word_counter = 0;

// loop timeline such that fixation appears and then a confidence/rating task appears for each recalled word
// on each loop iteration, word_counter is updated so it pulls the recall response until terminating once the
// number of recalled items is met (total trials minus 1 because final recall trial does not have response data)
var looping_timeline = {
        timeline: [fixation, recall_phase_1_words],
        loop_function: () => {
            // return true to repeat, false to continue to next part of experiment
            word_counter++;
            return word_counter <= Math.round(
                jsPsych.data.get().filter({recall_phase: "recall-1"}).count() - 1
                );
        }
    };

// pull response at index [word_counter] and wait for response
var recall_phase_1_words = {
      type: jsPsychHtmlKeyboardResponse,
      stimulus: function() {
        return `<p>How confident (1-9) that you saw:<p>
          <p style="font-size: 48px; font-family: monospace;">${jsPsych.data.get().filter({recall_phase: "recall-1"}).values()[word_counter].response}</p>`
        }
    };

// build experiment
timeline.push(recall_phase_1);
timeline.push(looping_timeline);

// run
    jsPsych.run(timeline);

This runs through the recall phase correctly, and shows a fixation, but then crashes with the error noted above (along with another error, "TypeError: e.type is not a constructor"

When I push recall_phase_1_words to the timeline without pushing the looping_timeline, the first word recalled appears as it should. For example, if I recalled "one," "two," and "three" - I can provide a response to "one" because word_counter is fixed at 0. So, the following works for pulling out recall responses:

jsPsych.data.get().filter({recall_phase: "recall-1"}).values()[word_counter].response

It seems the issue arises when attempting to loop and update word_counter so subsequently recalled words continue to appear. Any advice on how to address this?

Thank you again for your help!

jodeleeuw Sep 9, 2023
Maintainer

Is there a typo in the plugin name for the pcl lab plugin? Not sure what the correct name is here, but that would be consistent with the error message.

ggreeley Sep 9, 2023
Author

I don't think so - I double checked the README at https://www.npmjs.com/package/@pcllab/plugin-free-recall?activeTab=readme and it does suggest that freeRecall is the appropriate name, but pcllabFreeRecall works in my script and behaves in the expected fashion. When only the free recall task is pushed to the timeline, everything works well.

ggreeley Sep 9, 2023
Author

Got it! The following works:

var looping_timeline = {
        timeline: [fixation, recall_phase_1_words],
        loop_function: function () {
            word_counter++;
            if (word_counter == jsPsych.data.get().filter({recall_phase: "recall-1"}).count() - 1) {
                return false
            } else {
                return true
            }
        }
    };

Thank you again for your help! Figuring the issue was with the loop_function syntax, I did some digging and came across #1911 - combined with the docs on the main page, I was able to work it out.

Thanks again @jodeleeuw!

Answer selected by ggreeley

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Reference Prior Text Responses in Timeline Variable #3124

{{title}}

{{editor}}'s edit

{{editor}}'s edit

Replies: 2 comments 4 replies

{{title}}

{{title}}

{{title}}

{{title}}

{{title}}

{{editor}}'s edit

{{editor}}'s edit

{{title}}

{{editor}}'s edit

{{editor}}'s edit

Select a reply

Reference Prior Text Responses in Timeline Variable #3124

ggreeley Sep 8, 2023

Replies: 2 comments · 4 replies

ggreeley Sep 8, 2023 Author

jodeleeuw Sep 8, 2023 Maintainer

ggreeley Sep 9, 2023 Author

jodeleeuw Sep 9, 2023 Maintainer

ggreeley Sep 9, 2023 Author

ggreeley Sep 9, 2023 Author

ggreeley
Sep 8, 2023

Replies: 2 comments 4 replies

ggreeley
Sep 8, 2023
Author

jodeleeuw
Sep 8, 2023
Maintainer

ggreeley Sep 9, 2023
Author

jodeleeuw Sep 9, 2023
Maintainer

ggreeley Sep 9, 2023
Author

ggreeley Sep 9, 2023
Author