-
Notifications
You must be signed in to change notification settings - Fork 0
Home
Here is a quick rundown of what each file in this template does:
This file handles jsPsych initialization and data saving.
It creates a random session ID to associate with the save file.
After the last trial ends or the study is aborted, it will show a completion or failure message depending on the state of the complete variable. The participant will be redirected back to Prolific with a completion or custom failure code (which can be customized in config.js). If DEBUG_SAVE is set to true in config.js, then the data will be saved to your computer and you will not be redirected. Otherwise, the data will be saved to folder called data on the server using the write_data.php script (which will not work if not running on a web server).
This file handles trials and timelines.
It declares five trials. The first is screenerTrial, which uses the jsPsychSurvey plugin. It asks two simple screener questions and aborts the study if either question is failed.
The sceond is sampleTrial, which uses the jsPsychHtmlButtonResponse plugin. It displays a message and multiple buttons to click.
The third is sampleSurveyTrial, which uses the jsPsychSurvey plugin. It reads its content from content.js, which you can read about in the next section.
The fourth is demographicsTrial, which uses the jsPsychSurvey plugin. It asks 3 demographic questions and asks for optional feedback.
The fifth is completionTrial, which uses the jsPsychSurvey plugin. It thanks the participant for completing the study and provides a button to return to Prolific. This is a critical trial that sets the complete variable to true, indicating to init.js that the study was completed sucessfully and data should be saved. It also adds the Prolific ID and the study start/end time to the data.
A sample debug print is included in this template. It will print a message to the browser console, but only if DEBUG_LOGS is true in config.js. You can view the browser console on Chrome or Safari by right clicking anywhere on the page and clicking "Inspect" or "Inspect Element", then click on the console tab. You can also use Ctrl+Shift+I (Windows) / Command+Option+I (Mac).
The timeline is created at the end of the file. Trials are added to the timeline in the order that they will appear, then the timeline is run. You must add any new trials you declare to the timeline in order for them to appear in the study. When testing parts of your study, you may find it useful to comment out some trials to skip past them.
This file stores content for SurveyJS trials. Check the README to learn more about using the SurveyJS survey builder website to easily create this content.
This file stores configuration options.
COMPLETION_LINK is the link participants will be redirected to upon completing the study. It should contain the Prolific completion code for the study.
FAILURE_LINK is the link participants will be redirected to upon failing the screener. If desired, you can make a custom failure code on Prolific so the participant cannot retake the study.
DEBUG_LOGS can be set to true or false. Use an if statement to check if this variable is true before printing messages to the console to ensure participants can't see them (they are unlikely to check the browser console, but they could, so it's better to hide these prints). Ensure this is false before sending the study to actual participants.
DEBUG_SAVE can be set to true or false. If true, data will be saved locally to your computer at the end of the study, which is useful for testing without a server. Ensure this is false before sending the study to actual participants.
You are encouraged to add your own config options! Any value that you want to be easy to change should be declared here. To use that variable in another file, simply do config.variableName. Make sure the file imports config with import { config } from './config.js'; first.
This file imports JS scripts and CSS styles.
When you run your study, this is the file the browser starts with. To use any jsPsych plugin, you must first import it here so the browser knows it exists. If you add a new CSS file, you must also import it here.
This file receives requests to save data to the server.
When a participant completes the study, init.js sends out a request to save the data to the server. This file receives that request and saves the file in a folder called data folder. You can change which folder it saves to by changing $dir = "../data";. This script will run automatically on a properly configured web server, so you should never have to run it manually.