-
Notifications
You must be signed in to change notification settings - Fork 4
/
mousetracking.html
154 lines (133 loc) · 5.37 KB
/
mousetracking.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
<!DOCTYPE html>
<html>
<head>
<title>Mousetracking</title>
<script src="jspsych-6.0.4/jspsych.js"></script>
<script src="jspsych-6.0.4/plugins/jspsych-mousetracking.js"></script>
<script src="jspsych-6.0.4/plugins/jspsych-survey-text.js"></script>
<script src="jspsych-6.0.4/plugins/jspsych-html-keyboard-response.js"></script>
<script src="jspsych-6.0.4/plugins/jspsych-recenter.js"></script>
<script src="jspsych-6.0.4/plugins/jspsych-instructions.js"></script>
<script src="jspsych-6.0.4/plugins/jspsych-fullscreen.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<link href="jspsych-6.0.4/css/jspsych-mousetracking.css" rel="stylesheet" type="text/css"></link>
</head>
<body></body>
<script>
/*
This is a web-based mousetracking psychology experiment designed by Mahi Luthra.
For smooth functioning of the test, make sure all the associated github files within the repository have been downloaded (especially the folder named 'jspsych-6.0.4').
Results from this test will be automatically downloaded into the downloads folder of your desktop.
For further details, please refer to the README.
*/
file_name = null // file name for data file. if null, a default name consisting of the participant ID and a unique number is chosen.
local = true // save the data file locally.
// If this test is being run online (e.g., on MTurk), true will cause the file to be downloaded to the participant's computer.
// If this test is on a server and you wish to save the data file to that server, change this to false.
// If changed to false ensure that the php file (its in the directory!) and the empty "data" folder have also been appropriately uploaded to the server.
/*create timeline*/
var timeline = [];
var nMain = 5 // number of trials
var test_stimuli = [] // sets up a directory of stimuli
var images = []
for (var i = 1; i <=nMain; i++){
name = "mt_img/anim"+i+".jpg"
images.push(name)
test_stimuli.push({stimulus: name})
console.log(name)
}
/*set up experiment instructions*/
var instructions = {
type: "instructions",
pages: function(){
var pageOne = '<div style="font-size:20px;"><b>INSTRUCTIONS</b><br><br>Welcome to the mousetracking task.<br>Please ensure that you are performing this task on your desktop/laptop and not on any other device.<br>This is a demo for a standard mousetracking task. <br><br>You will be shown a series of animal pictures and asked to evaluate if they are cute or scary<br>Please respond honestly, there are no right or wrong answers.<br><br></div>'
return [pageOne]
},
allow_backward: false,
show_clickable_nav: true,
button_label_next: "Next"
};
/*fixation point*/
var fixation = {
type: 'html-keyboard-response',
stimulus: '<div style="font-size:60px;">+</div>',
choices: jsPsych.NO_KEYS,
trial_duration: 500
}
var decisions = {
type: "mousetracking",
stimulus: jsPsych.timelineVariable('stimulus'),
choices :['cute', 'scary']
} // the mousetracking part of this task occurs in a 1000x600px container-- these dimensions can be altered by changing the jspsych mousetracking plugin in the jspsych folder
var recenter = {
type: "recenter"
} // if altering the dimensions of container in mousetracking plugin, please also do so in the recenter plugin in the jspsych folder
var conclusion = {
type: 'html-keyboard-response',
stimulus: 'Thank you for performing this task.',
choices: jsPsych.NO_KEYS
}
var p_details = {
type:"survey-text",
questions: [{prompt: "Enter subject number"}],
on_finish:function(){
partN = jsPsych.data.get().last(1).values()[0].partNum
partN = partN.replace(/['"]+/g,'')
}
}
function saveData(filename, filedata){
$.ajax({
type:'post',
cache: false,
url: 'save_data.php', // this is the path to the above PHP script
data: {filename: filename, filedata: filedata}
});
};
var IDsub = Date.now()
var dataLog = { // this plugin records data only for the mousetracking trials of the experiment
type: 'html-keyboard-response',
stimulus: " ",
trial_duration: 100,
on_finish: function(data) {
var data1 = jsPsych.data.get().filter([{trial_type: "mousetracking"}]).last(nMain);
if (file_name == null){
file_name = "mousetracking_"+partN+"_"+IDsub.toString()+".csv"}
else{
file_name += ".csv"
}
if (local){
data1.localSave('csv', file_name )
} else {
saveData(file_name, data1.csv());
}
}
}
var test_procedure = {
timeline: [recenter, decisions, fixation],
repetitions: 1, // 1 repition of the images in the folder
timeline_variables: test_stimuli
}
// timeline.push(p_details)
timeline.push({
type: 'fullscreen',
fullscreen_mode: true
});
timeline.push(p_details)
timeline.push(instructions)
timeline.push(test_procedure)
timeline.push(dataLog)
timeline.push({
type: 'fullscreen',
fullscreen_mode: false
});
timeline.push(conclusion)
/* start the experiment */
jsPsych.init({
timeline: timeline,
preload_images: images,
on_finish: function() {
jsPsych.data.displayData(); // remove this on_finish command if you do not want to display data at the end of experiment
}
});
</script>
</html>