-
Notifications
You must be signed in to change notification settings - Fork 1
/
Week10-Surveys.html
executable file
·140 lines (109 loc) · 3.94 KB
/
Week10-Surveys.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
<!DOCTYPE html>
<html>
<head>
<title>Week 10: Surveys</title>
<!-- Load JS psych -->
<script src="jspsych-7.2/jspsych.js"></script>
<!-- Load all the plugins we will be using today -->
<script src="jspsych-7.2/plugin-html-keyboard-response.js"></script>
<script src="jspsych-7.2/plugin-html-button-response.js"></script>
<script src="jspsych-7.2/plugin-survey.js"></script>
<script src="jspsych-7.2/plugin-survey-likert.js"></script>
<script src="jspsych-7.2/plugin-survey-html-form.js"></script>
<script src="jspsych-7.2/plugin-survey-multi-choice.js"></script>
<script src="jspsych-7.2/plugin-survey-text.js"></script>
<!-- Load jspsych's default CSS -->
<link href="jspsych-7.2/jspsych.css" rel="stylesheet" type="text/css"></link>
</head>
<body>
</body>
<script>
// Overview of jspsych plugins: https://www.jspsych.org/plugins/overview/
// A foreword:
// 90% of the time you will not know how to do a programming thing.
// Maybe you forgot it or never knew it.
// The more important skill is knowing how to search for the solution..
// Initialize jsPsych
var jsPsych = initJsPsych({
on_finish: function() {
jsPsych.data.displayData();
}
});
// Define an empty timeline array
var timeline = [];
/*/ Define the trial variables /*/
var welcome = {
type: jsPsychHtmlKeyboardResponse,
stimulus: `Welcome to the study!<p>
We would like you to answer a few simple questions.<p>
<p>Press ENTER to begin.`,
choices: ['enter']
};
timeline.push(welcome)
// Initialize counter variable
var count = 0
var timeLimit = 5000
// Demographics
var gender = {
type: jsPsychSurveyMultiChoice,
questions: [{prompt: "What is your gender?", name: "gender",required: true, options: ["Man","Woman","Other","I prefer not to say"]}],
on_finish: function () {
gender_obj = jsPsych.data.get().last(1).values()[0].response
subject_gender = gender_obj['gender']
jsPsych.data.addDataToLastTrial({gender: subject_gender})
}
};
var age = {
type: jsPsychSurveyText,
questions: [{prompt: "What is your age in years?", name: "age", placeholder: 25,required: true}],
on_finish: function () {
age_obj = jsPsych.data.get().last(1).values()[0].response
subject_age = age_obj['age']
jsPsych.data.addDataToLastTrial({age: subject_age})
}
};
timeline.push(gender,age)
var cat_dog_text = `
Please rate how much you like the following animals on the scales below.
`
var rating_scale = [
"0 (Not At All)","1","2","3","4","5","6","7","8","9","10 (Extremely Much)"
];
const survey_qn = {
prompt: "prompt",
name: "name",
labels: rating_scale,
required: true
};
const qn_1 = Object.create(survey_qn);
const qn_2 = Object.create(survey_qn);
cat_dog_array = ["cats","dogs"]
qn_1.prompt = cat_dog_array[0]; qn_1.name = cat_dog_array[0];
qn_2.prompt = cat_dog_array[1]; qn_2.name = cat_dog_array[1];
// Show an image of a cat or a dog, with response buttons.
var cat_dog_qn = {
type: jsPsychSurveyLikert,
preamble: function() {
return '<div style="width:850px;">'+cat_dog_text+'</div>'
},
questions: function () {
return [qn_1, qn_2 ]
},
randomize_question_order: true,
on_finish: function(data) {
prediction_obj = jsPsych.data.get().last(1).values()[0].response
cat_prediction = prediction_obj['cats']
dog_prediction = prediction_obj['dogs']
qn_order = jsPsych.data.get().last(1).values()[0].question_order
jsPsych.data.addDataToLastTrial({
cat_prediction: cat_prediction,
dog_prediction: dog_prediction,
order: qn_order[0]
})
}
}
timeline.push(cat_dog_qn)
/*/ Run the timeline /*/
jsPsych.run(timeline);
</script>
</html>