-
Notifications
You must be signed in to change notification settings - Fork 20
/
Copy pathexperiment.html
executable file
·131 lines (105 loc) · 4.07 KB
/
experiment.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
<!DOCTYPE html>
<html>
<head>
<title>Gambling Experiment</title>
<!-- Load libraries -->
<script src="https://unpkg.com/[email protected]"></script>
<!-- Initialize jsPsych -->
<script src="./js/init-jspsych.js"></script>
<!-- Load jsPsych plug-ins -->
<script src="./js/plugin-prospect-trial.js"></script>
<script src="./js/plugin-prospect-comprehension.js"></script>
<script src="https://unpkg.com/@jspsych/[email protected]"></script>
<script src="https://unpkg.com/@jspsych/[email protected]"></script>
<!-- Load experiment -->
<script src="./json/gambles.json" type="text/javascript" ></script>
<!-- Load CSS styles -->
<link href="https://unpkg.com/[email protected]/css/jspsych.css" rel="stylesheet" type="text/css" />
<link href="./css/task.gamble.min.css" rel="stylesheet" type="text/css"></link>
</head>
<body></body>
<script>
//------------------------------------//
// Section 1: Prepare instructions
//------------------------------------//
var instr = {
type: jsPsychInstructions,
pages: [
"<img src='./img/instr01.png' style='max-width: 75%'></img>",
"<img src='./img/instr02.png' style='max-width: 75%'></img>",
"<img src='./img/instr03.png' style='max-width: 75%'></img>",
"<img src='./img/instr04.png' style='max-width: 75%'></img>",
"<img src='./img/instr05.png' style='max-width: 75%'></img>",
"<img src='./img/instr06.png' style='max-width: 75%'></img>",
"<img src='./img/instr07.png' style='max-width: 75%'></img>",
"<img src='./img/instr08.png' style='max-width: 75%'></img>",
"<img src='./img/instr09.png' style='max-width: 75%'></img>",
"<img src='./img/instr10.png' style='max-width: 75%'></img>",
"<img src='./img/instr11.png' style='max-width: 75%'></img>",
],
show_clickable_nav: true,
button_label_previous: "Prev",
button_label_next: "Next"
}
var comprehension = {
type: jsPsychProspectComprehension
}
var reminder = {
type: jsPsychInstructions,
pages: [
"<img src='./img/instr12.png' style='max-width: 75%'></img>",
],
show_clickable_nav: true,
button_label_previous: "Prev",
button_label_next: "Next"
}
//------------------------------------//
// Section 2: Prepare Gambles
//------------------------------------//
// Load gambles.
var GAMBLES = JSON.parse(GAMBLES);
// Iteratively construct trials.
var trials =[];
GAMBLES.forEach(function (gamble) {
// Define side presentation.
var left = jsPsych.randomization.sampleWithoutReplacement([true,false], 1)[0];
// Define gambling trial.
var trial = {
type: jsPsychProspectTrial,
// Gamble trial data.
pA1: gamble['pA1'], // Gamble A, high value probability
pA2: gamble['pA2'], // Gamble A, low value probability
A1: gamble['A1'], // Gamble A, high value magnitude
A2: gamble['A2'], // Gamble A, low value magnitude
pB1: gamble['pB1'], // Gamble B, high value probability
pB2: gamble['pB2'], // Gamble B, low value probability
B1: gamble['B1'], // Gamble B, high value magnitude
B2: gamble['B2'], // Gamble B, low value magnitude
left: left, // Gamble A on left side
// Gamble trial metadata
data: { ID: gamble['ID'], Domain: gamble['Domain'], Problem: gamble['Problem'] },
};
// Store trial.
trials.push(trial);
});
// Randomize trial order.
var trials = jsPsych.randomization.sampleWithoutReplacement(trials, trials.length);
//------------------------------------//
// Section 3: Present experiment
//------------------------------------//
// Define experiment fullscreen.
var fullscreen = {
type: jsPsychFullscreen,
fullscreen_mode: true
}
// Initialize timeline.
var timeline = [];
timeline = timeline.concat(fullscreen);
timeline = timeline.concat(instr);
timeline = timeline.concat(comprehension);
timeline = timeline.concat(reminder);
timeline = timeline.concat(trials);
// Execute timeline.
jsPsych.run(timeline);
</script>
</html>