HoshinoKoji/jsPsych
1
0
Fork 0
mirror of https://github.com/jspsych/jsPsych.git synced 2025-05-11 16:18:11 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

click pic go plug_in

Browse Source
This commit is contained in:
Xiaolu Bai 2017-01-16 18:23:10 -08:00
parent 784751b3a3
commit 6b0f5ebd90
5 changed files with 167 additions and 19 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
jspsych.js
View File

@ -186,7 +186,6 @@ window.jsPsych = (function() {
};
core.getDisplayElement = function() {
console.log("yo in getDisplayElement", DOM_target);
return DOM_target;
};

2
plugins/jspsych-html.js
View File

@ -80,7 +80,7 @@ jsPsych.plugins.html = (function() {
var key_listener = function(e) {
if (e.which == trial.cont_key) finish();
};
display_element.attachEventListener('keydown', key_listener);
display_element.addEventListener('keydown', key_listener);
}
});
};

23
plugins/jspsych-survey-multi-choice.js
View File

@ -82,10 +82,8 @@ jsPsych.plugins['survey-multi-choice'] = (function() {
// form element
var trial_form_id = _join(plugin_id_name, "form");
console.log("trial_form_id", trial_form_id)
display_element.innerHTML += '<form id="'+trial_form_id+'"></form>';
var trial_form = display_element.querySelector("#" + trial_form_id);
console.log("trial_form", trial_form)
// show preamble text
var preamble_id_name = _join(plugin_id_name, 'preamble');
trial_form.innerHTML += '<div id="'+preamble_id_name+'" class="'+preamble_id_name+'">'+trial.preamble+'</div>';
@ -116,11 +114,12 @@ jsPsych.plugins['survey-multi-choice'] = (function() {
// add label and question text
var option_label = '<label class="' + plugin_id_name + '-text">' + trial.options[i][j] + '</label>';
display_element.querySelector(option_id_selector).innerHTML += option_label;
console.log("option label", option_label)
// create radio button
var input_id_name = _join(plugin_id_name, 'response', i);
display_element.querySelector(option_id_selector + " label").innerHTML =
'<input type="radio" name="'+ input_id_name + '" value="' + trial.options[i][j] + '">' +
'<input type="radio" name="' + input_id_name + '" value="' + trial.options[i][j] + '">' +
display_element.querySelector(option_id_selector + " label").innerHTML;
}
@ -129,7 +128,7 @@ jsPsych.plugins['survey-multi-choice'] = (function() {
display_element.querySelector(question_selector + " p").innerHMTL += "<span class='required'>*</span>";
// add required property
display_element.querySelector(question_selector + " input").required = true;
display_element.querySelector(question_selector + " input[type=radio]").required = true;
}
}
// add submit button
@ -137,8 +136,6 @@ jsPsych.plugins['survey-multi-choice'] = (function() {
trial_form.addEventListener('submit', function(event) {
event.preventDefault();
var matches = display_element.querySelectorAll("div." + plugin_id_name + "-question");
console.log("are you getting called")
// measure response time
var endTime = (new Date()).getTime();
var response_time = endTime - startTime;
@ -146,17 +143,11 @@ jsPsych.plugins['survey-multi-choice'] = (function() {
// create object to hold responses
var question_data = {};
var matches = display_element.querySelectorAll("div." + plugin_id_name + "-question");
var inputs = document.getElementsByTagName('input');
var radios = []
for(var i = 0; i < inputs.length; i++){
if(inputs[i].checked){
radios.push(inputs[i].value)
}
}
matches.forEach(function(currentEl ,index){
var id = "Q" + index;
matches.forEach(function(match, index) {
var id = 'answer'
var val = match.querySelector("input[type=radio]:checked").value;
var obje = {};
obje[id] = radios[index];
obje[id] = val;
Object.assign(question_data, obje);
})
// save data

2
plugins/jspsych-text.js
View File

@ -74,7 +74,7 @@ jsPsych.plugins.text = (function() {
// check if key is 'mouse'
if (trial.choices == 'mouse') {
display_element.attachEventListener(mouse_listener);
display_element.addEventListener(mouse_listener);
var start_time = (new Date()).getTime();
} else {
jsPsych.pluginAPI.getKeyboardResponse({

158
plugins/test.js Normal file
View File

@ -0,0 +1,158 @@
/**
* jspsych-test
* a jspsych plugin for multiple choice survey questions
*
* Shane Martin
*
* documentation: docs.jspsych.org
*
*/
jsPsych.plugins['test'] = (function() {
var plugin = {};
plugin.info = {
name: 'test',
description: '',
parameters: {
questions: {
type: [jsPsych.plugins.parameterType.STRING],
array: true,
default: undefined,
no_function: false,
description: ''
},
options: {
type: [jsPsych.plugins.parameterType.STRING],
array: true,
default: undefined,
no_function: false,
description: ''
},
required: {
type: [jsPsych.plugins.parameterType.BOOL],
array: true,
default: false,
no_function: false,
description: ''
},
horitzontal: {
type: [jsPsych.plugins.parameterType.BOOL],
default: false,
no_function: false,
description: ''
},
preamble: {
type: [jsPsych.plugins.parameterType.STRING],
default: '',
no_function: false,
description: ''
}
}
}
plugin.trial = function(display_element, trial) {
var plugin_id_name = "jspsych-test";
var plugin_id_selector = '#' + plugin_id_name;
var _join = function( /*args*/ ) {
var arr = Array.prototype.slice.call(arguments, _join.length);
return arr.join(separator = '-');
}
// trial defaults
trial.preamble = typeof trial.preamble == 'undefined' ? "" : trial.preamble;
trial.required = typeof trial.required == 'undefined' ? null : trial.required;
trial.horizontal = typeof trial.required == 'undefined' ? false : trial.horizontal;
// if any trial variables are functions
// this evaluates the function and replaces
// it with the output of the function
trial = jsPsych.pluginAPI.evaluateFunctionParameters(trial);
// inject CSS for trial
var node = display_element.innerHTML += '<style id="jspsych-test-css">';
var cssstr = ".jspsych-test-question { margin-top: 2em; margin-bottom: 2em; text-align: left; }"+
".jspsych-test-text span.required {color: darkred;}"+
".jspsych-test-horizontal .jspsych-test-text { text-align: center;}"+
".jspsych-test-option { line-height: 2; }"+
".jspsych-test-horizontal .jspsych-test-option { display: inline-block; margin-left: 1em; margin-right: 1em; vertical-align: top;}"
display_element.querySelector('#jspsych-test-css').innerHTML = cssstr;
// form element
var trial_form_id = _join(plugin_id_name, "form");
display_element.innerHTML += '<form id="'+trial_form_id+'"></form>';
var trial_form = display_element.querySelector("#" + trial_form_id);
// show preamble text
var preamble_id_name = _join(plugin_id_name, 'preamble');
trial_form.innerHTML += '<div id="'+preamble_id_name+'" class="'+preamble_id_name+'">'+trial.preamble+'</div>';
// add multiple-choice questions
for (var i = 0; i < trial.questions.length; i++) {
// create question container
var question_classes = [_join(plugin_id_name, 'question')];
if (trial.horizontal) {
question_classes.push(_join(plugin_id_name, 'horizontal'));
}
trial_form.innerHTML += '<div id="'+_join(plugin_id_name, i)+'" class="'+question_classes.join(' ')+'"></div>';
var question_selector = _join(plugin_id_selector, i);
// add question text
display_element.querySelector(question_selector).innerHTML += '<p class="' + plugin_id_name + '-text test">' + trial.questions[i] + '</p>';
// create option radio buttons
for (var j = 0; j < trial.options[i].length; j++) {
var option_id_name = _join(plugin_id_name, "option", i, j),
option_id_selector = '#' + option_id_name;
// add image container
display_element.querySelector(question_selector).innerHTML += '<div id="'+option_id_name+'" class="'+_join(plugin_id_name, 'option')+'"></div>';
// add label and question text
if(trial.options[i][j].label){
var label = trial.options[i][j].label;
var option_label = '<label class="' + plugin_id_name + '-text">' + label + '</label>';
display_element.querySelector(option_id_selector).innerHTML += option_label;
} else {
var option_label = '<label class="' + plugin_id_name + '-text"></label>';
display_element.querySelector(option_id_selector).innerHTML += option_label;
}
// console.log("option label", option_label)
// var option_label = '<label class="' + plugin_id_name + '-text">'+trial.options[i].url+'</label>';
// display_element.querySelector(option_id_selector).innerHTML += option_label;
// create radio button
// id="jspsych-test-option-0-0"
display_element.querySelector(option_id_selector + " label").innerHTML =
'<img id="image" src="'+trial.options[i][j].url+'">' +
display_element.querySelector(option_id_selector + " label").innerHTML;
}
}
// add submit button
var matches = display_element.querySelectorAll(".jspsych-test-option");
console.log("matches", matches)
matches.forEach(function(currentImageDiv, index){
console.log("currentimagediv", currentImageDiv)
currentImageDiv.addEventListener('click', function(event){
var endTime = (new Date()).getTime();
var response_time = endTime - startTime;
var question_data = {};
var id = 'answer'
var val = currentImageDiv.querySelector("#image").src;
var obje = {};
obje[id] = val;
Object.assign(question_data, obje);
var trial_data = {
"rt": response_time,
"responses": JSON.stringify(question_data)
};
display_element.innerHTML = '';
jsPsych.finishTrial(trial_data);
})
var startTime = (new Date()).getTime();
})
};
return plugin;
})();