-
Notifications
You must be signed in to change notification settings - Fork 0
/
RCperu.html
480 lines (434 loc) · 22.2 KB
/
RCperu.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
<!-- TO DO -->
<!-- WINDOW RESTRICTION! -->
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>exp</title>
<script src="jspsych-6.0.3/jspsych.js"></script>
<script src="jspsych-6.0.3/plugins/jspsych-fullscreen.js"></script>
<script src="jspsych-6.0.3/plugins/jspsych-html-button-response.js"></script>
<script src="jspsych-6.0.3/plugins/jspsych-survey-likert.js"></script>
<script src="jspsych-6.0.3/plugins/jspsych-survey-text.js"></script>
<script src="jspsych-6.0.3/plugins/jspsych-survey-multi-choice.js"></script>
<script src="js/jspsych-html-mouse-response.js"></script>
<script src="js/jquery.min.js"></script>
<script src="js/lodash.min.js"></script>
<script src="js/firebase.js"></script>
<link href="jspsych-6.0.3/css/jspsych.css" rel="stylesheet" type="text/css">
<style>
body {
cursor: default;
}
.rcimg-12 {
cursor: pointer;
}
.rcimg-12 {
margin: 10px;
}
.rcimg-12:hover {
box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}
.jspsych-content-wrapper {
width: 750px;
height: 600px;
}
#jspsych-survey-likert-next {
margin: 15px 0px 15px 0px;
}
label.jspsych-survey-likert-statement {
padding: 25px 0px 0px 0px;
}
ul.jspsych-survey-likert-opts {
padding: 0px 0px 20px 0px;
}
</style>
</head>
<body></body>
<script>
/* Parameters */
var numOfPairsRC12 = 300; // Total number of pair images images (inv & ori)
var qlink = 'https://uclpsychology.co1.qualtrics.com/jfe/form/SV_0udRZi3ThwbXoEt';
var gitImg = "https://matschmitz.github.io/noisyFaces/noisyFacesPeru/";
/* Initial variables */
var timeline = [];
var preloadimages = [];
var id = jsPsych.data.getURLVariable("id");
// Check browser ---------------------------------------------------------------------------------------------------------
var isChrome = !!window.chrome && (!!window.chrome.webstore || !!window.chrome.runtime);
var isFirefox = typeof InstallTrigger !== 'undefined';
var browserInst = "";
if (!isChrome && !isFirefox) {
browserInst += "</br></br><span style='color:#8e1d1d'>Le recomendamos volver a cargar esta página en Google Chrome ";
browserInst += "o Mozilla Firefox para evitar todo problema ténico.</span>";
}
// Consent ---------------------------------------------------------------------------------------------------------------
/* Fullscreen mode */
var activeFullscreen = {
message: function () {
html = "";
html += "<h1>Consentimiento informado</h1>";
html += "<p class='justify'>";
html += "Estamos realizando una investigación en psicología social a cargo de Mathias Schmitz, ";
html += "miembro del <b>Grupo de Psicología Política y Social de la PUCP</b>. Con esa finalidad, ";
html += "le pedimos su colaboración con el llenado de este cuestionario de aproximadamente ";
html += "<b>10 minutos de duración</b>. Solo pueden participar peruanos y peruanas mayores de 18 años.</br></br>";
html += "El cuestionario busca conocer sus opiniones personales, es decir que no existen ";
html += "respuestas correctas o incorrectas. Es anónimo y garantizamos que la información que nos brinde será ";
html += "trabajada de manera confidencial y sólo con fines académicos. ";
html += "La participación es voluntaria y no implica riesgos.</br></br>";
html += "Agradecemos de antemano su colaboración y ante cualquier duda o comentario puede contactarse al ";
html += "siguiente correo electrónico: [email protected]";
html += browserInst;
html += "</p>";
return html;
},
button_label: "Entiendo el consentimiento informado y deseo participar en este estudio",
type: 'fullscreen',
fullscreen_mode: true,
delay_after: 200,
};
// RC ---------------------------------------------------------------------------------------------------------------
/* Generate RC trials */
var RC12_stim = [];
var imgsRC12 = _.range(1, numOfPairsRC12 + 1); // generate numerical sequence
imgsRC12 = imgsRC12.map(function (e) { return [gitImg + 'faceOri' + e + '.png', gitImg + 'faceInv' + e + '.png'] });
imgsRC12 = _.shuffle(imgsRC12); // shuffle, but keep
imgsRC12 = _.flattenDeep(imgsRC12);
preloadimages = imgsRC12;
imgsRC12 = _.chunk(imgsRC12, 12); // 100 trials (6 ori + 6 anti = 12 faces per trial)
imgsRC12.map(function (e) { RC12_stim.push({ trialImgs: e }) });
var RCinst = {
type: "html-button-response",
post_trial_gap: 300,
choices: ['empezar'],
stimulus: function () {
var html = "";
html += "<h1>Selección de rostros</h1>";
html += "<p class = 'justify'>A continuación, varios rostros le serán presentados. ";
html += "Usted notará que estos rostros se ven borrosos y son similares entre sí, ";
html += "pero en realidad son diferentes.</br></br>";
html += "En total usted deberá completar 50 ensayos. En cada uno de ellos, se le pedirá que:</br>";
html += '<i><b>Seleccione el rostro que se parezca más al de un "agresor sexual"</b></i>.</br></br>';
html += "Utilice el mouse (o mousepad) para hacer su selección. ";
html += "Tome en cuenta que la mayoría de participantes tarda aproximadamente ";
html += "<b>5 segundos</b> para elegir cada rostro. Trate de mantener un tiempo similar. ";
html += "Lo mejor es que usted seleccione los rostros de manera <b>intuitiva</b>.</br></br>";
html += "Por favor trate de mantenerse concentrado.</p>";
return html;
}
};
/* RC */
var i = 1;
var RC = {
timeline_variables: RC12_stim,
repetitions: 1,
randomize_order: true,
timeline: [{
type: 'html-mouse-response',
stimulus: function () {
html = "";
html += '<p style="margin:0">Seleccione el rostro que se parezca más al de un "<b>agresor sexual</b>":</p>';
jsPsych.timelineVariable('trialImgs', true).map(function (e) {
html += "<img class='rcimg-12' src='" + e + "'>";
});
html += '<p style="margin:0">Ensayo:' + i + '/50</p>';
i += 1;
return html;
},
on_load: function () { $('.jspsych-content').css({ "max-width": "100%" }); },
on_finish: function () { $('.jspsych-content').css({ "max-width": "90%" }); },
}]
};
var likerPreamble = '<p class = "justify">Por favor indique su grado de acuerdo con respecto a los enunciados que se ' +
'le presentan a continuación. Para responder, utilice la siguiente escala que va desde ' +
'1 = “totalmente en desacuerdo” hasta 7 = “totalmente de acuerdo”</p>';
var scale = ["1</br>Totalmente en desacuerdo", "2", "3", "4", "5", "6", "7</br>Totalmente de acuerdo"];
var itemsMitos = [
'La violencia sexual se da sólo cuando se fuerza a otra persona a tener relaciones sexuales.',
'La violencia sexual siempre implica un contacto físico.',
'La única forma de que un hombre sea víctima de violencia sexual es estando inconsciente, ya que de otra forma podría defenderse.',
'Una mujer tiene cierta responsabilidad de ser víctima de violencia sexual si usa ropa seductora(faldas cortas, escotes, ropa apretada), pues está provocando a los hombres.',
'Una mujer tiene cierta responsabilidad de ser víctima de violencia sexual si está coqueteando con un hombre.',
'Una mujer tiene cierta responsabilidad de ser víctima de violencia sexual si camina sola por lugares oscuros y peligrosos.',
'Una mujer tiene cierta responsabilidad de ser víctima de violencia sexual si no se aleja del agresor después de una experiencia de violencia.',
'Las víctimas de violencia sexual son personas sumisas que no saben defenderse.',
'La razón por la que algunas personas cometen actos de violencia sexual es porque antes han sido víctimas de ello.',
'Los hombres tienen impulsos sexuales que, bajo el efecto del alcohol, son difíciles de controlar por eso pueden agredir sexualmente a otra persona.',
'La violencia sexual se presenta, sobretodo, en los estratos socioeconómicos bajos, ya que existe menos educación.',
'Los hombres que son víctimas de violencia sexual suelen ser o parecer homosexuales.',
'La violencia sexual tiene menos consecuencias psicológicas para un hombre que para una mujer.',
'Los silbidos y piropos en la calle no son violencia sexual.',
'Un silbido o sonido de besos son siempre halagos para la persona que los recibe.',
'Una mujer no podría agredir sexualmente a un hombre, pues no tiene la fuerza suficiente.',
'Una mujer no tiene necesidad de agredir sexualmente a un hombre, ya que los hombres siempre están dispuestos a tener relaciones sexuales.',
'Una mujer solo sería capaz de realizar actos de violencia sexual si antes ha sido víctima.',
'La única consecuencia que puede existir para un hombre que ha sido víctima de violencia sexual es la pérdida de su orgullo.',
'El acoso sexual callejero solo es violencia sexual cuando hay un contacto físico (ej. tocamientos indebidos).',
'Los insultos o comentarios sexuales pueden tener un impacto negativo en la otra persona, pero no lo suficiente como para considerarlo un acto de violencia sexual.',
'Aquellas personas que realizan actos de violencia sexual tienen enfermedades mentales.',
'Las mujeres que realizan actos de violencia sexual suelen ser lesbianas que adoptar el papel “activo” en una relación.'
];
var questionsMitos = [];
itemsMitos.map(function (item, i) { questionsMitos.push({ prompt: '<i>' + item + '</i>', labels: scale, required: true }); });
var mitos = {
type: 'survey-likert',
preamble: likerPreamble,
questions: questionsMitos,
post_trial_gap: 300,
button_label: 'continuar',
on_load: function () {
$(".jspsych-content-wrapper").css("height", "auto");
$(".jspsych-content-wrapper").scrollTop(0);
},
on_finish: function (data) {
$(".jspsych-content-wrapper").css("height", "600px");
var parsed_response = JSON.parse(data.responses);
data.scale = 'mitos';
data.mitos_1 = parsed_response.Q0 + 1;
data.mitos_2 = parsed_response.Q1 + 1;
data.mitos_3 = parsed_response.Q2 + 1;
data.mitos_4 = parsed_response.Q3 + 1;
data.mitos_5 = parsed_response.Q4 + 1;
data.mitos_6 = parsed_response.Q5 + 1;
data.mitos_7 = parsed_response.Q6 + 1;
data.mitos_8 = parsed_response.Q7 + 1;
data.mitos_9 = parsed_response.Q8 + 1;
data.mitos_10 = parsed_response.Q9 + 1;
data.mitos_11 = parsed_response.Q10 + 1;
data.mitos_12 = parsed_response.Q11 + 1;
data.mitos_13 = parsed_response.Q12 + 1;
data.mitos_14 = parsed_response.Q13 + 1;
data.mitos_15 = parsed_response.Q14 + 1;
data.mitos_16 = parsed_response.Q15 + 1;
data.mitos_17 = parsed_response.Q16 + 1;
data.mitos_18 = parsed_response.Q17 + 1;
data.mitos_19 = parsed_response.Q18 + 1;
data.mitos_20 = parsed_response.Q19 + 1;
data.mitos_21 = parsed_response.Q20 + 1;
data.mitos_22 = parsed_response.Q21 + 1;
data.mitos_23 = parsed_response.Q22 + 1;
},
};
var itemsSexismo = [
'Es obligación de un hombre mantener a salvo a las mujeres de su casa.',
'Las mujeres se visten provocativamente para obtener ventajas en el trabajo.',
'En momentos difíciles, las mujeres son mucho más solidarias que los hombres.',
'Un hombre debe hacer todo lo posible con tal de conservar a la mujer que ama.',
'Un hombre debe establecer límites claros a las mujeres de su casa.',
'Las mujeres se visten provocativamente cuando quieren conseguir algún favor de los hombres.',
'Para que una mujer esté segura, debe permitir que un hombre la proteja.',
'La seguridad de una mujer es responsabilidad de los hombres que la acompañan.',
'Si he de tener un jefe prefiero que sea hombre a que sea mujer.',
'Un hombre debe señalar a la mujer sus errores para que los cambie.',
'Las mujeres son más honradas que los hombres.',
'Si tuviera que contratar a un ingeniero preferiría que fuera varón.',
'Un hombre sólo puede compartir sus miedos con la mujer que ama.',
'Las mujeres deben aceptar la protección masculina por su propio bien.',
'Las mujeres acostumbran seducir a los hombres para controlarlos.',
'Los hombres que no tienen a una mujer a su lado son tristes y solitarios.',
'Un hombre debe hacer hasta lo imposible para conquistar a la mujer que quiere.',
'Los hombres deben impedir que las mujeres corran cualquier riesgo.',
'Las mujeres, como jefas, son más fáciles de manipular que los hombres.',
'No votaría por una mujer para presidente.',
'El hombre de la casa debe vigilar que las mujeres no malgasten el dinero.',
'Las mujeres actúan como niñas para evitar que los hombres se enojen.',
'En momentos difíciles, las mujeres se sacrifican mucho más que los hombres.',
'La ternura es una de las mejores cualidades femeninas.'
];
var questionsSexismo = [];
itemsSexismo.map(function (item) { questionsSexismo.push({ prompt: '<i>' + item + '</i>', labels: scale, required: true }); });
var sexismo = {
type: 'survey-likert',
preamble: likerPreamble,
questions: questionsSexismo,
post_trial_gap: 300,
button_label: 'continuar',
on_load: function () {
$(".jspsych-content-wrapper").css("height", "auto");
$(".jspsych-content-wrapper").scrollTop(0);
},
on_finish: function (data) {
$(".jspsych-content-wrapper").css("height", "600px");
var parsed_response = JSON.parse(data.responses);
data.scale = 'sexismo';
data.sexismo_1 = parsed_response.Q0 + 1;
data.sexismo_2 = parsed_response.Q1 + 1;
data.sexismo_3 = parsed_response.Q2 + 1;
data.sexismo_4 = parsed_response.Q3 + 1;
data.sexismo_5 = parsed_response.Q4 + 1;
data.sexismo_6 = parsed_response.Q5 + 1;
data.sexismo_7 = parsed_response.Q6 + 1;
data.sexismo_8 = parsed_response.Q7 + 1;
data.sexismo_9 = parsed_response.Q8 + 1;
data.sexismo_10 = parsed_response.Q9 + 1;
data.sexismo_11 = parsed_response.Q10 + 1;
data.sexismo_12 = parsed_response.Q11 + 1;
data.sexismo_13 = parsed_response.Q12 + 1;
data.sexismo_14 = parsed_response.Q13 + 1;
data.sexismo_15 = parsed_response.Q14 + 1;
data.sexismo_16 = parsed_response.Q15 + 1;
data.sexismo_17 = parsed_response.Q16 + 1;
data.sexismo_18 = parsed_response.Q17 + 1;
data.sexismo_19 = parsed_response.Q18 + 1;
data.sexismo_20 = parsed_response.Q19 + 1;
data.sexismo_21 = parsed_response.Q20 + 1;
data.sexismo_22 = parsed_response.Q21 + 1;
data.sexismo_23 = parsed_response.Q22 + 1;
data.sexismo_24 = parsed_response.Q23 + 1;
},
};
var op = {
type: 'survey-likert',
preamble: '<p class = "justify">' +
'En general, en términos de orientación o simpatías políticas, la gente se ubica ' +
'en un continuo que va desde la <i>Izquierda</i> hasta la <i>Derecha</i>. ' +
'Quisiéramos que haga el ejercicio para ubicarse usted mismo en ese continuo según ' +
'la siguiente escala donde: 1 = "De izquierda" y 7 = "De derecha".</p>',
questions: [{
prompt: '',
labels: ["1</br>Orientación política de izquierda", "2", "3", "4", "5", "6", "7</br>Orientación política de derecha"],
required: true,
}],
post_trial_gap: 300,
button_label: 'continuar',
on_finish: function (data) {
jsPsych.data.addProperties({
op: JSON.parse(data.responses).Q0 + 1,
});
console.log(JSON.parse(data.responses).Q0 + 1);
},
};
var age = {
timeline: [{
type: 'survey-text',
questions: [{ prompt: "Indique su edad:", rows: 1, columns: 10 }],
button_label: "continuar",
}],
loop_function: function (data) {
var age = data.values()[0].responses;
var age = JSON.parse(age).Q0;
if (age == "") {
alert("Por favor indique su edad");
return true;
}
},
on_finish: function (data) {
jsPsych.data.addProperties({
age: JSON.parse(data.responses).Q0,
});
},
};
var genderOptions = ['masculino', 'femenino', 'otro'];
var gender = {
type: 'survey-multi-choice',
questions: [{ prompt: "Indique su género:", options: genderOptions, required: true }],
button_label: "continuar",
on_finish: function (data) {
jsPsych.data.addProperties({
gender: JSON.parse(data.responses).Q0,
});
console.log(data);
},
};
var sesOptions = ["alto", "medio alto", "medio", "medio bajo", "bajo"];
var ses = {
type: 'survey-multi-choice',
questions: [{ prompt: "Indique su nivel socio-económico:", options: sesOptions, required: true }],
button_label: "continuar",
on_finish: function (data) {
jsPsych.data.addProperties({
ses: JSON.parse(data.responses).Q0,
});
console.log(data);
},
};
var exitFullscreen = {
type: 'fullscreen',
fullscreen_mode: false,
delay_after: 300,
};
var debriefing = '' +
'<span style="color:#cc3300; font-weight: bold">Fin de la encuesta</span></br></br>' +
'<p class = "justify">' +
'El objetivo general de este estudio es analyzar la forma en que las personas se representan ' +
'a los agresores sexuales. Le pedimos no divulgar el objetivo de este estudio con otros participantes ' +
'ya que ello podría afectar los resultados de este estudio.</br></br>' +
'No dude en contactarnos ([email protected]) si tiene alguna ' +
'pregunta o comentario respecto a este estudio.</br></br>' +
'</p>' +
'<span style="color:#cc3300; font-weight: bold">¡Muchas gracias por su participación!</span>';
/* ~~~~~~~~~~~~~~~~ TIMELINES ~~~~~~~~~~~~~~~~ */
timeline.push(activeFullscreen);
timeline.push(RCinst);
timeline.push(RC);
timeline.push(mitos);
timeline.push(sexismo);
timeline.push(op);
timeline.push(age);
timeline.push(gender);
timeline.push(ses);
timeline.push(exitFullscreen);
/* ~~~~~~~~~~~~~~~~ INIT ~~~~~~~~~~~~~~~~ */
jsPsych.init({
timeline: _.flattenDeep(timeline),
preload_images: preloadimages,
max_load_time: 10000 * 900,
exclusions: {
min_width: 750,
min_height: 600,
},
on_interaction_data_update: function (data) {
// console.log(JSON.stringify(data))
},
on_finish: function (data) {
$("#jspsych-content").html("<img src='img/loading.gif'>");
/* Initialize Firebase */
var config = {
apiKey: "AIzaSyD4r9uWI4icto61fm2tC9neKdEiOUWzMJ8",
databaseURL: "https://biatw-68fe6.firebaseio.com/"
};
firebase.initializeApp(config);
var database = firebase.database();
// if no id provided, generate a new id
if (id == null) { id = jsPsych.randomization.randomID(15) };
/* Qualtrics url parameters */
qlink += "?id=" + id;
qlink += "&windWidth=" + window.innerWidth || document.documentElement.clientWidth || document.body.clientWidth;
qlink += "&windHeight=" + window.innerHeight || document.documentElement.clientHeight || document.body.clientHeight;
qlink += "&screenWidth=" + screen.width || 0;
qlink += "&screenHeight=" + screen.height || 0;
qlink += "&userAgent=" + navigator.userAgent;
qlink += "&totalTime=" + jsPsych.totalTime();
/* jsPsych: add data to every trial */
jsPsych.data.addProperties({
id: id
});
var dataRC = data.filter({ trial_type: 'html-mouse-response' }).csv();
var dataMitos = data.filter({ scale: 'mitos' }).csv();
var dataSexismo = data.filter({ scale: 'sexismo' }).csv();
// jsPsych.data.displayData();
/* Send data to Firebase */
database
.ref("RCperu/RC/" + id + "/")
.update({ dataRC })
.then(function () {
console.log("RC sent!");
database
.ref("RCperu/mitos/" + id + "/")
.update({ dataMitos })
.then(function () {
console.log("dataMitos sent!");
database
.ref("RCperu/sexismo/" + id + "/")
.update({ dataSexismo })
.then(function () {
console.log("Data dataSexismo sent!");
$("#jspsych-content").html(debriefing);
});;
});;
});;
}
});
</script>
</html>