-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
482 lines (431 loc) · 24.6 KB
/
index.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
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
423
424
425
426
427
428
429
430
431
432
433
434
435
436
437
438
439
440
441
442
443
444
445
446
447
448
449
450
451
452
453
454
455
456
457
458
459
460
461
462
463
464
465
466
467
468
469
470
471
472
473
474
475
476
477
478
479
480
481
482
<!DOCTYPE html>
<html lang="en" style="background: #C0C0C0;height: 100%;">
<head>
<meta name="viewport" content="width=device-width, initial-scale=1" charset="utf-8" />
<title>Experiment</title>
<script src="jspsych/jspsych.js" type="text/javascript"></script>
<script src="jspsych/jspsych-brms.js" type="text/javascript"></script>
<script src="jspsych/jspsych-survey-likert.js" type="text/javascript"></script>
<script src="jspsych/jspsych-survey-multi-choice.js" type="text/javascript"></script>
<script src="jspsych/jspsych-survey-multi-select.js" type="text/javascript"></script>
<script src="jspsych/jspsych-survey-text.js" type="text/javascript"></script>
<script src="jspsych/jspsych-instructions.js" type="text/javascript"></script>
<script src="jspsych/jspsych-fullscreen.js" type="text/javascript"></script>
<link rel="stylesheet" href="css/jspsych.css" type="text/css">
<script id="functions">
// Shuffle list function
function shuffle(array) {
let currentIndex = array.length,
randomIndex;
// While there remain elements to shuffle...
while (currentIndex != 0) {
// Pick a remaining element...
let randomIndex = Math.floor(Math.random() * currentIndex);
currentIndex--;
// And swap it with the current element.
[array[currentIndex], array[randomIndex]] = [
array[randomIndex], array[currentIndex]
];
}
return array;
}
// Downlowd file function
function download(filename, text) {
let element = document.createElement('a');
element.setAttribute('href', 'data:text/plain;charset=utf-8,' + encodeURIComponent(text));
element.setAttribute('download', filename);
element.style.display = 'none';
document.body.appendChild(element);
element.click();
document.body.removeChild(element);
}
// Create survey trials add 3 quesions in each trial
function getSurveyTrials(survey_type, survey_name, questions, survey_direction, labels) {
let survey_trials = [];
for (let i = 0; i < questions.length; i += 3) {
survey_trials.push({
questions: [{
labels: labels,
prompt: questions[i],
required: true
}, {
labels: labels,
prompt: questions[i + 1],
required: true
}, {
labels: labels,
prompt: questions[i + 2],
required: true
}],
type: survey_type,
direction: survey_direction,
name: survey_name + "_" + i
});
}
return survey_trials;
}
// Create RMS trials
function getRmsTrials(images, choices, block) {
trials = []
// For each image create RMS trial
shuffle(images).forEach(element => {
trials.push({
type: "rms",
// mondrian_max_opacity: 0.1,
stimulus: element,
choices: choices,
// right_up: choices[0],
// left_down: choices[1],
fade_in_time: 1,
response_ends_trial: true,
post_trial_gap: 400,
stimulus_opacity: 0.3,
stimulus_block: block
});
});
return trials;
}
</script>
<script id="rms">
// Create RMS WHERE trials instructions
const rms_instructions = {
pages: [
"Before this next task starts, please adjust your chair and screen in a way that is convenient to you. <br> Make sure you are about 1 feet away from the screen, and not more than 2 feet (somewhere between 30 and 70 centimeters). <br> If needed, please move your chair/screen closer or further away from you.",
"The goal of this task is to understand information processing under visual noise. This task will last 7-10 minutes. ",
"On every round, you will see flashes of colorful squares on the screen, with a '+' sign in the middle of it. <br> Please sit directly in front of the screen and look directly at the '+' sign.",
"After some time, you will see a stimulus appearing behind the colorful squares - the stimuli might be human faces or animals. Your task is to indicate whether the stimulus (face or animal) appeared in the left or right side of the screen, as fast as you can. <br> When you see a stimulus through the squares, please press 'P' if it appears right to the '+' sign; and 'Q' if it appears left to the '+' sign.",
"Next, we will have a short training session. Press 'Next' to start.<br> Remember to look directly on the '+' sign during the study. 'P' = Right 'Q' = Left."
],
show_clickable_nav: true,
type: "instructions",
direction: "ltr",
name: "rms_where_instructions"
};
// Create RMS WHERE main trials instuctions
const rms_main_instructions = {
pages: [
"The training session is over. Press 'Next' to start the task.<br> Remember to look directly on the '+' sign during the study. <b>'P' = Right 'Q' = Left</b>."
],
show_clickable_nav: true,
type: "instructions",
direction: "ltr",
name: "rms_where_main_instructions"
};
const rms_between_blocks_instructions = {
pages: [
"You finished the first part. When you are ready, please proceed to the final part of this task."
],
show_clickable_nav: true,
type: "instructions",
direction: "ltr",
name: "rms_where_between_blocks_instructions"
}
//All Practice stimulus
const imagesPractice = ["images/rms/f42887_e_001.jpg",
"images/rms/f42887_e_001.jpg", "images/rms/f42887_e_001.jpg", "images/rms/f42887_e_001.jpg",
"images/rms/f42887_e_001.jpg", "images/rms/f42887_e_001.jpg", "images/rms/f42887_e_001.jpg",
"images/rms/f42887_e_001.jpg", "images/rms/f42887_e_001.jpg", "images/rms/f42887_e_001.jpg"
];
// All spiders stimulus (40 images for the validation of all of the stimuli)
const imagesMainSpiders = [
"images/spidersWithoutBackground/spider2.png", "images/spidersWithoutBackground/spider3.png",
"images/spidersWithoutBackground/spider4.png", "images/spidersWithoutBackground/spider5.png", "images/spidersWithoutBackground/spider7.png",
"images/spidersWithoutBackground/spider6.png", "images/spidersWithoutBackground/spider8.png", "images/spidersWithoutBackground/spider9.png",
"images/spidersWithoutBackground/spider10.png", "images/spidersWithoutBackground/spider11.png", "images/spidersWithoutBackground/spider12.png",
"images/spidersWithoutBackground/spider13.png", "images/spidersWithoutBackground/spider14.png", "images/spidersWithoutBackground/spider15.png",
"images/spidersWithoutBackground/spider16.png", "images/spidersWithoutBackground/spider17.png", "images/spidersWithoutBackground/spider18.png",
"images/spidersWithoutBackground/spider19.png", "images/spidersWithoutBackground/spider20.png", "images/spidersWithoutBackground/spider21.png",
"images/spidersWithoutBackground/spider22.png", "images/spidersWithoutBackground/spider23.png", "images/spidersWithoutBackground/spider24.png",
"images/spidersWithoutBackground/spider25.png", "images/spidersWithoutBackground/spider26.png", "images/spidersWithoutBackground/spider27.png",
"images/spidersWithoutBackground/spider28.png", "images/spidersWithoutBackground/spider29.png", "images/spidersWithoutBackground/spider30.png",
"images/spidersWithoutBackground/spider31.png", "images/spidersWithoutBackground/spider32.png", "images/spidersWithoutBackground/spider33.png",
"images/spidersWithoutBackground/spider34.png", "images/spidersWithoutBackground/spider35.png", "images/spidersWithoutBackground/spider36.png",
"images/spidersWithoutBackground/spider37.png", "images/spidersWithoutBackground/spider38.png", "images/spidersWithoutBackground/spider39.png",
"images/spidersWithoutBackground/spider41.png", "images/spidersWithoutBackground/spider42.png"
]
// All main task not reverted faces stimulus (20 images)
const imagesMainFaces = [
"images/rms/f42887_e_001.jpg", "images/rms/f42887_e_005.jpg", "images/rms/f42887_e_015.jpg",
"images/rms/f42887_e_025.jpg", "images/rms/f42887_e_028.jpg", "images/rms/f42887_e_053.jpg",
"images/rms/f42887_e_058.jpg", "images/rms/f42887_e_064.jpg", "images/rms/f42887_e_072.jpg",
"images/rms/f42887_e_080.jpg", "images/rms/f42887_e_098.jpg", "images/rms/f42887_e_103.jpg",
"images/rms/f42887_e_121.jpg", "images/rms/f42887_e_127.jpg", "images/rms/f42887_e_140.jpg",
"images/rms/f42887_e_156.jpg", "images/rms/f42887_e_161.jpg", "images/rms/f42887_e_180.jpg",
"images/rms/f42887_e_202.jpg", "images/rms/f42887_e_241.jpg"
]
// Choices for RMS trials (q for left and p for right)
const choices = ["q", "p"];
function get_rms_trials() {
// Create all RMS practice trials
const trainingRmsTrials = getRmsTrials(imagesPractice, choices, "training");
const spiders_trials = getRmsTrials(imagesMainSpiders, choices, "main_spider");
const faces_trials = getRmsTrials(imagesMainFaces, choices, "main_face")
return [
rms_instructions,
...shuffle(trainingRmsTrials),
rms_main_instructions,
...shuffle(spiders_trials),
rms_between_blocks_instructions,
...shuffle(faces_trials)
]
}
</script>
<script id="fsq">
// Create ASRS instructions
const fsq_instructions = {
pages: [
"Thank you for the participation so far. Now, you will be asked to answer TWO surveys. <br><br> <h1>Survey 1</h1> For each item, please indicate how much you agree with the presented statement on a scale of 0 to 7. <br> <strong>0 means: strongly disagree, and 7 means: strongly agree.</strong> <br>Press \"Continue\" to start the survey."
],
show_clickable_nav: true,
type: "instructions",
direction: "ltr",
name: "intro_fsq"
};
const fsq_questions = [
"If I came across a spider now, I would get help from someone else to remove it.",
"Currently, I am sometimes on the lookout for spiders.",
"If I saw a spider now, I would think it will harm me.",
"If you read that, please press the label 3.",
"I now think a lot about spiders.",
"I would be somewhat afraid to enter a room now, where I have seen a spider before.",
"I now would do anything to try to avoid a spider.",
"Currently, I sometimes think about getting bit by a spider.",
"If I encountered a spider now, I wouldn't be able to deal effectively with it.",
"If I encountered a spider now, it would take a long time to get it out of my mind.",
"If I came across a spider now, I would leave the room.",
"If I saw a spider now, I would think it will try to jump on me.",
"If I saw a spider now, I would ask someone else to kill it.",
"If I encountered a spider now, I would have images of it trying to get me.",
"If I saw a spider now, I would be afraid of it.",
"If you read that, please press the label 7.",
"If I saw a spider now, I would feel very panicky.",
"Spiders are one of my worst fears.",
"I would feel very nervous if I saw a spider now.",
"If I saw a spider now, I would probably break out in a sweat and my heart would beat faster."];
const fsq_labels = ["0 - Strongly disagree", "1", "2", "3", "4", "5", "6", "7 - Strongly agree"];
const fsq_survey = getSurveyTrials("survey-likert", "fsq", fsq_questions, "ltr", fsq_labels)
function get_fsq_trials() {
let fsq_trials = [fsq_instructions, ...fsq_survey];
return fsq_trials;
}
</script>
<script id="asrs">
// Create ASRS instructions
const asrs_instructions = {
pages: [
"<h1>Survey 2</h1> For each of the situations described in the following statements, please indicate how much it characterizes you. <br><strong>Use the rating scale in front of you ranging from \"never\" to \"very often\"</strong>"
],
show_clickable_nav: true,
type: "instructions",
direction: "ltr",
name: "intro_ASRS"
};
const asrs_labels = ["never", "rarely", "sometimes", "often", "very often"];
const asrs_inattention_questions = [
"How often do you make careless mistakes when you have to work on a boring or difficult project?",
"How often do you have difficulty keeping your attention when you are doing boring or repetitive work?",
"How often do you have difficulty concentrating on what people say to you, even when they are speaking to you directly?",
"How often do you have trouble wrapping up the fine details of a project, once the challenging parts have been done?",
"How often do you have difficulty getting things in order when you have to do a task that requires organization?",
"When you have a task that requires a lot of thought, how often do you avoid or delay getting started?",
"How often do you misplace or have difficulty finding things at home or at work?",
"How often are you distracted by activity or noise around you?",
"How often do you have problems remembering appointments or obligations?"
];
const asrs_hyperactivity_impulsivity_questions = [
"How often do you fidget or squirm with your hands or your feet when you have to sit down for a long time?",
"How often do you leave your seat in meetings or other situations in which you are expected to remain seated?",
"How often do you feel restless or fidgety?",
"How often do you have difficulty unwinding and relaxing when you have time to yourself?",
"How often do you feel overly active and compelled to do things, like you were driven by a motor?",
"How often do you find yourself talking too much when you are in a social situation?",
"If you read that, please press the label 'rarely'.",
"When you are in a conversation, how often do you find yourself finishing the sentences of the people that you are talking to, before they can finish them themselves?",
"How often do you have difficulty waiting your turn in situations when turn-taking is required?",
"How often do you interrupt others when they are busy?"
];
const asrs_inattention_survey = getSurveyTrials("survey-likert", "asrs_inattention", asrs_inattention_questions, "ltr", asrs_labels)
const asrs_hyperactivity_impulsivity_survey = getSurveyTrials("survey-likert", "asrs_hyperactivity_impulsivity", asrs_hyperactivity_impulsivity_questions, "ltr", asrs_labels)
function get_asrs_trials() {
let asrs_trials = [asrs_instructions, ...asrs_inattention_survey, ...asrs_hyperactivity_impulsivity_survey];
return asrs_trials;
}
</script>
<script id="experiment">
// Create start experiment trials
const start = [{
pages: [
"<h1>Hello!</h1> You are invited to participate in web-based research of meaningful perception. the experiment will take approximately 30 minutes to complete. <br><br><b>PARTICIPATION</b><br>Your participation in this survey is voluntary. You may refuse to take part in the research or exit the survey at any time.<br><br><b>BENEFITS</b><br>You will be compensated with £4.50 for participation in this study (the pricing is £9.00 per hour). <br>Although this study will not benefit you personally, we hope that our results will add to the knowledge about human experiences.",
"<b>RISKS</b><br>There are no foreseeable risks involved in participating in this study other than those encountered in standard use of the device you use to access the survey (computer, smartphone, etc.).<br>Your participation in this study will not include psychological counseling. In the event you seek such services, please contact the center below:<br>National Hopeline Network 1-800-784-2433<br><br><b>CONFIDENTIALITY</b><br>All of your responses will be held in confidence. Only the researchers involved in this study and those responsible for research oversight will have access to the information you provide.<br>The researcher will not know your name, and no identifying information will be connected to your survey answers in any way. The survey is therefore anonymous.",
"<b>CONTACT</b><br>If you have questions at any time about the study or the procedures, you may contact the researcher, Gaya Aran via email at gaya.aran@mai.huji.ac.il<br><br><b>ELECTRONIC CONSENT:</b><br> Please note - clicking on the “Next >” button indicates that:<br>•You have read the above information<br>• You voluntarily agree to participate<br>• You are 18 years of age or older<br>If you do not want to participate please close the window. Your data will not be used either way.",
"We are about to begin. First, please answer the next few questions regarding demographic information. After that, you will be asked to peform computerized task, and answer two more questionnaires."
],
show_clickable_nav: true,
type: "instructions",
direction: "ltr",
name: "start_instructions",
}, {
type: 'fullscreen',
fullscreen_mode: true,
name: "fullscreen_instructions",
}, {
questions: [{
options: ["Male", "Female", "Other"],
prompt: "What gender do you identify as?",
required: true
}, {
options: ["Right", "Left", "I don't know"],
prompt: "What is your dominant hand?",
required: true
}],
type: "survey-multi-choice",
direction: "ltr",
name: "question_start_1"
}, {
questions: [{
rows: 1.0,
columns: 2.0,
value: "",
prompt: "What is your age?",
required: true
}],
type: "survey-text",
direction: "ltr",
name: "age_q"
}, {
questions: [{
rows: 1.0,
columns: 25.0,
value: "",
prompt: "Please enter your Prolific ID.<br>Note, that if you don't include your Prolofoc ID, we may not be able to compensate you:",
required: true
}],
type: "survey-text",
direction: "ltr",
name: "id"
}, {
questions: [{
options: ["Yes", "No"],
prompt: "Have you ever been officially diagnosed with anxiety disorder (e.g., OCD, panic disorder, agoraphobia, specific phobia, social anxiety, generalized anxiety disorder)?",
required: true
}],
type: "survey-multi-choice",
direction: "ltr",
name: "anxiety_1"
}, {
questions: [{
options: ["Panic disorder", "Social anxiety", "Specific phobia", "Generalized Anxiety Disorder (GAD)", "Obsessive Compulsive Disorder (OCD)", "Other"],
prompt: "If you were officially diagnosed with anxiety disorder, what was the diagnosis? (If you were not diagnosed, please skip this question by pressing the \"continue\" button)",
required: false
}],
type: "survey-multi-choice",
direction: "ltr",
name: "anxiety_2"
}, {
questions: [{
labels: ["1", "2", "3", "4", "5", "6", "7"],
prompt: "If you were not officially diagnosed with anxiety disorder, what is your suspicion level that you have anxiety disorder (of any kind)?, " +
"where 1 is \"I am sure I don't have anxiety disorder\" and 7 is \"I am sure I have anxiety disorder\".<br>" +
"If you were officially diagnosed with anxiety disorder, please select 1.",
required: true
}],
type: "survey-likert",
direction: "ltr",
name: "anxiety_3"
}, {
questions: [{
options: ["Some high school, no diploma", "High school graduate, diploma or the equivalent (for example: GED)", "Bachelor's Degree", "Master's Degree", "Ph.D.", "Trade/technical/vocational training", "Prefer not to answer"],
prompt: "What is the highest degree or level of school you have completed? (If currently enrolled, highest degree received)",
required: true
}],
type: "survey-multi-choice",
direction: "ltr",
name: "education"
}, {
questions: [{
rows: 1.0,
columns: 2.0,
value: "",
prompt: "What is your mother tongue (e.g., English, Spanish)?",
required: true
}],
type: "survey-text",
direction: "ltr",
name: "language_q"
}];
// Create end experimnt trials
const end = [{
questions: [{
labels: [
"1",
"2",
"3",
"4",
"5"
],
prompt: "And now, a few last questions. <br>From 1 to 5, how clear was the task with the flickering squares to you?",
required: true
}],
type: "survey-likert",
direction: "ltr",
name: "LAST_1"
}, {
questions: [{
options: [
"Yes",
"No"
],
prompt: "Did you have any strategy?",
required: true
}],
type: "survey-multi-choice",
direction: "ltr",
name: "LAST_2"
}, {
questions: [{
rows: 7.0,
columns: 7.0,
value: "",
prompt: "If you did, what was the strategy?",
required: true
}],
type: "survey-text",
name: "LAST_3"
}, {
pages: [
"<strong>Thank you for participating in this experiment!<strong> <br>Please press <strong>\"next\"</strong> in order to end your participation and for your data to be saved. <br>For any questions, you can contact us via e-mail: gaya.aran@mail.huji.ac.il."
],
show_clickable_nav: true,
type: "instructions",
direction: "ltr",
name: "end_instructions",
choices: ['next']
}];
const all_rms_trials = get_rms_trials();
const all_fsq_trials = get_fsq_trials();
const all_asrs_trials = get_asrs_trials();
let experiment_timeline = [
...start,
...all_rms_trials,
...all_fsq_trials,
...all_asrs_trials,
...end
];
// experiment_timeline = get_rms_trials();
// Init experiment (and run it)
jsPsych.init({
timeline: experiment_timeline,
fullscreen: true,
on_finish: function () {
document.exitFullscreen();
// Download subject data as .csv file
download("data.csv", jsPsych.data.get().csv());
}
});
// What do we need to verify?
// . Fix in the instructions the time and consempation according to the reality check.
// . The RMS doesn't work properly.
// . Full screen doesn't work right now (?)
</script>
</head>
</html>