forked from msaddler/jspsych_tutorial_960
-
Notifications
You must be signed in to change notification settings - Fork 0
/
1_beginner.html
executable file
·91 lines (80 loc) · 3.55 KB
/
1_beginner.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
<!DOCTYPE html>
<html>
<head>
<title>Beginner</title>
<meta http-equiv="pragma" content="no-cache">
<link rel="icon" href="data:;base64,iVBORw0KGgo=">
<link href="https://unpkg.com/[email protected]/css/jspsych.css" rel="stylesheet" type="text/css" />
<script src="https://unpkg.com/[email protected]"></script>
<script src="https://unpkg.com/@jspsych/[email protected]"></script>
<script src="https://unpkg.com/@jspsych/[email protected]"></script>
<script src="https://unpkg.com/@jspsych/[email protected]"></script>
<script src="https://unpkg.com/@jspsych/[email protected]"></script>
</head>
<body></body>
<script>
// Initialize the jsPsych object (possibly with arguments: https://www.jspsych.org/7.3/reference/jspsych/)
var jsPsych = initJsPsych({
on_finish: function () {
jsPsych.data.displayData(); // Print data to screen at the end
jsPsych.data.get().localSave('json', 'mydata.json'); // Save data to local computer
},
show_progress_bar: true,
});
// Initialize a timeline (just an empty array)
var timeline = [];
// Add some trial objects to the timeline (like appending dictionaries to a Python list)
var first_page = {
type: jsPsychHtmlButtonResponse, // This trial will use the "html-button-response" plugin
stimulus: [
'<h2>Simple image classification experiment</h2>' +
'<p>In this experiment, you will briefly see images of human faces.</p>' +
'<p>Your task is to report if the person pictured was wearing a face mask, ' +
'and if so, were they wearing it correctly?</p>'
],
choices: ['Begin experiment'],
};
timeline.push(first_page);
var trial_0 = {
type: jsPsychImageButtonResponse, // This trial will use the "image-button-response" plugin
stimulus: 'images/condition0/40.png',
maintain_aspect_ratio: true,
stimulus_width: null,
stimulus_duration: null,
prompt: 'Was the person pictured correctly wearing a face mask?',
choices: ['Correctly wearing mask', 'Incorrectly wearing mask', 'Not wearing mask'],
};
timeline.push(trial_0);
var trial_1 = {
type: jsPsychImageButtonResponse, // This trial will use the "image-button-response" plugin
stimulus: 'images/condition1/40.png',
maintain_aspect_ratio: true,
stimulus_width: 300,
stimulus_duration: 500,
prompt: 'Was the person pictured correctly wearing a face mask?',
choices: ['Correctly wearing mask', 'Incorrectly wearing mask', 'Not wearing mask'],
};
timeline.push(trial_1);
var trial_2 = {
type: jsPsychImageButtonResponse, // This trial will use the "image-button-response" plugin
stimulus: 'images/condition2/40.png',
maintain_aspect_ratio: true,
stimulus_width: 300,
stimulus_duration: 500,
prompt: 'Was the person pictured correctly wearing a face mask?',
choices: ['Correctly wearing mask', 'Incorrectly wearing mask', 'Not wearing mask'],
};
timeline.push(trial_2);
var last_page = {
type: jsPsychHtmlButtonResponse, // This trial will use the "html-button-response" plugin
stimulus: [
'<h2>Press the button below to end experiment.</h2>' +
'<p>Thank you for participating!</p>'
],
choices: ['End experiment'],
};
timeline.push(last_page);
// Run the timeline
jsPsych.run(timeline);
</script>
</html>