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

comments and cleanup

Browse Source
This commit is contained in:
Josh de Leeuw 2013-10-24 14:30:50 -04:00
parent 45dac15b1b
commit 6e32293a9d
2 changed files with 238 additions and 194 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

246
plugins/jspsych-survey-likert.js
View File

@ -1,136 +1,164 @@
/* jspsych-likert /**
* jspsych-likert
* a jspsych plugin for measuring items on a likert scale * a jspsych plugin for measuring items on a likert scale
* *
* Josh de Leeuw (March 2013) * Josh de Leeuw (March 2013)
* Updated October 2013
*
* parameters:
* questions: array of arrays. inner arrays are arrays of strings, where each string represents a prompt
* for the user to respond to.
* labels: array of arrays of arrays. inner most arrays are label markers for the slider, e.g. ["Strongly Disagree", "Neutral", "Strongly Agree"].
* need one inner array for every question that is part of the trial. middle arrays group questions together.
* intervals: array of arrays. inner arrays are how many different responses the user can select from, e.g. 5, one for each question.
* show_ticks: graphically show tick marks on the slider bar to indicate the response levels.
* data: optional data object
* *
*/ */
(function($) { (function($) {
jsPsych.likert = (function(){ jsPsych.likert = (function() {
var plugin = {}; var plugin = {};
plugin.create = function(params) { plugin.create = function(params) {
var trials = []; var trials = [];
for(var i = 0; i < params.questions.length; i++) for (var i = 0; i < params.questions.length; i++) {
{ trials.push({
trials.push({ type: "likert",
type: "likert", questions: params.questions[i],
questions: params.questions[i], labels: params.labels[i],
labels: params.labels[i], intervals: params.intervals[i],
intervals: params.intervals[i], show_ticks: params.show_ticks || true,
show_ticks: params.show_ticks || true data: (typeof params.data === 'undefined') ? {} : params.data[i]
}); });
} }
return trials; return trials;
} };
plugin.trial = function(display_element, block, trial, part) { plugin.trial = function(display_element, block, trial, part) {
// add likert scale questions // add likert scale questions
for(var i = 0; i < trial.questions.length; i++) for (var i = 0; i < trial.questions.length; i++) {
{ // create div
// create div display_element.append($('<div>', {
display_element.append($('<div>', { "id": 'likert'+i, "class": 'likertquestion'})); "id": 'likert' + i,
"class": 'likertquestion'
}));
// add question text // add question text
$("#likert"+i).append('<p class="likerttext likert">'+trial.questions[i]+'</p>'); $("#likert" + i).append('<p class="likerttext likert">' + trial.questions[i] + '</p>');
// create slider // create slider
$("#likert"+i).append($('<div>', { "id": 'slider'+i, "class": 'slider likert' })); $("#likert" + i).append($('<div>', {
$("#slider"+i).slider( "id": 'slider' + i,
{ "class": 'slider likert'
value: Math.ceil(trial.intervals[i] / 2), }));
min: 1, $("#slider" + i).slider({
max: trial.intervals[i], value: Math.ceil(trial.intervals[i] / 2),
step: 1 min: 1,
}); max: trial.intervals[i],
step: 1
});
// show tick marks // show tick marks
if(trial.show_ticks) { if (trial.show_ticks) {
$("#likert"+i).append($('<div>', { "id": 'sliderticks'+i, "class": 'sliderticks likert', "css":{"position":'relative'} })); $("#likert" + i).append($('<div>', {
for(var j = 1; j < trial.intervals[i]-1; j++){ "id": 'sliderticks' + i,
$('#slider'+i).append('<div class="slidertickmark"></div>'); "class": 'sliderticks likert',
} "css": {
"position": 'relative'
}
}));
for (var j = 1; j < trial.intervals[i] - 1; j++) {
$('#slider' + i).append('<div class="slidertickmark"></div>');
}
$('#slider'+i+' .slidertickmark').each(function(index) $('#slider' + i + ' .slidertickmark').each(function(index) {
{ var left = (index + 1) * (100 / (trial.intervals[i] - 1));
var left = (index+1) * (100/(trial.intervals[i]-1)); $(this).css({
$(this).css({ 'position': 'absolute',
'position':'absolute', 'left': left + '%',
'left': left+'%', 'width': '1px',
'width': '1px', 'height': '100%',
'height': '100%', 'background-color': '#222222'
'background-color':'#222222' });
}); });
}); }
}
// create labels for slider // create labels for slider
$("#likert"+i).append($('<ul>', {"id": "sliderlabels"+i, "class": 'sliderlabels likert', "css": $("#likert" + i).append($('<ul>', {
{ "id": "sliderlabels" + i,
"width":"100%", "class": 'sliderlabels likert',
"margin":"10px 0px 0px 0px", "css": {
"padding": "0px", "width": "100%",
"display": "block", "margin": "10px 0px 0px 0px",
"position": "relative" "padding": "0px",
} "display": "block",
})); "position": "relative"
}
}));
for(var j = 0; j < trial.labels[i].length; j++) for (var j = 0; j < trial.labels[i].length; j++) {
{ $("#sliderlabels" + i).append('<li>' + trial.labels[i][j] + '</li>');
$("#sliderlabels"+i).append('<li>'+trial.labels[i][j]+'</li>'); }
}
// position labels to match slider intervals // position labels to match slider intervals
var slider_width = $("#slider"+i).width(); var slider_width = $("#slider" + i).width();
var num_items = trial.labels[i].length; var num_items = trial.labels[i].length;
var item_width = slider_width / num_items; var item_width = slider_width / num_items;
var spacing_interval = slider_width / (num_items - 1); var spacing_interval = slider_width / (num_items - 1);
$("#sliderlabels"+i+" li").each(function(index){ $("#sliderlabels" + i + " li").each(function(index) {
$(this).css({ $(this).css({
'display': 'inline-block', 'display': 'inline-block',
'width': item_width+'px', 'width': item_width + 'px',
'margin': '0px', 'margin': '0px',
'padding': '0px', 'padding': '0px',
'text-align': 'center', 'text-align': 'center',
'position': 'absolute', 'position': 'absolute',
'left': (spacing_interval*index)-(item_width/2) 'left': (spacing_interval * index) - (item_width / 2)
}); });
}); });
} }
// add submit button // add submit button
display_element.append($('<button>', {'id':'next','class':'likert'})); display_element.append($('<button>', {
$("#next").html('Submit Answers'); 'id': 'next',
$("#next").click(function(){ 'class': 'likert'
// measure response time }));
endTime = (new Date()).getTime(); $("#next").html('Submit Answers');
response_time = endTime-startTime; $("#next").click(function() {
// measure response time
var endTime = (new Date()).getTime();
var response_time = endTime - startTime;
// create object to hold responses // create object to hold responses
var question_data = {}; var question_data = {};
$("div.slider").each(function(index){ $("div.slider").each(function(index) {
var id = "Q"+index; var id = "Q" + index;
var val = $(this).slider("value"); var val = $(this).slider("value");
var obje = {}; var obje = {};
obje[id] = val; obje[id] = val;
$.extend(question_data, obje); $.extend(question_data, obje);
}); });
// save data // save data
block.data[block.trial_idx] = $.extend({},{"trial_type": "likert", "trial_index": block.trial_idx, "rt": response_time}, question_data, trial.data); block.writeData($.extend({}, {
"trial_type": "likert",
"trial_index": block.trial_idx,
"rt": response_time
}, question_data, trial.data));
display_element.html(''); display_element.html('');
// next trial // next trial
block.next(); block.next();
}); });
startTime = (new Date()).getTime(); var startTime = (new Date()).getTime();
} }
return plugin; return plugin;
})(); })();
})(jQuery); })(jQuery);

118
plugins/jspsych-survey-text.js
View File

@ -1,72 +1,88 @@
/* jspsych-survey-text /**
* jspsych-survey-text
* a jspsych plugin for free response survey questions * a jspsych plugin for free response survey questions
* *
* Josh de Leeuw (March 2013) * Josh de Leeuw (March 2013)
* Updated October 2013
*
* parameters:
* questions: array of arrays. inner arrays are arrays of strings, where each string represents a prompt
* for the user to respond to.
* data: optional data object
* *
*/ */
(function($) { (function($) {
jsPsych.survey_text = (function(){ jsPsych.survey_text = (function() {
var plugin = {}; var plugin = {};
plugin.create = function(params) { plugin.create = function(params) {
var trials = []; var trials = [];
for(var i = 0; i < params.questions.length; i++) for (var i = 0; i < params.questions.length; i++) {
{ trials.push({
trials.push({ type: "survey_text",
type: "survey_text", questions: params.questions[i],
questions: params.questions[i] data: (typeof params.data === 'undefined') ? {} : params.data[i]
}); });
} }
return trials; return trials;
} };
plugin.trial = function(display_element, block, trial, part) { plugin.trial = function(display_element, block, trial, part) {
// add likert scale questions // add likert scale questions
for(var i = 0; i < trial.questions.length; i++) for (var i = 0; i < trial.questions.length; i++) {
{ // create div
// create div display_element.append($('<div>', {
display_element.append($('<div>', { "id": 'surveytext'+i, "class": 'surveyquestion'})); "id": 'surveytext' + i,
"class": 'surveyquestion'
}));
// add question text // add question text
$("#surveytext"+i).append('<p class="surveytext">'+trial.questions[i]+'</p>'); $("#surveytext" + i).append('<p class="surveytext">' + trial.questions[i] + '</p>');
// add text box // add text box
$("#surveytext"+i).append('<input type="text" name="surveyresponse'+i+'"></input>'); $("#surveytext" + i).append('<input type="text" name="surveyresponse' + i + '"></input>');
} }
// add submit button // add submit button
display_element.append($('<button>', {'id':'next','class':'surveytext'})); display_element.append($('<button>', {
$("#next").html('Submit Answers'); 'id': 'next',
$("#next").click(function(){ 'class': 'surveytext'
// measure response time }));
endTime = (new Date()).getTime(); $("#next").html('Submit Answers');
response_time = endTime-startTime; $("#next").click(function() {
// measure response time
var endTime = (new Date()).getTime();
var response_time = endTime - startTime;
// create object to hold responses // create object to hold responses
var question_data = {}; var question_data = {};
$("div.surveyquestion").each(function(index){ $("div.surveyquestion").each(function(index) {
var id = "Q"+index; var id = "Q" + index;
var val = $(this).children('input').val(); var val = $(this).children('input').val();
var obje = {}; var obje = {};
obje[id] = val; obje[id] = val;
$.extend(question_data, obje); $.extend(question_data, obje);
}); });
// save data // save data
block.data[block.trial_idx] = $.extend({},{"trial_type": "survey_text", "trial_index": block.trial_idx, "rt": response_time}, question_data, trial.data); block.writeData($.extend({}, {
"trial_type": "survey_text",
"trial_index": block.trial_idx,
"rt": response_time
}, question_data, trial.data));
display_element.html(''); display_element.html('');
// next trial // next trial
block.next(); block.next();
}); });
startTime = (new Date()).getTime(); var startTime = (new Date()).getTime();
} };
return plugin; return plugin;
})(); })();
})(jQuery); })(jQuery);