mirror of
https://github.com/jspsych/jsPsych.git
synced 2025-05-10 19:20:55 +00:00
98 lines
4.4 KiB
HTML
98 lines
4.4 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<meta charset="utf-8" />
|
|
<script src="../jspsych/dist/index.browser.js"></script>
|
|
<script src="./dist/index.browser.js"></script>
|
|
<link rel="stylesheet" href="../jspsych/css/jspsych.css" />
|
|
<link rel="stylesheet" href="css/survey.css" />
|
|
</head>
|
|
<body></body>
|
|
<script type="text/javascript">
|
|
|
|
var jsPsych = initJsPsych({
|
|
on_finish: function() {
|
|
jsPsych.data.displayData();
|
|
}
|
|
});
|
|
|
|
var options = ['Option 1', 'Option 2', 'Option 3', 'Option 4', 'Option 5', 'Option 6'];
|
|
|
|
var survey_trial = {
|
|
type: jsPsychSurvey,
|
|
pages: [
|
|
[
|
|
{type: 'html', prompt: '<p>Here is some arbitrary text via an "html" question type.<br>Similar to preamble but can be inserted anywhere in the question set.</p><p>This trial uses automatic question numbering (continued across pages).</p>'},
|
|
{type: 'text', prompt: 'This is a single-line text question. The correct answer is "hello".', required: true, correct_response: "hello"},
|
|
{type: 'text', prompt: 'This is a multi-line text question.', placeholder: 'This is a placeholder.', textbox_rows: 10, textbox_columns: 40},
|
|
{type: 'text', prompt: 'This is a single-line text question of input_type "number"', input_type: 'number'},
|
|
{type: 'text', prompt: 'This is a single-line text question of input_type "date"', input_type: 'date'},
|
|
],
|
|
[
|
|
{
|
|
type: 'likert',
|
|
prompt: 'This is a likert question prompt.',
|
|
likert_scale_values: [
|
|
{value: 1},
|
|
{value: 2},
|
|
{value: 3}
|
|
],
|
|
likert_scale_min_label: 'Agree',
|
|
likert_scale_max_label: 'Disagree',
|
|
},
|
|
],
|
|
[
|
|
{
|
|
type: 'likert-table',
|
|
prompt: 'Please indicate how much you agree with the following statements:',
|
|
statements: [{prompt: 'I like cats.', name: 'cat'},{prompt: 'I like giraffes.', name: 'giraffe'},{prompt: 'I like antelopes.', name: 'antelope'},{prompt: 'I like lizards.', name: 'lizard'}],
|
|
options: ['A lot', 'Somewhat', 'Not very much'],
|
|
name: 'animals',
|
|
required: true,
|
|
randomize_statement_order: true,
|
|
}
|
|
],
|
|
[
|
|
{
|
|
type: 'ranking', prompt: 'Please order the shapes from your most to least favorite.', options: ['Triangle','Circle','Square'], option_reorder: 'random'
|
|
},
|
|
],
|
|
[
|
|
{
|
|
type: 'drop-down', prompt: 'Which shape do you like the best?', options: ['Triangle','Circle','Square'], add_other_option: true, option_reorder: 'asc', dropdown_select_prompt: 'Select one:', required: true
|
|
}
|
|
],
|
|
[
|
|
{type: 'multi-choice', prompt: 'This is a multi-choice question with options in one column (the default).', options: options},
|
|
{type: 'multi-choice', prompt: 'This is a multi-choice question with options in one row. The correct response is option 5.', options: options, columns: 0, correct_response: "Option 5"},
|
|
{type: 'multi-choice', prompt: 'This is a multi-choice question with options in two columns, with an "other" option.', options: options, columns: 2, add_other_option: true},
|
|
{type: 'multi-select', prompt: 'This is a multi-select question.', options: options},
|
|
{type: 'multi-select', prompt: 'This is a multi-select question with three columns and random option ordering.', options: options, columns: 3, option_reorder: 'random'},
|
|
]
|
|
],
|
|
button_label_next: "Next >",
|
|
button_label_back: "< Back",
|
|
button_label_finish: "Finish!",
|
|
show_question_numbers: 'on',
|
|
required_question_label: "",
|
|
required_error_text: "You forgot to answer this question!"
|
|
};
|
|
|
|
var survey_trial_random = {
|
|
type: jsPsychSurvey,
|
|
pages: [[
|
|
{type: 'text', prompt: 'Question 1.', textbox_rows: 2, textbox_columns: 20},
|
|
{type: 'text', prompt: 'Question 2.'},
|
|
{type: 'text', prompt: 'Question 3.', textbox_columns: 50},
|
|
{type: 'text', prompt: 'Question 4.', textbox_rows: 2},
|
|
{type: 'text', prompt: 'Question 5.'},
|
|
{type: 'text', prompt: 'Question 6.', textbox_rows: 10, textbox_columns: 20},
|
|
]],
|
|
title: 'This is a separate survey trial. The order of questions should be randomized.',
|
|
randomize_question_order: true
|
|
};
|
|
|
|
jsPsych.run([survey_trial, survey_trial_random]);
|
|
</script>
|
|
</html>
|