├── README.md
├── css
    └── jspsych.css
├── img
    ├── congruent_left.gif
    ├── congruent_right.gif
    ├── incongruent_left.gif
    └── incongruent_right.gif
├── index.html
└── scripts
    ├── jspsych.js
    └── plugins
        ├── jspsych-animation.js
        ├── jspsych-call-function.js
        ├── jspsych-categorize-animation.js
        ├── jspsych-categorize.js
        ├── jspsych-free-sort.js
        ├── jspsych-html.js
        ├── jspsych-palmer.js
        ├── jspsych-same-different.js
        ├── jspsych-similarity.js
        ├── jspsych-single-stim.js
        ├── jspsych-survey-likert.js
        ├── jspsych-survey-text.js
        ├── jspsych-text.js
        ├── jspsych-visual-search-circle.js
        ├── jspsych-vsl-animate-occlusion.js
        ├── jspsych-vsl-grid-scene.js
        ├── jspsych-xab.js
        └── template
            └── jspsych-plugin-template.js


/README.md:
--------------------------------------------------------------------------------
 1 | This repository is intended to be cloned/forked in order to set up a working jsPsych experiment via GitHub pages. This makes it simple to start exploring jsPsych.
 2 | 
 3 | **This project currently uses jsPsych v3.1**
 4 | 
 5 | Instructions
 6 | ------------
 7 | 
 8 | 1. You will need a GitHub account in order to use the GitHub hosting feature. [Register for free](http://www.github.com).
 9 | 
10 | 2. After you are logged into your account, click the "fork" button near the top right corner of the page. This will automaticaly copy the repository into your GitHub account. Once the copy is complete, you will be sent directly to your copy of this repository.
11 | 
12 | 3. At this point, you must make a small change to the repository to trigger a fresh build of the website. Any change will work. For example, you could change the information in the `<title></title>` section of index.html to give your experiment a new title. 
13 | 
14 | 4. After you have made a change, you can try the test experiment by going to http://[your GitHub username].github.io/jsPsych-quickstart/. It can take a few minutes for GitHub to create this page the first time, so you may need to wait up to 10 minutes before this works. 
15 | 
16 | That's all! Once the website is working, you can edit the files in the repository and the changes will show up immediately at the above URL. 
17 | 
18 | #### A few more advanced notes
19 | 
20 | 1. The repository has two branches, master and gh-pages. Both have the same content, but only changes made to the gh-pages branch will affect the website. The gh-pages branch is marked as the default branch, so you don't need to change any settings if you are editing the page using the GitHub interface.
21 | 
22 | 2. Renaming the repository will change the URL.
23 | 
24 | Need help?
25 | ----------
26 | 
27 | For questions about using the library, please post to the [jsPsych e-mail list](https://groups.google.com/forum/#!forum/jspsych). This creates a publically available archive of questions and solutions.
28 | 


--------------------------------------------------------------------------------
/css/jspsych.css:
--------------------------------------------------------------------------------
  1 | /* 
  2 |  * CSS for jsPsych experiments.
  3 |  *
  4 |  * This stylesheet provides minimal styling to make jsPsych 
  5 |  * experiments look polished without any additional styles.
  6 |  *
  7 |  */
  8 | 
  9 | /*
 10 |  *
 11 |  * fonts and type
 12 |  *
 13 |  */
 14 |  
 15 | @import url(https://fonts.googleapis.com/css?family=Open+Sans:400italic,700italic,400,700);
 16 | 
 17 | html {
 18 |  font-family: 'Open Sans', 'Arial', sans-serif;
 19 |  font-size: 18px;
 20 |  line-height: 1.6em;
 21 | }
 22 | 
 23 | p {
 24 |     clear:both;
 25 | }
 26 | 
 27 | .very-small {
 28 |     font-size: 50%;
 29 | }
 30 | 
 31 | .small {
 32 |     font-size: 75%;
 33 | }
 34 | 
 35 | .large {
 36 |     font-size: 125%;
 37 | }
 38 | 
 39 | .very-large {
 40 |     font-size: 150%;
 41 | }
 42 | 
 43 | /*
 44 |  *
 45 |  * Classes for changing location of things
 46 |  *
 47 |  */
 48 |  
 49 | .left {
 50 |     float: left;
 51 | }
 52 | 
 53 | .right {
 54 |     float: right;
 55 | }
 56 | 
 57 | .center-content {
 58 |     text-align: center;
 59 | }
 60 | 
 61 | /*
 62 |  *
 63 |  * Form elements like input fields and buttons
 64 |  *
 65 |  */
 66 | 
 67 | input[type="text"] {
 68 |     font-family: 'Open Sans', 'Arial', sans-sefif;
 69 |     font-size: 14px;
 70 | }
 71 | 
 72 | button {
 73 |     padding: 0.5em;
 74 |     background-color: #eaeaea;
 75 |     border: 1px solid #eaeaea;
 76 |     color: #333;
 77 |     font-family: 'Open Sans', 'Arial', sans-serif;
 78 |     font-size: 14px;
 79 |     cursor: pointer;
 80 | }
 81 | 
 82 | button:hover {
 83 |     border:1px solid #ccc;
 84 | }
 85 | 
 86 | /*
 87 |  *
 88 |  * Container holding jsPsych content
 89 |  *
 90 |  */
 91 | 
 92 | 
 93 | .jspsych-display-element {
 94 |     width: 800px;
 95 |     margin: 50px auto 50px auto;
 96 | }
 97 | 
 98 | /*
 99 |  *
100 |  * PLUGIN: jspsych-single-stim
101 |  *
102 |  */
103 |  
104 | #jspsych-single-stim-stimulus {
105 |     display: block;
106 |     margin-left: auto;
107 |     margin-right: auto;
108 | }
109 | 
110 | /*
111 |  *
112 |  * PLUGIN: jspsych-survey-text
113 |  *
114 |  */
115 |  
116 |  .jspsych-survey-text {
117 |      margin: 0.25em 0em;
118 |  }
119 |  
120 |  .jspsych-survey-text-question {
121 |      margin: 2em 0em;
122 |  }


--------------------------------------------------------------------------------
/img/congruent_left.gif:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/jspsych/jsPsych-quickstart/7809ec26a02b9bcb8c2afa682f385e47e6a4ef61/img/congruent_left.gif


--------------------------------------------------------------------------------
/img/congruent_right.gif:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/jspsych/jsPsych-quickstart/7809ec26a02b9bcb8c2afa682f385e47e6a4ef61/img/congruent_right.gif


--------------------------------------------------------------------------------
/img/incongruent_left.gif:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/jspsych/jsPsych-quickstart/7809ec26a02b9bcb8c2afa682f385e47e6a4ef61/img/incongruent_left.gif


--------------------------------------------------------------------------------
/img/incongruent_right.gif:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/jspsych/jsPsych-quickstart/7809ec26a02b9bcb8c2afa682f385e47e6a4ef61/img/incongruent_right.gif


--------------------------------------------------------------------------------
/index.html:
--------------------------------------------------------------------------------
 1 | <!doctype html>
 2 | <html>
 3 |     
 4 |     <head>
 5 |         <title>My experiment</title>
 6 |         <!-- Load jQuery -->
 7 |         <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
 8 |         <!-- Load the jspsych library and plugins -->
 9 |         <script src="scripts/jspsych.js"></script>
10 |         <script src="scripts/plugins/jspsych-text.js"></script>
11 |         <script src="scripts/plugins/jspsych-single-stim.js"></script>
12 |         <!-- Load the stylesheet -->
13 |         <link href="css/jspsych.css" type="text/css" rel="stylesheet"></link>
14 |     </head>
15 |     
16 |     <body>
17 |         <div id="jspsych_target"></div>
18 |     </body>
19 |     
20 |     <script type="text/javascript">
21 |         // Experiment parameters
22 |         var n_trials_per_stimulus = 5;
23 |         
24 |         // Experiment Instructions
25 |         var welcome_message = '<div id="instructions"><p>Welcome to the experiment. Press enter to begin.</p></div>';
26 |         
27 |         var instructions = '<div id="instructions"><p>You will see a series of images that look similar to this:</p>\
28 |             <p><img src="img/incongruent_right.gif"></p><p>Press the arrow key that corresponds to the direction that\
29 |             the middle arrow is pointing. For example, in this case you would press the right arrow key.</p>\
30 |             <p>Press enter to start.</p>';
31 | 
32 |         var debrief = '<div id="instructions"><p>Thank you for participating! Press enter to see the data.</p></div>';
33 | 
34 |         // Generating Random Order for Stimuli
35 | 		
36 | 		var stimuli = [
37 | 			{image: "img/congruent_left.gif", data: { stimulus_type: "congruent" }}, 
38 | 			{image: "img/congruent_right.gif", data: { stimulus_type: "congruent" }},
39 | 			{image: "img/incongruent_left.gif", data: { stimulus_type: "incongruent" }},
40 | 			{image: "img/incongruent_right.gif", data: { stimulus_type: "incongruent" }},
41 | 		];
42 |         
43 | 		var trial_info = jsPsych.randomization.repeat(stimuli, n_trials_per_stimulus, true);
44 |         
45 |         // Define experiment blocks
46 |         var instruction_block = {
47 |                 type: "text",
48 |                 text: [welcome_message, instructions],
49 |                 timing_post_trial: 1500
50 |             };
51 |         
52 |         var test_block = {
53 |                 type: "single-stim",
54 |                 stimuli: trial_info.image,
55 |                 choices: [37, 39],
56 |                 data: trial_info.data,
57 | 				timing_post_trial: function() {
58 | 					return Math.floor(Math.random()*1000)+1000;
59 | 				}
60 |             };
61 |             
62 |         var debrief_block = {
63 |                 type: "text",
64 |                 text: [debrief]
65 |             };
66 |             
67 | 		jsPsych.preloadImages(trial_info.image, function() { start_experiment(); });
68 | 		
69 | 		function start_experiment() {
70 | 			jsPsych.init({
71 | 				display_element: $('#jspsych_target'),
72 | 				experiment_structure: [instruction_block, test_block, debrief_block],
73 | 				on_finish: function(data) {
74 | 					jsPsych.dataAPI.displayData();
75 | 				}
76 | 			});
77 | 		}
78 |     </script>
79 | </html>


--------------------------------------------------------------------------------
/scripts/jspsych.js:
--------------------------------------------------------------------------------
  1 | /**
  2 |  * jspsych.js
  3 |  * Josh de Leeuw
  4 |  * 
  5 |  * documentation: https://github.com/jodeleeuw/jsPsych/wiki
  6 |  *
  7 |  **/ 
  8 | (function($) {
  9 |     jsPsych = (function() {
 10 | 
 11 |         //
 12 |         // public object
 13 |         //
 14 |         var core = {};
 15 | 
 16 |         //
 17 |         // private class variables
 18 |         //
 19 | 
 20 |         // options
 21 |         var opts = {};
 22 |         // exp structure
 23 |         var exp_blocks = [];
 24 |         // flow control
 25 |         var curr_block = 0;
 26 |         // everything loaded?
 27 |         var initialized = false;
 28 |         // target DOM element
 29 |         var DOM_target;
 30 |         // time that the experiment began
 31 |         var exp_start_time;
 32 |        
 33 |         //
 34 |         // public methods
 35 |         //
 36 | 
 37 |         // core.init creates the experiment and starts running it
 38 |         //		display_element is an HTML element (usually a <div>) that will display jsPsych content
 39 |         //		options is an object: {
 40 |         //			"experiment_structure": an array of blocks specifying the experiment
 41 |         //			"finish": function to execute when the experiment ends
 42 |         //		}
 43 |         //
 44 |         core.init = function(options) {
 45 | 
 46 |             // reset the key variables
 47 |             exp_blocks = [];
 48 |             opts = {};
 49 |             initialized = false;
 50 |             curr_block = 0;
 51 | 
 52 |             // check if there is a body element on the page
 53 |             var default_display_element = $('body');
 54 |             if (default_display_element.length === 0) {
 55 |                 $(document.documentElement).append($('<body>'));
 56 |                 default_display_element = $('body');
 57 |             }
 58 | 
 59 |             var defaults = {
 60 |                 'display_element': default_display_element,
 61 |                 'on_finish': function(data) {
 62 |                     return undefined;
 63 |                 },
 64 |                 'on_trial_start': function() {
 65 |                     return undefined;
 66 |                 },
 67 |                 'on_trial_finish': function() {
 68 |                     return undefined;
 69 |                 },
 70 |                 'on_data_update': function(data) {
 71 |                     return undefined;
 72 |                 }
 73 |             };
 74 | 
 75 |             // import options
 76 |             opts = $.extend({}, defaults, options);
 77 | 
 78 |             // set target
 79 |             DOM_target = opts.display_element;
 80 | 
 81 |             // add CSS class to DOM_target
 82 |             DOM_target.addClass('jspsych-display-element');
 83 | 
 84 |             run();
 85 |         };
 86 | 
 87 |         // core.data returns all of the data objects for each block as an array
 88 |         //      where core.data[0] = data object from block 0, etc...
 89 |         // if flatten is true, then the hierarchical structure of the data
 90 |         // is removed and each array entry will be a single trial.
 91 | 
 92 |         core.data = function() {
 93 |             var all_data = [];
 94 |             
 95 |             for (var i = 0; i < exp_blocks.length; i++) {
 96 |                 all_data[i] = exp_blocks[i].data;
 97 |             }
 98 | 
 99 |             return all_data;
100 |         };
101 | 
102 |         
103 | 
104 |         // core.progress returns an object with the following properties
105 |         // 		total_blocks: the number of total blocks in the experiment
106 |         //		total_trials: the number of total trials in the experiment
107 |         //		current_trial_global: the current trial number in global terms
108 |         // 					i.e. if each block has 20 trials and the experiment is
109 |         //					currently in block 2 trial 10, this has a value of 30.
110 |         //		current_trial_local: the current trial number within the block.
111 |         //		current_block: the current block number.
112 | 
113 |         core.progress = function() {
114 | 
115 |             var total_trials = 0;
116 |             for (var i = 0; i < exp_blocks.length; i++) {
117 |                 total_trials += exp_blocks[i].num_trials;
118 |             }
119 | 
120 |             var current_trial_global = 0;
121 |             for (var i = 0; i < curr_block; i++) {
122 |                 current_trial_global += exp_blocks[i].num_trials;
123 |             }
124 |             current_trial_global += exp_blocks[curr_block].trial_idx;
125 | 
126 |             var obj = {
127 |                 "total_blocks": exp_blocks.length,
128 |                 "total_trials": total_trials,
129 |                 "current_trial_global": current_trial_global,
130 |                 "current_trial_local": exp_blocks[curr_block].trial_idx,
131 |                 "current_block": curr_block
132 |             };
133 | 
134 |             return obj;
135 |         };
136 | 
137 |         // core.startTime() returns the Date object which represents the time that the experiment started.
138 | 
139 |         core.startTime = function() {
140 |             return exp_start_time;
141 |         };
142 | 
143 |         // core.totalTime() returns the length of time in ms since the experiment began
144 | 
145 |         core.totalTime = function() {
146 |             return (new Date()).getTime() - exp_start_time.getTime();
147 |         };
148 | 
149 |         // core.preloadImage will load images into the browser cache so that they appear quickly when
150 |         // used during a trial. 
151 |         //  images: array of paths to images
152 |         //  callback_complete: a function with no arguments that calls when loading is complete
153 |         //  callback_load: a function with a single argument that calls whenever an image is loaded
154 |         //                  argument is the number of images currently loaded.
155 | 
156 |         core.preloadImages = function(images, callback_complete, callback_load) {
157 | 
158 |             // flatten the images array
159 |             images = flatten(images);
160 | 
161 |             var n_loaded = 0;
162 |             var loadfn = (typeof callback_load === 'undefined') ? function() {} : callback_load;
163 |             var finishfn = (typeof callback_complete === 'undefined') ? function() {} : callback_complete;
164 | 
165 |             for (var i = 0; i < images.length; i++) {
166 |                 var img = new Image();
167 | 
168 |                 img.onload = function() {
169 |                     n_loaded++;
170 |                     loadfn(n_loaded);
171 |                     if (n_loaded == images.length) {
172 |                         finishfn();
173 |                     }
174 |                 };
175 | 
176 |                 img.src = images[i];
177 |             }
178 |         };
179 |         
180 |         core.getDisplayElement = function() {
181 |             return DOM_target;
182 |         }
183 | 
184 |         //
185 |         // private functions //
186 |         //
187 |         function run() {
188 |             // take the experiment structure and dynamically create a set of blocks
189 |             exp_blocks = new Array(opts.experiment_structure.length);
190 | 
191 |             // iterate through block list to create trials
192 |             for (var i = 0; i < exp_blocks.length; i++) {
193 | 
194 |                 // check to make sure plugin is loaded
195 |                 var plugin_name = opts.experiment_structure[i].type;
196 |                 if (typeof jsPsych[plugin_name] == 'undefined') {
197 |                     throw new Error("Failed attempt to create trials using plugin type " + plugin_name + ". Is the plugin loaded?");
198 |                 }
199 | 
200 |                 var trials = jsPsych[plugin_name]["create"].call(null, opts["experiment_structure"][i]);
201 | 
202 |                 exp_blocks[i] = createBlock(trials);
203 |             }
204 | 
205 |             // record the start time
206 |             exp_start_time = new Date();
207 | 
208 |             // begin! - run the first block
209 |             exp_blocks[0].next();
210 |         }
211 | 
212 |         function nextBlock() {
213 |             curr_block += 1;
214 |             if (curr_block == exp_blocks.length) {
215 |                 finishExperiment();
216 |             }
217 |             else {
218 |                 exp_blocks[curr_block].next();
219 |             }
220 |         }
221 | 
222 |         function createBlock(trial_list) {
223 |             var block = {
224 |                 trial_idx: -1,
225 | 
226 |                 trials: trial_list,
227 | 
228 |                 data: [],
229 | 
230 |                 next: function() {
231 | 
232 |                     // call on_trial_finish() 
233 |                     //     if not very first trial
234 |                     //		and not the last call in this block (no trial due to advance in block)
235 |                     if (typeof this.trials[this.trial_idx + 1] != "undefined" && (curr_block != 0 || this.trial_idx > -1)) {
236 |                         opts.on_trial_finish();
237 |                     };
238 | 
239 |                     this.trial_idx = this.trial_idx + 1;
240 | 
241 |                     var curr_trial = this.trials[this.trial_idx];
242 | 
243 |                     if (typeof curr_trial == "undefined") {
244 |                         return this.done();
245 |                     }
246 | 
247 |                     // call on_trial_start()
248 |                     opts.on_trial_start();
249 | 
250 |                     do_trial(this, curr_trial);
251 |                 },
252 | 
253 |                 writeData: function(data_object) {
254 |                     this.data[this.trial_idx] = data_object;
255 |                     opts.on_data_update(data_object);
256 |                 },
257 | 
258 | 
259 |                 done: nextBlock,
260 | 
261 |                 num_trials: trial_list.length
262 |             };
263 | 
264 |             return block;
265 |         }
266 | 
267 |         function finishExperiment() {
268 |             opts["on_finish"].apply((new Object()), [core.data()]);
269 |         }
270 | 
271 |         function do_trial(block, trial) {
272 |             // execute trial method
273 |             jsPsych[trial.type]["trial"].call(this, DOM_target, block, trial, 1);
274 |         }
275 | 
276 |         return core;
277 |     })();
278 |     
279 |     jsPsych.dataAPI = (function() {
280 |         
281 |         var module = {};
282 |         
283 |         // core.dataAsCSV returns a CSV string that contains all of the data
284 |         //      append_data is an option map object that will append values
285 |         //      to every row. for example, if append_data = {"subject": 4},
286 |         //      then a column called subject will be added to the data and
287 |         //      it will always have the value 4.
288 |         module.dataAsCSV = function(append_data) {
289 |             var dataObj = jsPsych.data();
290 |             return JSON2CSV(flattenData(dataObj, append_data));
291 |         };
292 | 
293 |         module.localSave = function(filename, format, append_data) {
294 |             
295 |             var data_string;
296 |             
297 |             if(format == 'JSON' || format == 'json') {
298 |                 data_string = JSON.stringify(flattenData(jsPsych.data(), append_data));
299 |             } else if(format == 'CSV' || format == 'csv') {
300 |                 data_string = module.dataAsCSV(append_data);
301 |             } else {
302 |                 throw new Error('invalid format specified for jsPsych.dataAPI.localSave');
303 |             }
304 |             
305 |             saveTextToFile(data_string, filename);
306 |         };
307 |         
308 |         module.getTrialsOfType = function(trial_type){
309 |             var data = jsPsych.data();
310 |             
311 |             data = flatten(data);
312 |             
313 |             var trials = [];
314 |             for(var i = 0; i < data.length; i++){
315 |                 if(data[i].trial_type == trial_type){
316 |                     trials.push(data[i]);
317 |                 }
318 |             }
319 |             
320 |             return trials;
321 |         };
322 |         
323 |         module.displayData = function(format) {
324 |             format = (typeof format === 'undefined') ? "json" : format.toLowerCase();
325 |             if(format != "json" && format != "csv") {
326 |                 console.log('Invalid format declared for displayData function. Using json as default.');
327 |                 format = "json";
328 |             }
329 |             
330 |             var data_string;
331 |             
332 |             if(format == 'json') {
333 |                 data_string = JSON.stringify(flattenData(jsPsych.data()), undefined, 1);
334 |             } else {
335 |                 data_string = module.dataAsCSV();
336 |             } 
337 |             
338 |             var display_element = jsPsych.getDisplayElement();
339 |             
340 |             display_element.append($('<pre>', {
341 |                 html: data_string
342 |             }));
343 |         }
344 |         
345 |         // private function to save text file on local drive
346 |         function saveTextToFile(textstr, filename) {
347 |             var blobToSave = new Blob([textstr], {
348 |                 type: 'text/plain'
349 |             });
350 |             var blobURL = "";
351 |             if (typeof window.webkitURL !== 'undefined') {
352 |                 blobURL = window.webkitURL.createObjectURL(blobToSave);
353 |             }
354 |             else {
355 |                 blobURL = window.URL.createObjectURL(blobToSave);
356 |             }
357 |             
358 |             var display_element = jsPsych.getDisplayElement();
359 |             
360 |             display_element.append($('<a>', {
361 |                 id: 'jspsych-download-as-text-link',
362 |                 href: blobURL,
363 |                 css: {
364 |                     display: 'none'
365 |                 },
366 |                 download: filename,
367 |                 html: 'download file'
368 |             }));
369 |             $('#jspsych-download-as-text-link')[0].click();
370 |         }
371 |         
372 |         //
373 |         // A few helper functions to handle data format conversion
374 |         //
375 |         function flattenData(data_object, append_data) {
376 | 
377 |             append_data = (typeof append_data === undefined) ? {} : append_data;
378 | 
379 |             var trials = [];
380 | 
381 |             // loop through data_object
382 |             for (var i = 0; i < data_object.length; i++) {
383 |                 for (var j = 0; j < data_object[i].length; j++) {
384 |                     var data = $.extend({}, data_object[i][j], append_data);
385 |                     trials.push(data);
386 |                 }
387 |             }
388 | 
389 |             return trials;
390 |         }
391 |         
392 |         // this function based on code suggested by StackOverflow users:
393 |         // http://stackoverflow.com/users/64741/zachary
394 |         // http://stackoverflow.com/users/317/joseph-sturtevant
395 |         function JSON2CSV(objArray) {
396 |             var array = typeof objArray != 'object' ? JSON.parse(objArray) : objArray;
397 |             var line = '';
398 |             var result = '';
399 |             var columns = [];
400 | 
401 |             var i = 0;
402 |             for (var j = 0; j < array.length; j++) {
403 |                 for (var key in array[j]) {
404 |                     var keyString = key + "";
405 |                     keyString = '"' + keyString.replace(/"/g, '""') + '",';
406 |                     if ($.inArray(key, columns) == -1) {
407 |                         columns[i] = key;
408 |                         line += keyString;
409 |                         i++;
410 |                     }
411 |                 }
412 |             }
413 | 
414 |             line = line.slice(0, - 1);
415 |             result += line + '\r\n';
416 | 
417 |             for (var i = 0; i < array.length; i++) {
418 |                 var line = '';
419 |                 for (var j = 0; j < columns.length; j++) {
420 |                     var value = (typeof array[i][columns[j]] === 'undefined') ? '' : array[i][columns[j]];
421 |                     var valueString = value + "";
422 |                     line += '"' + valueString.replace(/"/g, '""') + '",';
423 |                 }
424 | 
425 |                 line = line.slice(0, - 1);
426 |                 result += line + '\r\n';
427 |             }
428 | 
429 |             return result;
430 |         }
431 |         
432 |         return module;
433 |         
434 |     })();
435 |     
436 |     jsPsych.turk = (function() {
437 |         
438 |          // turk info
439 |         var turk_info;
440 |         
441 |         var module = {};
442 |         
443 |         // core.turkInfo gets information relevant to mechanical turk experiments. returns an object
444 |         // containing the workerID, assignmentID, and hitID, and whether or not the HIT is in
445 |         // preview mode, meaning that they haven't accepted the HIT yet.
446 |         module.turkInfo = function(force_refresh) {
447 |             // default value is false
448 |             force_refresh = (typeof force_refresh === 'undefined') ? false : force_refresh;
449 |             // if we already have the turk_info and force_refresh is false
450 |             // then just return the cached version.
451 |             if (typeof turk_info !== 'undefined' && !force_refresh) {
452 |                 return turk_info;
453 |             } else {
454 | 
455 |                 var turk = {};
456 | 
457 |                 var param = function(url, name) {
458 |                     name = name.replace(/[\[]/, "\\\[").replace(/[\]]/, "\\\]");
459 |                     var regexS = "[\\?&]" + name + "=([^&#]*)";
460 |                     var regex = new RegExp(regexS);
461 |                     var results = regex.exec(url);
462 |                     return (results == null) ? "" : results[1];
463 |                 };
464 | 
465 |                 var src = param(window.location.href, "assignmentId") ? window.location.href : document.referrer;
466 | 
467 |                 var keys = ["assignmentId", "hitId", "workerId", "turkSubmitTo"];
468 |                 keys.map(
469 | 
470 |                 function(key) {
471 |                     turk[key] = unescape(param(src, key));
472 |                 });
473 | 
474 |                 turk.previewMode = (turk.assignmentId == "ASSIGNMENT_ID_NOT_AVAILABLE");
475 | 
476 |                 turk.outsideTurk = (!turk.previewMode && turk.hitId === "" && turk.assignmentId == "" && turk.workerId == "")
477 | 
478 |                 turk_info = turk;
479 | 
480 |                 return turk;
481 |             }
482 | 
483 |         };
484 | 
485 |         // core.submitToTurk will submit a MechanicalTurk ExternalHIT type
486 | 
487 |         module.submitToTurk = function(data) {
488 | 
489 |             var turkInfo = core.turkInfo();
490 |             var assignmentId = turkInfo.assignmentId;
491 |             var turkSubmitTo = turkInfo.turkSubmitTo;
492 | 
493 |             if (!assignmentId || !turkSubmitTo) return;
494 | 
495 |             var dataString = [];
496 | 
497 |             for (var key in data) {
498 | 
499 |                 if (data.hasOwnProperty(key)) {
500 |                     dataString.push(key + "=" + escape(data[key]));
501 |                 }
502 |             }
503 | 
504 |             dataString.push("assignmentId=" + assignmentId);
505 | 
506 |             var url = turkSubmitTo + "/mturk/externalSubmit?" + dataString.join("&");
507 | 
508 |             window.location.href = url;
509 |         }
510 |         
511 |         return module;
512 |         
513 |     })();
514 |     
515 |     jsPsych.randomization = (function() {
516 |         
517 |         var module = {};
518 |         
519 |         module.repeat = function(array, repetitions, unpack) {
520 |            
521 |             var arr_isArray = Array.isArray(array);
522 |             var rep_isArray = Array.isArray(repetitions);
523 |             
524 |             // if array is not an array, then we just repeat the item
525 |             if(!arr_isArray){
526 |                 if(!rep_isArray) {
527 |                     array = [array];
528 |                     repetitions = [repetitions];
529 |                 } else {
530 |                     repetitions = [repetitions[0]];
531 |                     console.log('Unclear parameters given to randomizeSimpleSample. Multiple set sizes specified, but only one item exists to sample. Proceeding using the first set size.');
532 |                 }
533 |             } else {
534 |                 if(!rep_isArray) {
535 |                     var reps = [];
536 |                     for(var i = 0; i < array.length; i++){
537 |                         reps.push(repetitions);            
538 |                     }
539 |                     repetitions = reps;
540 |                 } else {
541 |                     if(array.length != repetitions.length) {
542 |                         // throw warning if repetitions is too short,
543 |                         // throw warning if too long, and then use the first N
544 |                     }
545 |                 }
546 |             }
547 |             
548 |             // should be clear at this point to assume that array and repetitions are arrays with == length
549 |             var allsamples = [];
550 |             for(var i = 0; i < array.length; i++){
551 |                 for(var j = 0; j < repetitions[i]; j++){
552 |                     allsamples.push(array[i]);
553 |                 }
554 |             }
555 |             
556 |             var out = shuffle(allsamples);
557 |             
558 |             if(unpack) { out = unpackArray(out);  }
559 |             
560 |             return shuffle(out);   
561 |         }
562 |         
563 |         module.factorial = function(factors, repetitions, unpack){
564 |     
565 |             var factorNames = Object.keys(factors);
566 |             
567 |             var factor_combinations = [];
568 |             
569 |             for(var i = 0; i < factors[factorNames[0]].length; i++){
570 |                 factor_combinations.push({});
571 |                 factor_combinations[i][factorNames[0]] = factors[factorNames[0]][i];
572 |             }
573 |             
574 |             for(var i = 1; i< factorNames.length; i++){
575 |                 var toAdd = factors[factorNames[i]];
576 |                 var n = factor_combinations.length;
577 |                 for(var j = 0; j < n; j++){
578 |                     var base = factor_combinations[j];
579 |                     for(var k = 0; k < toAdd.length; k++){
580 |                         var newpiece = {};
581 |                         newpiece[factorNames[i]] = toAdd[k];
582 |                         factor_combinations.push($.extend({}, base, newpiece));
583 |                     }
584 |                 }
585 |                 factor_combinations.splice(0,n);
586 |             }
587 |             
588 |             repetitions = (typeof repetitions === 'undefined') ? 1 : repetitions;
589 |             var with_repetitions = module.repeat(factor_combinations, repetitions, unpack);
590 |             
591 |             return with_repetitions;
592 |         }
593 |         
594 |         function unpackArray(array) {
595 |             
596 |             var out = {};
597 |         
598 |             for(var i = 0; i < array.length; i++){
599 |                 var keys = Object.keys(array[i]);
600 |                 for(var k = 0; k < keys.length; k++){
601 |                     if(typeof out[keys[k]] === 'undefined') {
602 |                         out[keys[k]] = [];
603 |                     }
604 |                     out[keys[k]].push(array[i][keys[k]]);
605 |                 }
606 |             }
607 |             
608 |             return out;
609 |         }
610 |         
611 |         function shuffle(array) {
612 |           var m = array.length, t, i;
613 |         
614 |           // While there remain elements to shuffle…
615 |           while (m) {
616 |         
617 |             // Pick a remaining element…
618 |             i = Math.floor(Math.random() * m--);
619 |         
620 |             // And swap it with the current element.
621 |             t = array[m];
622 |             array[m] = array[i];
623 |             array[i] = t;
624 |           }
625 |         
626 |           return array;
627 |         }
628 |         
629 |         return module;
630 |         
631 |     })();
632 |     
633 |     jsPsych.pluginAPI = (function() {
634 |         
635 |         // keyboard listeners
636 |         var keyboard_listeners = [];
637 |         
638 |         var module = {};
639 |         
640 |         module.getKeyboardResponse = function(callback_function, valid_responses, rt_method, persist) {
641 | 
642 |             rt_method = (typeof rt_method === 'undefined') ? 'date' : rt_method;
643 |             if (rt_method != 'date' && rt_method != 'performance') {
644 |                 console.log('Invalid RT method specified in getKeyboardResponse. Defaulting to "date" method.');
645 |                 rt_method = 'date';
646 |             }
647 | 
648 |             var start_time;
649 |             if (rt_method == 'date') {
650 |                 start_time = (new Date()).getTime();
651 |             }
652 |             if (rt_method == 'performance') {
653 |                 start_time = performance.now();
654 |             }
655 | 
656 |             var listener_id;
657 |             
658 |             var listener_function = function(e) {
659 | 
660 |                 var key_time;
661 |                 if (rt_method == 'date') {
662 |                     key_time = (new Date()).getTime();
663 |                 }
664 |                 if (rt_method == 'performance') {
665 |                     key_time = performance.now();
666 |                 }
667 | 
668 |                 var valid_response = false;
669 |                 if (typeof valid_responses === 'undefined' || valid_responses.length === 0) {
670 |                     valid_response = true;
671 |                 }
672 |                 for (var i = 0; i < valid_responses.length; i++) {
673 |                     if (typeof valid_responses[i] == 'string') {
674 |                         if(typeof keylookup[valid_responses[i]] !== 'undefined'){
675 |                             if(e.which == keylookup[valid_responses[i]]) {
676 |                                 valid_response = true;
677 |                             }
678 |                         } else {
679 |                             throw new Error('Invalid key string specified for getKeyboardResponse');
680 |                         }
681 |                     } else if (e.which == valid_responses[i]) {
682 |                         valid_response = true;
683 |                     }
684 |                 }
685 | 
686 |                 if (valid_response) {
687 |                     
688 |                     var after_up = function(up) {
689 |                         
690 |                         if(up.which == e.which) {
691 |                             $(document).off('keyup', after_up);
692 |                         
693 |                             if($.inArray(listener_id, keyboard_listeners) > -1) {
694 |                                 
695 |                                 if(!persist){
696 |                                     // remove keyboard listener
697 |                                     module.cancelKeyboardResponse(listener_id);
698 |                                 }
699 |                                 
700 |                                 callback_function({
701 |                                     key: e.which,
702 |                                     rt: key_time - start_time
703 |                                 });
704 |                             }
705 |                         }
706 |                     };
707 |                     
708 |                     $(document).keyup(after_up);
709 |                 }
710 |             };
711 | 
712 |             $(document).keydown(listener_function);
713 |             
714 |             // create listener id object
715 |             listener_id = {type: 'keydown', fn: listener_function};
716 |             
717 |             // add this keyboard listener to the list of listeners
718 |             keyboard_listeners.push(listener_id);
719 |             
720 |             return listener_id;
721 |             
722 |         };
723 |         
724 |         module.cancelKeyboardResponse = function(listener) {
725 |             // remove the listener from the doc
726 |             $(document).off(listener.type, listener.fn);
727 |             
728 |             // remove the listener from the list of listeners
729 |             if($.inArray(listener, keyboard_listeners) > -1) {
730 |                 keyboard_listeners.splice($.inArray(listener, keyboard_listeners), 1);
731 |             }
732 |         };
733 |         
734 |         module.cancelAllKeyboardResponses = function() {
735 |             for(var i = 0; i< keyboard_listeners.length; i++){
736 |                 $(document).off(keyboard_listeners[i].type, keyboard_listeners[i].fn);
737 |             }
738 |             keyboard_listeners = [];
739 |         };
740 |         
741 |         // keycode lookup associative array
742 |         var keylookup = {
743 |             'backspace': 8,
744 |             'tab': 9,
745 |             'enter': 13,
746 |             'shift': 16,
747 |             'ctrl': 17,
748 |             'alt': 18,
749 |             'pause': 19,
750 |             'capslock': 20,
751 |             'esc': 27,
752 |             'space':32,
753 |             'spacebar':32,
754 |             ' ':32,
755 |             'pageup': 33,
756 |             'pagedown': 34,
757 |             'end': 35,
758 |             'home': 36,
759 |             'leftarrow': 37,
760 |             'uparrow': 38,
761 |             'rightarrow': 39,
762 |             'downarrow': 40,
763 |             'insert': 45,
764 |             'delete': 46,
765 |             '0': 48,
766 |             '1': 49,
767 |             '2': 50,
768 |             '3': 51,
769 |             '4': 52,
770 |             '5': 53,
771 |             '6': 54,
772 |             '7': 55,
773 |             '8': 56,
774 |             '9': 57,
775 |             'a': 65,
776 |             'b': 66,
777 |             'c': 67,
778 |             'd': 68,
779 |             'e': 69,
780 |             'f': 70,
781 |             'g': 71,
782 |             'h': 72,
783 |             'i': 73,
784 |             'j': 74,
785 |             'k': 75,
786 |             'l': 76,
787 |             'm': 77,
788 |             'n': 78,
789 |             'o': 79,
790 |             'p': 80,
791 |             'q': 81,
792 |             'r': 82,
793 |             's': 83,
794 |             't': 84,
795 |             'u': 85,
796 |             'v': 86,
797 |             'w': 87,
798 |             'x': 88,
799 |             'y': 89,
800 |             'z': 90,
801 |             'A': 65,
802 |             'B': 66,
803 |             'C': 67,
804 |             'D': 68,
805 |             'E': 69,
806 |             'F': 70,
807 |             'G': 71,
808 |             'H': 72,
809 |             'I': 73,
810 |             'J': 74,
811 |             'K': 75,
812 |             'L': 76,
813 |             'M': 77,
814 |             'N': 78,
815 |             'O': 79,
816 |             'P': 80,
817 |             'Q': 81,
818 |             'R': 82,
819 |             'S': 83,
820 |             'T': 84,
821 |             'U': 85,
822 |             'V': 86,
823 |             'W': 87,
824 |             'X': 88,
825 |             'Y': 89,
826 |             'Z': 90,
827 |             '0numpad': 96,
828 |             '1numpad': 97,
829 |             '2numpad': 98,
830 |             '3numpad': 99,
831 |             '4numpad': 100,
832 |             '5numpad': 101,
833 |             '6numpad': 102,
834 |             '7numpad': 103,
835 |             '8numpad': 104,
836 |             '9numpad': 105,
837 |             'multiply': 106,
838 |             'plus': 107,
839 |             'minus': 109,
840 |             'decimal': 110,
841 |             'divide': 111,
842 |             'F1': 112,
843 |             'F2': 113,
844 |             'F3': 114,
845 |             'F4': 115,
846 |             'F5': 116,
847 |             'F6': 117,
848 |             'F7': 118,
849 |             'F8': 119,
850 |             'F9': 120,
851 |             'F10': 121,
852 |             'F11': 122,
853 |             'F12': 123,
854 |             '=': 187,
855 |             ',': 188,
856 |             '.': 190,
857 |             '/': 191,
858 |             '`': 192,
859 |             '[': 219,
860 |             '\\': 220,
861 |             ']': 221
862 |         };
863 |         
864 |         //
865 |         // These are public functions, intended to be used for developing plugins.
866 |         // They aren't considered part of the normal API for the core library.
867 |         //
868 | 
869 |         module.normalizeTrialVariables = function(trial, protect) {
870 | 
871 |             protect = (typeof protect === 'undefined') ? [] : protect;
872 | 
873 |             var keys = getKeys(trial);
874 | 
875 |             var tmp = {};
876 |             for (var i = 0; i < keys.length; i++) {
877 | 
878 |                 var process = true;
879 |                 for (var j = 0; j < protect.length; j++) {
880 |                     if (protect[j] == keys[i]) {
881 |                         process = false;
882 |                         break;
883 |                     }
884 |                 }
885 | 
886 |                 if (typeof trial[keys[i]] == "function" && process) {
887 |                     tmp[keys[i]] = trial[keys[i]].call();
888 |                 }
889 |                 else {
890 |                     tmp[keys[i]] = trial[keys[i]];
891 |                 }
892 | 
893 |             }
894 | 
895 |             return tmp;
896 | 
897 |         };
898 | 
899 |         // if possible_array is not an array, then return a one-element array
900 |         // containing possible_array
901 |         module.enforceArray = function(params, possible_arrays) {
902 | 
903 |             // function to check if something is an array, fallback
904 |             // to string method if browser doesn't support Array.isArray
905 |             var ckArray = Array.isArray || function(a) {
906 |                     return toString.call(a) == '[object Array]';
907 |                 };
908 | 
909 |             for (var i = 0; i < possible_arrays.length; i++) {
910 |                 if(typeof params[possible_arrays[i]] !== 'undefined'){
911 |                     params[possible_arrays[i]] = ckArray(params[possible_arrays[i]]) ? params[possible_arrays[i]] : [params[possible_arrays[i]]];
912 |                 }
913 |             }
914 | 
915 |             return params;
916 |         };
917 |         
918 |         function getKeys(obj) {
919 |             var r = [];
920 |             for (var k in obj) {
921 |                 if (!obj.hasOwnProperty(k)) continue;
922 |                 r.push(k);
923 |             }
924 |             return r;
925 |         }
926 |         
927 |         return module;
928 |     })();
929 |     
930 |     // methods used in multiple modules
931 |     
932 |     // private function to flatten nested arrays
933 |     function flatten(arr, out) {
934 |         out = (typeof out === 'undefined') ? [] : out;
935 |         for (var i = 0; i < arr.length; i++) {
936 |             if (Array.isArray(arr[i])) {
937 |                 flatten(arr[i], out);
938 |             }
939 |             else {
940 |                 out.push(arr[i]);
941 |             }
942 |         }
943 |         return out;
944 |     }
945 | 
946 | })(jQuery);


--------------------------------------------------------------------------------
/scripts/plugins/jspsych-animation.js:
--------------------------------------------------------------------------------
  1 | /**
  2 |  * jsPsych plugin for showing animations and recording keyboard responses
  3 |  * Josh de Leeuw
  4 |  * 
  5 |  * documentation: https://github.com/jodeleeuw/jsPsych/wiki/jspsych-animation
  6 |  */
  7 | 
  8 | (function($) {
  9 |     jsPsych.animation = (function() {
 10 | 
 11 |         var plugin = {};
 12 | 
 13 |         plugin.create = function(params) {
 14 |             
 15 |             params = jsPsych.pluginAPI.enforceArray(params, ['choices', 'data']);
 16 | 
 17 |             var trials = new Array(params.stimuli.length);
 18 |             for (var i = 0; i < trials.length; i++) {
 19 |                 trials[i] = {};
 20 |                 trials[i].type = "animation";
 21 |                 trials[i].stims = params.stimuli[i];
 22 |                 trials[i].frame_time = params.frame_time || 250;
 23 |                 trials[i].frame_isi = params.frame_isi || 0;
 24 |                 trials[i].repetitions = params.repetitions || 1;
 25 |                 trials[i].choices = params.choices || [];
 26 |                 trials[i].timing_post_trial = (typeof params.timing_post_trial === 'undefined') ? 1000 : params.timing_post_trial;
 27 |                 trials[i].prompt = (typeof params.prompt === 'undefined') ? "" : params.prompt;
 28 |                 trials[i].data = (typeof params.data === 'undefined') ? {} : params.data[i];
 29 |             }
 30 |             return trials;
 31 |         };
 32 | 
 33 |         plugin.trial = function(display_element, block, trial, part) {
 34 |             
 35 |             // if any trial variables are functions
 36 |             // this evaluates the function and replaces
 37 |             // it with the output of the function
 38 |             trial = jsPsych.pluginAPI.normalizeTrialVariables(trial);
 39 |             
 40 |             var interval_time = trial.frame_time + trial.frame_isi;
 41 |             var animate_frame = -1;
 42 |             var reps = 0;
 43 |             var startTime = (new Date()).getTime();
 44 |             var animation_sequence = [];
 45 |             var responses = [];
 46 |             var current_stim = "";
 47 | 
 48 |             var animate_interval = setInterval(function() {
 49 |                 var showImage = true;
 50 |                 display_element.html(""); // clear everything
 51 |                 animate_frame++;
 52 |                 if (animate_frame == trial.stims.length) {
 53 |                     animate_frame = 0;
 54 |                     reps++;
 55 |                     if (reps >= trial.repetitions) {
 56 |                         endTrial();
 57 |                         clearInterval(animate_interval);
 58 |                         showImage = false;
 59 |                     }
 60 |                 }
 61 |                 if (showImage) {
 62 |                     show_next_frame();
 63 |                 }
 64 |             }, interval_time);
 65 | 
 66 |             function show_next_frame() {
 67 |                 // show image
 68 |                 display_element.append($('<img>', {
 69 |                     "src": trial.stims[animate_frame],
 70 |                     "id": 'jspsych-animation-image'
 71 |                 }));
 72 |                 
 73 |                 current_stim = trial.stims[animate_frame];
 74 | 
 75 |                 // record when image was shown
 76 |                 animation_sequence.push({
 77 |                     "stimulus": current_stim,
 78 |                     "time": (new Date()).getTime() - startTime
 79 |                 });
 80 | 
 81 |                 if (trial.prompt !== "") {
 82 |                     display_element.append(trial.prompt);
 83 |                 }
 84 | 
 85 |                 if (trial.frame_isi > 0) {
 86 |                     setTimeout(function() {
 87 |                         $('#jspsych-animation-image').css('visibility', 'hidden');
 88 |                         current_stim = 'blank';
 89 |                         // record when blank image was shown
 90 |                         animation_sequence.push({
 91 |                             "stimulus": 'blank',
 92 |                             "time": (new Date()).getTime() - startTime
 93 |                         });
 94 |                     }, trial.frame_time);
 95 |                 }
 96 |             }
 97 |             
 98 |             var after_response = function(info) {
 99 |                 
100 |                 responses.push({
101 |                     key_press: info.key,
102 |                     rt: info.rt,
103 |                     stimulus: current_stim
104 |                 });
105 |                 
106 |                 // after a valid response, the stimulus will have the CSS class 'responded'
107 |                 // which can be used to provide visual feedback that a response was recorded
108 |                 $("#jspsych-animation-image").addClass('responded');
109 |             }
110 | 
111 |             // hold the jspsych response listener object in memory
112 |             // so that we can turn off the response collection when
113 |             // the trial ends
114 |             var response_listener = jsPsych.pluginAPI.getKeyboardResponse(after_response, trial.choices, 'date', true);
115 | 
116 |             function endTrial() {
117 |                 
118 |                 jsPsych.pluginAPI.cancelKeyboardResponse(response_listener);
119 |                 
120 |                 block.writeData($.extend({}, {
121 |                     "trial_type": "animation",
122 |                     "trial_index": block.trial_idx,
123 |                     "animation_sequence": JSON.stringify(animation_sequence),
124 |                     "responses": JSON.stringify(responses)
125 |                 }, trial.data));
126 | 
127 |                 if(trial.timing_post_trial > 0){
128 |                     setTimeout(function() {
129 |                         block.next();
130 |                     }, trial.timing_post_trial);
131 |                 } else {
132 |                     block.next();
133 |                 }
134 |             }
135 |         };
136 | 
137 |         return plugin;
138 |     })();
139 | })(jQuery);
140 | 


--------------------------------------------------------------------------------
/scripts/plugins/jspsych-call-function.js:
--------------------------------------------------------------------------------
 1 | /** 
 2 |  * jspsych-call-function
 3 |  * plugin for calling an arbitrary function during a jspsych experiment
 4 |  * Josh de Leeuw
 5 |  * 
 6 |  * documentation: https://github.com/jodeleeuw/jsPsych/wiki/jspsych-call-function
 7 |  * 
 8 | **/
 9 | 
10 | (function($) {
11 |     jsPsych['call-function'] = (function() {
12 | 
13 |         var plugin = {};
14 | 
15 |         plugin.create = function(params) {
16 |             var trials = new Array(1);
17 |             trials[0] = {
18 |                 "type": "call-function",
19 |                 "func": params.func,
20 |                 "args": params.args || [],
21 |                 "data": (typeof params.data === 'undefined') ? {} : params.data
22 |             };
23 |             return trials;
24 |         };
25 | 
26 |         plugin.trial = function(display_element, block, trial, part) {
27 |             var return_val = trial.func.apply({}, [trial.args]);
28 |             if (typeof return_val !== 'undefined') {
29 |                 block.writeData($.extend({},{
30 |                     trial_type: "call-function",
31 |                     trial_index: block.trial_idx,
32 |                     value: return_val
33 |                 },trial.data));
34 |             }
35 | 
36 |             block.next();
37 |         };
38 | 
39 |         return plugin;
40 |     })();
41 | })(jQuery);
42 | 


--------------------------------------------------------------------------------
/scripts/plugins/jspsych-categorize-animation.js:
--------------------------------------------------------------------------------
  1 | /** 
  2 |  * jspsych plugin for categorization trials with feedback and animated stimuli
  3 |  * Josh de Leeuw
  4 |  * 
  5 |  * documentation: https://github.com/jodeleeuw/jsPsych/wiki/jspsych-categorize-animation
  6 |  **/
  7 | 
  8 | (function($) {
  9 |     jsPsych["categorize-animation"] = (function() {
 10 | 
 11 |         var plugin = {};
 12 | 
 13 |         plugin.create = function(params) {
 14 |             
 15 |             params = jsPsych.pluginAPI.enforceArray(params, ['key_answer','text_answer','choices','data']);
 16 |             
 17 |             var trials = new Array(params.stimuli.length);
 18 |             for (var i = 0; i < trials.length; i++) {
 19 |                 trials[i] = {};
 20 |                 trials[i].type = "categorize-animation";
 21 |                 trials[i].stims = params.stimuli[i];
 22 |                 trials[i].reps = params.reps || 1;
 23 |                 trials[i].key_answer = params.key_answer[i];
 24 |                 trials[i].text_answer = (typeof params.text_answer === 'undefined') ? "" : params.text_answer[i];
 25 |                 trials[i].choices = params.choices;
 26 |                 trials[i].correct_text = params.correct_text || "Correct.";
 27 |                 trials[i].incorrect_text = params.incorrect_text || "Wrong.";
 28 |                 trials[i].allow_response_before_complete = params.allow_response_before_complete || false;
 29 |                 trials[i].frame_time = params.frame_time || 500;
 30 |                 trials[i].timing_feedback_duration = params.timing_feedback_duration || 2000;
 31 |                 trials[i].timing_post_trial = (typeof params.timing_post_trial === 'undefined') ? 1000 : params.timing_post_trial;
 32 |                 trials[i].prompt = (typeof params.prompt === 'undefined') ? '' : params.prompt;
 33 |                 trials[i].data = (typeof params.data === 'undefined') ? {} : params.data[i];
 34 |             }
 35 |             return trials;
 36 |         };
 37 | 
 38 |         plugin.trial = function(display_element, block, trial, part) {
 39 |             
 40 |             // if any trial variables are functions
 41 |             // this evaluates the function and replaces
 42 |             // it with the output of the function
 43 |             trial = jsPsych.pluginAPI.normalizeTrialVariables(trial);
 44 |             
 45 |             var animate_frame = -1;
 46 |             var reps = 0;
 47 | 
 48 |             var showAnimation = true;
 49 | 
 50 |             var responded = false;
 51 |             var timeoutSet = false;
 52 | 
 53 | 
 54 |             var startTime = (new Date()).getTime();
 55 | 
 56 |             // show animation
 57 |             var animate_interval = setInterval(function() {
 58 |                 display_element.html(""); // clear everything
 59 |                 animate_frame++;
 60 |                 if (animate_frame == trial.stims.length) {
 61 |                     animate_frame = 0;
 62 |                     reps++;
 63 |                     // check if reps complete //
 64 |                     if (trial.reps != -1 && reps >= trial.reps) {
 65 |                         // done with animation
 66 |                         showAnimation = false;
 67 |                     }
 68 |                 }
 69 | 
 70 |                 if (showAnimation) {
 71 |                     display_element.append($('<img>', {
 72 |                         "src": trial.stims[animate_frame],
 73 |                         "class": 'jspsych-categorize-animation-stimulus'
 74 |                     }));
 75 |                 }
 76 | 
 77 |                 if (!responded && trial.allow_response_before_complete) {
 78 |                     // in here if the user can respond before the animation is done
 79 |                     if (trial.prompt !== "") {
 80 |                         display_element.append(trial.prompt);
 81 |                     }
 82 |                 }
 83 |                 else if (!responded) {
 84 |                     // in here if the user has to wait to respond until animation is done.
 85 |                     // if this is the case, don't show the prompt until the animation is over.
 86 |                     if (!showAnimation) {
 87 |                         if (trial.prompt !== "") {
 88 |                             display_element.append(trial.prompt);
 89 |                         }
 90 |                     }
 91 |                 }
 92 |                 else {
 93 |                     // user has responded if we get here.
 94 | 
 95 |                     // show feedback
 96 |                     var feedback_text = "";
 97 |                     if (block.data[block.trial_idx].correct) {
 98 |                         feedback_text = trial.correct_text.replace("%ANS%", trial.text_answer);
 99 |                     }
100 |                     else {
101 |                         feedback_text = trial.incorrect_text.replace("%ANS%", trial.text_answer);
102 |                     }
103 |                     display_element.append(feedback_text);
104 | 
105 |                     // set timeout to clear feedback
106 |                     if (!timeoutSet) {
107 |                         timeoutSet = true;
108 |                         setTimeout(function() {
109 |                             endTrial();
110 |                         }, trial.timing_feedback_duration);
111 |                     }
112 |                 }
113 | 
114 | 
115 |             }, trial.frame_time);
116 | 
117 |             
118 |             var keyboard_listener;
119 |             
120 |             var after_response = function(info){
121 |                 // ignore the response if animation is playing and subject
122 |                 // not allowed to respond before it is complete
123 |                 if (!trial.allow_response_before_complete && showAnimation) {
124 |                     return false;
125 |                 }
126 |                 
127 |                 var correct = false;
128 |                 if(trial.key_answer == info.key) {
129 |                     correct = true;
130 |                 }
131 |                 
132 |                 responded = true;
133 | 
134 |                 var trial_data = {
135 |                     "trial_type": trial.type,
136 |                     "trial_index": block.trial_idx,
137 |                     "stimulus": trial.stims[0],
138 |                     "rt": info.rt,
139 |                     "correct": correct,
140 |                     "key_press": info.key
141 |                 };
142 |                 
143 |                 block.writeData($.extend({}, trial_data, trial.data));
144 |                 
145 |                 jsPsych.pluginAPI.cancelKeyboardResponse(keyboard_listener);
146 |                 
147 |             }
148 |             
149 |             jsPsych.pluginAPI.getKeyboardResponse(after_response, trial.choices, 'date', true);
150 | 
151 |             function endTrial() {
152 |                 clearInterval(animate_interval); // stop animation!
153 |                 display_element.html(''); // clear everything
154 |                 if(trial.timing_post_trial > 0){
155 |                     setTimeout(function() {
156 |                         block.next();
157 |                     }, trial.timing_post_trial);
158 |                 } else {
159 |                     block.next();
160 |                 }
161 |             }
162 |         };
163 | 
164 |         return plugin;
165 |     })();
166 | })(jQuery);
167 | 


--------------------------------------------------------------------------------
/scripts/plugins/jspsych-categorize.js:
--------------------------------------------------------------------------------
  1 | /** 
  2 |  * jspsych plugin for categorization trials with feedback
  3 |  * Josh de Leeuw
  4 |  * 
  5 |  * documentation: https://github.com/jodeleeuw/jsPsych/wiki/jspsych-categorize
  6 | **/
  7 | 
  8 | (function($) {
  9 |     jsPsych.categorize = (function() {
 10 | 
 11 |         var plugin = {};
 12 | 
 13 |         plugin.create = function(params) {
 14 |             
 15 |             params = jsPsych.pluginAPI.enforceArray(params, ['choices', 'stimuli', 'key_answer', 'text_answer', 'data']);
 16 |             
 17 |             var trials = [];
 18 |             for (var i = 0; i < params.stimuli.length; i++) {
 19 |                 trials.push({});
 20 |                 trials[i].type = "categorize";
 21 |                 trials[i].a_path = params.stimuli[i];
 22 |                 trials[i].key_answer = params.key_answer[i];
 23 |                 trials[i].text_answer = (typeof params.text_answer === 'undefined') ? "" : params.text_answer[i];
 24 |                 trials[i].choices = params.choices;
 25 |                 trials[i].correct_text = (typeof params.correct_text === 'undefined') ? "<p class='feedback'>Correct</p>" : params.correct_text;
 26 |                 trials[i].incorrect_text = (typeof params.incorrect_text === 'undefined') ? "<p class='feedback'>Incorrect</p>" : params.incorrect_text;
 27 |                 // timing params
 28 |                 trials[i].timing_stim = params.timing_stim || -1; // default is to show image until response
 29 |                 trials[i].timing_feedback_duration = params.timing_feedback_duration || 2000;
 30 |                 trials[i].timing_post_trial = (typeof params.timing_post_trial === 'undefined') ? 1000 : params.timing_post_trial;
 31 |                 // optional params
 32 |                 trials[i].show_stim_with_feedback = (typeof params.show_stim_with_feedback === 'undefined') ? true : params.show_stim_with_feedback;
 33 |                 trials[i].is_html = (typeof params.is_html === 'undefined') ? false : params.is_html;
 34 |                 trials[i].force_correct_button_press = (typeof params.force_correct_button_press === 'undefined') ? false : params.force_correct_button_press;
 35 |                 trials[i].prompt = (typeof params.prompt === 'undefined') ? '' : params.prompt;
 36 |                 trials[i].data = (typeof params.data === 'undefined') ? {} : params.data[i];
 37 |             }
 38 |             return trials;
 39 |         };
 40 | 
 41 |         var cat_trial_complete = false;
 42 | 
 43 |         plugin.trial = function(display_element, block, trial, part) {
 44 |             
 45 |             // if any trial variables are functions
 46 |             // this evaluates the function and replaces
 47 |             // it with the output of the function
 48 |             trial = jsPsych.pluginAPI.normalizeTrialVariables(trial);
 49 |             
 50 |             switch (part) {
 51 |             case 1:
 52 |                 // set finish flag
 53 |                 cat_trial_complete = false;
 54 | 
 55 |                 if (!trial.is_html) {
 56 |                     // add image to display
 57 |                     display_element.append($('<img>', {
 58 |                         "src": trial.a_path,
 59 |                         "class": 'jspsych-categorize-stimulus',
 60 |                         "id": 'jspsych-categorize-stimulus'
 61 |                     }));
 62 |                 }
 63 |                 else {
 64 |                     display_element.append($('<div>', {
 65 |                         "id": 'jspsych-categorize-stimulus',
 66 |                         "class": 'jspsych-categorize-stimulus',
 67 |                         "html": trial.a_path
 68 |                     }));
 69 |                 }
 70 | 
 71 |                 // hide image after time if the timing parameter is set
 72 |                 if (trial.timing_stim > 0) {
 73 |                     setTimeout(function() {
 74 |                         if (!cat_trial_complete) {
 75 |                             $('#jspsych-categorize-stimulus').css('visibility', 'hidden');
 76 |                         }
 77 |                     }, trial.timing_stim);
 78 |                 }
 79 | 
 80 |                 // if prompt is set, show prompt
 81 |                 if (trial.prompt !== "") {
 82 |                     display_element.append(trial.prompt);
 83 |                 }
 84 | 
 85 |                 // start measuring RT
 86 |                 var startTime = (new Date()).getTime();
 87 | 
 88 |                 // create response function
 89 |                 var after_response = function(info) {
 90 |                     
 91 |                     var correct = false;
 92 |                     if(trial.key_answer == info.key) { correct = true; }
 93 |                     
 94 |                     cat_trial_complete = true;
 95 |                     
 96 |                     // save data
 97 |                     var trial_data = {
 98 |                         "trial_type": "categorize",
 99 |                         "trial_index": block.trial_idx,
100 |                         "rt": info.rt,
101 |                         "correct": correct,
102 |                         "stimulus": trial.a_path,
103 |                         "key_press": info.key
104 |                     };
105 | 
106 |                     block.writeData($.extend({}, trial_data, trial.data));
107 | 
108 |                     display_element.html('');
109 |                     
110 |                     plugin.trial(display_element, block, trial, part + 1);
111 |                 }
112 |                 
113 |                 jsPsych.pluginAPI.getKeyboardResponse(after_response, trial.choices, 'date', false);
114 |                 
115 |                 break;
116 | 
117 |             case 2:
118 |                 // show image during feedback if flag is set
119 |                 if (trial.show_stim_with_feedback) {
120 |                     if (!trial.is_html) {
121 |                         // add image to display
122 |                         display_element.append($('<img>', {
123 |                             "src": trial.a_path,
124 |                             "class": 'jspsych-categorize-stimulus',
125 |                             "id": 'jspsych-categorize-stimulus'
126 |                         }));
127 |                     }
128 |                     else {
129 |                         display_element.append($('<div>', {
130 |                             "id": 'jspsych-categorize-stimulus',
131 |                             "class": 'jspsych-categorize-stimulus',
132 |                             "html": trial.a_path
133 |                         }));
134 |                     }
135 |                 }
136 | 
137 |                 // substitute answer in feedback string.
138 |                 var atext = "";
139 |                 if (block.data[block.trial_idx].correct) {
140 |                     atext = trial.correct_text.replace("%ANS%", trial.text_answer);
141 |                 }
142 |                 else {
143 |                     atext = trial.incorrect_text.replace("%ANS%", trial.text_answer);
144 |                 }
145 | 
146 |                 // show the feedback
147 |                 display_element.append(atext);
148 | 
149 |                 // check if force correct button press is set
150 |                 if (trial.force_correct_button_press && block.data[block.trial_idx].correct === false) {
151 |                     
152 |                     var after_forced_response = function(info) {
153 |                         plugin.trial(display_element, block, trial, part + 1);
154 |                     }
155 |                     
156 |                     jsPsych.pluginAPI.getKeyboardResponse(after_forced_response, trial.key_answer, 'date', false);
157 |                     
158 |                 }
159 |                 else {
160 |                     setTimeout(function() {
161 |                         plugin.trial(display_element, block, trial, part + 1);
162 |                     }, trial.timing_feedback_duration);
163 |                 }
164 |                 break;
165 |             case 3:
166 |                 display_element.html("");
167 |                 if(trial.timing_post_trial > 0){
168 |                     setTimeout(function() {
169 |                         block.next();
170 |                     }, trial.timing_post_trial);
171 |                 } else {
172 |                     block.next();
173 |                 }
174 |                 break;
175 |             }
176 |         };
177 | 
178 |         return plugin;
179 |     })();
180 | })(jQuery);
181 | 


--------------------------------------------------------------------------------
/scripts/plugins/jspsych-free-sort.js:
--------------------------------------------------------------------------------
  1 | /**
  2 |  * jspsych-free-sort
  3 |  * plugin for drag-and-drop sorting of a collection of images
  4 |  * Josh de Leeuw
  5 |  * 
  6 |  * documentation: https://github.com/jodeleeuw/jsPsych/wiki/jspsych-free-sort
  7 |  */
  8 | 
  9 | (function($) {
 10 |     jsPsych['free-sort'] = (function() {
 11 | 
 12 |         var plugin = {};
 13 | 
 14 |         plugin.create = function(params) {
 15 | 
 16 |             params = jsPsych.pluginAPI.enforceArray(params, ['data']);
 17 | 
 18 |             var trials = new Array(params.stimuli.length);
 19 |             for (var i = 0; i < trials.length; i++) {
 20 |                 trials[i] = {
 21 |                     "type": "free-sort",
 22 |                     "images": params.stimuli[i], // array of images to display
 23 |                     "stim_height": params.stim_height || 100,
 24 |                     "stim_width": params.stim_width || 100,
 25 |                     "timing_post_trial": (typeof params.timing_post_trial === 'undefined') ? 1000 : params.timing_post_trial,
 26 |                     "prompt": (typeof params.prompt === 'undefined') ? '' : params.prompt,
 27 |                     "prompt_location": params.prompt_location || "above",
 28 |                     "sort_area_width": params.sort_area_width || 800,
 29 |                     "sort_area_height": params.sort_area_height || 800,
 30 |                     "data": (typeof params.data === 'undefined') ? {} : params.data[i]
 31 |                 };
 32 |             }
 33 |             return trials;
 34 |         };
 35 | 
 36 |         plugin.trial = function(display_element, block, trial, part) {
 37 |             
 38 |             // if any trial variables are functions
 39 |             // this evaluates the function and replaces
 40 |             // it with the output of the function
 41 |             trial = jsPsych.pluginAPI.normalizeTrialVariables(trial);
 42 | 
 43 |             var start_time = (new Date()).getTime();
 44 | 
 45 |             // check if there is a prompt and if it is shown above
 46 |             if (trial.prompt && trial.prompt_location == "above") {
 47 |                 display_element.append(trial.prompt);
 48 |             }
 49 | 
 50 |             display_element.append($('<div>', {
 51 |                 "id": "jspsych-free-sort-arena",
 52 |                 "class": "jspsych-free-sort-arena",
 53 |                 "css": {
 54 |                     "position": "relative",
 55 |                     "width": trial.sort_area_width,
 56 |                     "height": trial.sort_area_height
 57 |                 }
 58 |             }));
 59 | 
 60 |             // check if prompt exists and if it is shown below
 61 |             if (trial.prompt && trial.prompt_location == "below") {
 62 |                 display_element.append(trial.prompt);
 63 |             }
 64 | 
 65 |             // store initial location data
 66 |             var init_locations = [];
 67 | 
 68 |             for (var i = 0; i < trial.images.length; i++) {
 69 |                 var coords = random_coordinate(trial.sort_area_width - trial.stim_width, trial.sort_area_height - trial.stim_height);
 70 | 
 71 |                 $("#jspsych-free-sort-arena").append($('<img>', {
 72 |                     "src": trial.images[i],
 73 |                     "class": "jspsych-free-sort-draggable",
 74 |                     "css": {
 75 |                         "position": "absolute",
 76 |                         "top": coords.y,
 77 |                         "left": coords.x
 78 |                     }
 79 |                 }));
 80 | 
 81 |                 init_locations.push({
 82 |                     "src": trial.images[i],
 83 |                     "x": coords.x,
 84 |                     "y": coords.y
 85 |                 });
 86 |             }
 87 | 
 88 |             var moves = [];
 89 | 
 90 |             $('.jspsych-free-sort-draggable').draggable({
 91 |                 containment: "#jspsych-free-sort-arena",
 92 |                 scroll: false,
 93 |                 stack: ".jspsych-free-sort-draggable",
 94 |                 stop: function(event, ui) {
 95 |                     moves.push({
 96 |                         "src": event.target.src.split("/").slice(-1)[0],
 97 |                         "x": ui.position.left,
 98 |                         "y": ui.position.top
 99 |                     });
100 |                 }
101 |             });
102 | 
103 |             display_element.append($('<button>', {
104 |                 "id": "jspsych-free-sort-done-btn",
105 |                 "class": "jspsych-free-sort",
106 |                 "html": "Done",
107 |                 "click": function() {
108 |                     var end_time = (new Date()).getTime();
109 |                     var rt = end_time - start_time;
110 |                     // gather data
111 |                     // get final position of all objects
112 |                     var final_locations = [];
113 |                     $('.jspsych-free-sort-draggable').each(function() {
114 |                         final_locations.push({
115 |                             "src": $(this).attr('src'),
116 |                             "x": $(this).css('left'),
117 |                             "y": $(this).css('top')
118 |                         });
119 |                     });
120 | 
121 |                     block.writeData($.extend({}, {
122 |                         "init_locations": JSON.stringify(init_locations),
123 |                         "moves": JSON.stringify(moves),
124 |                         "final_locations": JSON.stringify(final_locations),
125 |                         "rt": rt
126 |                     }, trial.data));
127 | 
128 |                     // advance to next part
129 |                     display_element.html("");
130 |                     if (trial.timing_post_trial > 0) {
131 |                         setTimeout(function() {
132 |                             block.next();
133 |                         }, trial.timing_post_trial);
134 |                     }
135 |                     else {
136 |                         block.next();
137 |                     }
138 |                 }
139 |             }));
140 | 
141 |         };
142 | 
143 |         // helper functions
144 | 
145 |         function random_coordinate(max_width, max_height) {
146 |             var rnd_x = Math.floor(Math.random() * (max_width - 1));
147 |             var rnd_y = Math.floor(Math.random() * (max_height - 1));
148 | 
149 |             return {
150 |                 x: rnd_x,
151 |                 y: rnd_y
152 |             };
153 |         }
154 | 
155 |         return plugin;
156 |     })();
157 | })(jQuery);
158 | 


--------------------------------------------------------------------------------
/scripts/plugins/jspsych-html.js:
--------------------------------------------------------------------------------
 1 | /** (July 2012, Erik Weitnauer)
 2 | The html-plugin will load and display an arbitrary number of html pages. To proceed to the next, the
 3 | user might either press a button on the page or a specific key. Afterwards, the page get hidden and
 4 | the plugin will wait of a specified time before it proceeds.
 5 | 
 6 | documentation: https://github.com/jodeleeuw/jsPsych/wiki/jspsych-html
 7 | */
 8 | (function($) {
 9 |     jsPsych.html = (function() {
10 | 
11 |         var plugin = {};
12 | 
13 |         plugin.create = function(params) {
14 |             
15 |             params = jsPsych.pluginAPI.enforceArray(params, ['pages']);
16 |             
17 |             var trials = [];
18 |             
19 |             
20 |             for (var i = 0; i < params.pages.length; i++) {
21 |                 trials.push({
22 |                     type: "html",
23 |                     url: params.pages[i].url,
24 |                     cont_key: params.pages[i].cont_key || params.cont_key,
25 |                     cont_btn: params.pages[i].cont_btn || params.cont_btn,
26 |                     timing_post_trial: params.pages[i].timing_post_trial || (typeof params.timing_post_trial === 'undefined') ? 1000 : params.timing_post_trial,
27 |                     check_fn: params.pages[i].check_fn,
28 |                     force_refresh: (typeof params.force_refresh === 'undefined') ? false : params.force_refresh
29 |                 });
30 |             }
31 |             return trials;
32 |         };
33 | 
34 |         plugin.trial = function(display_element, block, trial, part) {
35 |             
36 |             // if any trial variables are functions
37 |             // this evaluates the function and replaces
38 |             // it with the output of the function
39 |             trial = jsPsych.pluginAPI.normalizeTrialVariables(trial, ["check_fn"]);
40 | 
41 |             var url = trial.url;
42 |             if (trial.force_refresh) {
43 |                 url = trial.url + "?time=" + (new Date().getTime());
44 |             }
45 | 
46 |             display_element.load(trial.url, function() {
47 |                 var t0 = (new Date()).getTime();
48 |                 var finish = function() {
49 |                     if (trial.check_fn && !trial.check_fn(display_element)) return;
50 |                     if (trial.cont_key) $(document).unbind('keydown', key_listener);
51 |                     block.writeData({
52 |                         trial_type: "html",
53 |                         trial_index: block.trial_idx,
54 |                         rt: (new Date()).getTime() - t0,
55 |                         url: trial.url
56 |                     });
57 |                     if (trial.timing_post_trial > 0) {
58 |                         // hide display_element, since it could have a border and we want a blank screen during timing
59 |                         display_element.hide();
60 |                         setTimeout(function() {
61 |                             display_element.empty();
62 |                             display_element.show();
63 |                             block.next();
64 |                         }, trial.timing);
65 |                     }
66 |                     else {
67 |                         display_element.empty();
68 |                         block.next();
69 |                     }
70 |                 };
71 |                 if (trial.cont_btn) $('#' + trial.cont_btn).click(finish);
72 |                 if (trial.cont_key) {
73 |                     var key_listener = function(e) {
74 |                         if (e.which == trial.cont_key) finish();
75 |                     };
76 |                     $(document).keydown(key_listener);
77 |                 }
78 |             });
79 |         };
80 | 
81 |         return plugin;
82 |     })();
83 | })(jQuery);
84 | 


--------------------------------------------------------------------------------
/scripts/plugins/jspsych-palmer.js:
--------------------------------------------------------------------------------
  1 | /** 
  2 |  * jspsych-palmer
  3 |  * Josh de Leeuw (October 2013)
  4 |  * 
  5 |  * a jspsych plugin for presenting and querying about stimuli modeled after
  6 |  *
  7 |  * Palmer, S. (1977). Hierarchical Structure in Perceptual Representation. Cognitive Psychology, 9, 441.
  8 |  *
  9 |  * and
 10 |  *
 11 |  * Goldstone, R. L., Rogosky, B. J., Pevtzow, R., & Blair, M. (2005). Perceptual and semantic reorganization during category learning. 
 12 |  * In H. Cohen & C. Lefebvre (Eds.) Handbook of Categorization in Cognitive Science. (pp. 651-678). Amsterdam: Elsevier.
 13 |  *
 14 |  * documentation: https://github.com/jodeleeuw/jsPsych/wiki/jspsych-palmer
 15 |  *
 16 |  */
 17 | 
 18 | (function($) {
 19 |     jsPsych.palmer = (function() {
 20 | 
 21 |         var plugin = {};
 22 | 
 23 |         plugin.create = function(params) {
 24 |             
 25 |             params = jsPsych.pluginAPI.enforceArray(params, ['data']);
 26 |             
 27 |             var trials = [];
 28 |             for (var i = 0; i < params.configurations.length; i++) {
 29 |                 var trial = {
 30 |                     type: "palmer",
 31 |                     configurations: params.configurations[i],
 32 |                     editable: (typeof params.editable === 'undefined') ? false : params.editable,
 33 |                     show_feedback: (typeof params.show_feedback === 'undefined') ? false : params.show_feedback,
 34 |                     grid_spacing: params.grid_spacing || 75,
 35 |                     square_size: params.square_size || 3,
 36 |                     circle_radius: params.circle_radius || 20,
 37 |                     timing_item: params.timing_item || 1000,
 38 |                     timing_post_trial: (typeof params.timing_post_trial === 'undefined') ? 1000 : params.timing_post_trial,
 39 |                     timing_feedback: params.timing_feedback || 1000,
 40 |                     prompt: (typeof params.prompt === 'undefined') ? "" : params.prompt,
 41 |                     data: (typeof params.data === 'undefined') ? {} : params.data[i]
 42 |                 };
 43 | 
 44 |                 trials.push(trial);
 45 |             }
 46 |             return trials;
 47 |         };
 48 | 
 49 |         plugin.trial = function(display_element, block, trial, part) {
 50 | 
 51 |             // if any trial variables are functions
 52 |             // this evaluates the function and replaces
 53 |             // it with the output of the function
 54 |             trial = jsPsych.pluginAPI.normalizeTrialVariables(trial);
 55 | 
 56 |             // variables to keep track of user interaction
 57 |             var start_circle = -1;
 58 |             var end_circle = -1;
 59 |             var line_started = false;
 60 | 
 61 |             var size = trial.grid_spacing * (trial.square_size + 1);
 62 | 
 63 |             display_element.append($("<div id='jspsych-palmer-raphaelCanvas'>", {
 64 |                 css: {
 65 |                     width: size + "px",
 66 |                     height: size + "px"
 67 |                 }
 68 |             }));
 69 | 
 70 |             var paper = Raphael("jspsych-palmer-raphaelCanvas", size, size);
 71 | 
 72 |             // create the circles at the vertices.
 73 |             var circles = [];
 74 |             var node_idx = 0;
 75 |             for (var i = 1; i <= trial.square_size; i++) {
 76 |                 for (var j = 1; j <= trial.square_size; j++) {
 77 |                     var circle = paper.circle(trial.grid_spacing * j, trial.grid_spacing * i, trial.circle_radius);
 78 |                     circle.attr("fill", "#000").attr("stroke-width", "0").attr("stroke", "#000").data("node", node_idx);
 79 | 
 80 |                     if (trial.editable) {
 81 |                         circle.hover(
 82 | 
 83 |                         function() {
 84 |                             this.attr("stroke-width", "2");
 85 |                             //this.attr("stroke", "#000");
 86 |                         },
 87 | 
 88 |                         function() {
 89 |                             this.attr("stroke-width", "0");
 90 |                             //this.attr("stroke", "#fff")
 91 |                         }).click(
 92 | 
 93 |                         function() {
 94 |                             if (!line_started) {
 95 |                                 line_started = true;
 96 |                                 start_circle = this.data("node");
 97 |                                 this.attr("fill", "#777").attr("stroke", "#777");
 98 |                             }
 99 |                             else {
100 |                                 end_circle = this.data("node");
101 |                                 draw_connection(start_circle, end_circle);
102 |                             }
103 |                         });
104 |                     }
105 |                     node_idx++;
106 |                     circles.push(circle);
107 |                 }
108 |             }
109 | 
110 |             function draw_connection(start_circle, end_circle) {
111 |                 var the_line = getLineIndex(start_circle, end_circle);
112 |                 if (the_line > -1) {
113 |                     toggle_line(the_line);
114 |                 }
115 |                 // reset highlighting on circles
116 |                 for (var i = 0; i < circles.length; i++) {
117 |                     circles[i].attr("fill", "#000").attr("stroke", "#000");
118 |                 }
119 |                 // cleanup the variables
120 |                 line_started = false;
121 |                 start_circle = -1;
122 |                 end_circle = -1;
123 |             }
124 | 
125 |             // create all possible lines that connect circles
126 |             var horizontal_lines = [];
127 |             var vertical_lines = [];
128 |             var backslash_lines = [];
129 |             var forwardslash_lines = [];
130 | 
131 |             for (var i = 0; i < trial.square_size; i++) {
132 |                 for (var j = 0; j < trial.square_size; j++) {
133 |                     var current_item = (i * trial.square_size) + j;
134 |                     // add horizontal connections
135 |                     if (j < (trial.square_size - 1)) {
136 |                         horizontal_lines.push([current_item, current_item + 1]);
137 |                     }
138 |                     // add vertical connections
139 |                     if (i < (trial.square_size - 1)) {
140 |                         vertical_lines.push([current_item, current_item + trial.square_size]);
141 |                     }
142 |                     // add diagonal backslash connections
143 |                     if (i < (trial.square_size - 1) && j < (trial.square_size - 1)) {
144 |                         backslash_lines.push([current_item, current_item + trial.square_size + 1]);
145 |                     }
146 |                     // add diagonal forwardslash connections
147 |                     if (i < (trial.square_size - 1) && j > 0) {
148 |                         forwardslash_lines.push([current_item, current_item + trial.square_size - 1]);
149 |                     }
150 |                 }
151 |             }
152 | 
153 |             var lines = horizontal_lines.concat(vertical_lines).concat(backslash_lines).concat(forwardslash_lines);
154 | 
155 |             // actually draw the lines
156 |             var lineIsVisible = [];
157 |             var lineElements = [];
158 | 
159 |             for (var i = 0; i < lines.length; i++) {
160 |                 var line = paper.path("M" + circles[lines[i][0]].attr("cx") + " " + circles[lines[i][0]].attr("cy") + "L" + circles[lines[i][1]].attr("cx") + " " + circles[lines[i][1]].attr("cy")).attr("stroke-width", "8").attr("stroke", "#000");
161 |                 line.hide();
162 |                 lineElements.push(line);
163 |                 lineIsVisible.push(0);
164 |             }
165 | 
166 |             // define some helper functions to toggle lines on and off
167 | 
168 |             // this function gets the index of a line based on the two circles it connects
169 |             function getLineIndex(start_circle, end_circle) {
170 |                 var the_line = -1;
171 |                 for (var i = 0; i < lines.length; i++) {
172 |                     if ((start_circle == lines[i][0] && end_circle == lines[i][1]) || (start_circle == lines[i][1] && end_circle == lines[i][0])) {
173 |                         the_line = i;
174 |                         break;
175 |                     }
176 |                 }
177 |                 return the_line;
178 |             }
179 | 
180 |             // this function turns a line on/off based on the index (the_line)
181 |             function toggle_line(the_line) {
182 |                 if (the_line > -1) {
183 |                     if (lineIsVisible[the_line] === 0) {
184 |                         lineElements[the_line].show();
185 |                         lineElements[the_line].toBack();
186 |                         lineIsVisible[the_line] = 1;
187 |                     }
188 |                     else {
189 |                         lineElements[the_line].hide();
190 |                         lineElements[the_line].toBack();
191 |                         lineIsVisible[the_line] = 0;
192 |                     }
193 |                 }
194 |             }
195 | 
196 |             // this function takes an array of length = num lines, and displays the line whereever there
197 |             // is a 1 in the array.
198 |             function showConfiguration(configuration) {
199 |                 for (var i = 0; i < configuration.length; i++) {
200 |                     if (configuration[i] != lineIsVisible[i]) {
201 |                         toggle_line(i);
202 |                     }
203 |                 }
204 |             }
205 | 
206 |             // highlight a line
207 |             function highlightLine(line) {
208 |                 lineElements[line].attr("stroke", "#f00");
209 |             }
210 | 
211 |             // start recording the time
212 |             var startTime = (new Date()).getTime();
213 | 
214 |             // what kind of trial are we doing?
215 |             // if trial.editable is true, then we will let the user interact with the stimulus to create
216 |             // something, e.g. for a reconstruction probe.
217 |             // need a way for the user to submit when they are done in that case...
218 |             if (trial.editable) {
219 |                 display_element.append($('<button id="jspsych-palmer-submitButton" type="button">Submit Answer</button>'));
220 |                 $('#jspsych-palmer-submitButton').click(function() {
221 |                     save_data();
222 |                 });
223 |             }
224 | 
225 |             // if trial.editable is false, then we are just showing a pre-determined configuration.
226 |             // for now, the only option will be to display for a fixed amount of time.
227 |             // future ideas: allow for key response, to enable things like n-back, same/different, etc..
228 |             if (!trial.editable) {
229 |                 showConfiguration(trial.configurations);
230 | 
231 |                 setTimeout(function() {
232 |                     save_data();
233 |                 }, trial.timing_item);
234 |             }
235 | 
236 |             if (trial.prompt !== "") {
237 |                 display_element.append($('<div id="jspsych-palmer-prompt">'));
238 |                 $("#jspsych-palmer-prompt").html(trial.prompt);
239 |             }
240 | 
241 |             function arrayDifferences(arr1, arr2) {
242 |                 var n_diff = 0;
243 |                 for (var i = 0; i < arr1.length; i++) {
244 |                     if (arr1[i] != arr2[i]) {
245 |                         n_diff++;
246 |                     }
247 |                 }
248 |                 return n_diff;
249 |             }
250 | 
251 |             // save data
252 |             function save_data() {
253 | 
254 |                 // measure RT
255 |                 var endTime = (new Date()).getTime();
256 |                 var response_time = endTime - startTime;
257 | 
258 |                 // check if configuration is correct
259 |                 // this is meaningless for trials where the user can't edit
260 |                 var n_diff = arrayDifferences(trial.configurations, lineIsVisible);
261 |                 var correct = (n_diff === 0);
262 | 
263 |                 block.writeData($.extend({}, {
264 |                     "trial_type": "palmer",
265 |                     "trial_index": block.trial_idx,
266 |                     "configuration": JSON.stringify(lineIsVisible),
267 |                     "target_configuration": JSON.stringify(trial.configurations),
268 |                     "rt": response_time,
269 |                     "correct": correct,
270 |                     "num_wrong": n_diff,
271 |                 }, trial.data));
272 | 
273 |                 if (trial.editable && trial.show_feedback) {
274 |                     // hide the button
275 |                     $('#jspsych-palmer-submitButton').hide();
276 |                     $('#jspsych-palmer-prompt').hide();
277 | 
278 |                     showConfiguration(trial.configurations);
279 |                     var feedback = "";
280 |                     if (correct) {
281 |                         feedback = "Correct!";
282 |                     }
283 |                     else {
284 |                         if (n_diff > 1) {
285 |                             feedback = "You missed " + n_diff + " lines. The correct symbol is shown above.";
286 |                         }
287 |                         else {
288 |                             feedback = "You missed 1 line. The correct symbol is shown above.";
289 |                         }
290 |                     }
291 |                     display_element.append($.parseHTML("<p id='jspsych-palmer-feedback'>" + feedback + "</p>"));
292 | 
293 |                     setTimeout(function() {
294 |                         next_trial();
295 |                     }, trial.timing_feedback);
296 | 
297 |                 }
298 |                 else {
299 |                     next_trial();
300 |                 }
301 |             }
302 | 
303 |             function next_trial() {
304 | 
305 |                 display_element.html('');
306 | 
307 |                 // next trial
308 |                 if (trial.timing_post_trial > 0) {
309 |                     setTimeout(function() {
310 |                         block.next();
311 |                     }, trial.timing_post_trial);
312 |                 }
313 |                 else {
314 |                     block.next();
315 |                 }
316 | 
317 |             }
318 | 
319 | 
320 |         };
321 |         
322 |         // method for drawing palmer stimuli.
323 |         // returns the string description of svg element containing the stimulus
324 |         // requires raphaeljs library -> www.raphaeljs.com
325 |         
326 |         plugin.generate_stimulus = function(square_size, grid_spacing, circle_radius, configuration) {
327 | 
328 |             // create a div to hold the generated svg object
329 |             var stim_div = $('body').append('<div id="jspsych-palmer-temp-stim"></div>');
330 | 
331 |             var size = grid_spacing * (square_size + 1);
332 | 
333 |             // create the svg raphael object
334 |             var paper = Raphael("jspsych-palmer-temp-stim", size, size);
335 | 
336 |             // create the circles at the vertices.
337 |             var circles = [];
338 |             var node_idx = 0;
339 |             for (var i = 1; i <= square_size; i++) {
340 |                 for (var j = 1; j <= square_size; j++) {
341 |                     var circle = paper.circle(grid_spacing * j, grid_spacing * i, circle_radius);
342 |                     circle.attr("fill", "#000").attr("stroke-width", "0").attr("stroke", "#000").data("node", node_idx);
343 |                     node_idx++;
344 |                     circles.push(circle);
345 |                 }
346 |             }
347 | 
348 |             // create all possible lines that connect circles
349 |             var horizontal_lines = [];
350 |             var vertical_lines = [];
351 |             var backslash_lines = [];
352 |             var forwardslash_lines = [];
353 | 
354 |             for (var i = 0; i < square_size; i++) {
355 |                 for (var j = 0; j < square_size; j++) {
356 |                     var current_item = (i * square_size) + j;
357 |                     // add horizontal connections
358 |                     if (j < (square_size - 1)) {
359 |                         horizontal_lines.push([current_item, current_item + 1]);
360 |                     }
361 |                     // add vertical connections
362 |                     if (i < (square_size - 1)) {
363 |                         vertical_lines.push([current_item, current_item + square_size]);
364 |                     }
365 |                     // add diagonal backslash connections
366 |                     if (i < (square_size - 1) && j < (square_size - 1)) {
367 |                         backslash_lines.push([current_item, current_item + square_size + 1]);
368 |                     }
369 |                     // add diagonal forwardslash connections
370 |                     if (i < (square_size - 1) && j > 0) {
371 |                         forwardslash_lines.push([current_item, current_item + square_size - 1]);
372 |                     }
373 |                 }
374 |             }
375 | 
376 |             var lines = horizontal_lines.concat(vertical_lines).concat(backslash_lines).concat(forwardslash_lines);
377 | 
378 |             // actually draw the lines
379 |             var lineIsVisible = [];
380 |             var lineElements = [];
381 | 
382 |             for (var i = 0; i < lines.length; i++) {
383 |                 var line = paper.path("M" + circles[lines[i][0]].attr("cx") + " " + circles[lines[i][0]].attr("cy") + "L" + circles[lines[i][1]].attr("cx") + " " + circles[lines[i][1]].attr("cy")).attr("stroke-width", "8").attr("stroke", "#000");
384 |                 line.hide();
385 |                 lineElements.push(line);
386 |                 lineIsVisible.push(0);
387 |             }
388 | 
389 |             // define some helper functions to toggle lines on and off
390 | 
391 |             // this function turns a line on/off based on the index (the_line)
392 |             function toggle_line(the_line) {
393 |                 if (the_line > -1) {
394 |                     if (lineIsVisible[the_line] === 0) {
395 |                         lineElements[the_line].show();
396 |                         lineElements[the_line].toBack();
397 |                         lineIsVisible[the_line] = 1;
398 |                     }
399 |                     else {
400 |                         lineElements[the_line].hide();
401 |                         lineElements[the_line].toBack();
402 |                         lineIsVisible[the_line] = 0;
403 |                     }
404 |                 }
405 |             }
406 | 
407 |             // displays the line wherever there
408 |             // is a 1 in the array.
409 |             // showConfiguration(configuration) 
410 |             for (var i = 0; i < configuration.length; i++) {
411 |                 if (configuration[i] == 1) {
412 |                     toggle_line(i);
413 |                 }
414 |             }
415 | 
416 | 
417 |             var svg = $("#jspsych-palmer-temp-stim").html();
418 | 
419 |             $('#jspsych-palmer-temp-stim').remove();
420 | 
421 |             return svg;
422 |         };
423 | 
424 |         return plugin;
425 |     })();
426 | })(jQuery);
427 | 


--------------------------------------------------------------------------------
/scripts/plugins/jspsych-same-different.js:
--------------------------------------------------------------------------------
  1 | /**
  2 |  * jspsych-same-different
  3 |  * Josh de Leeuw
  4 |  * 
  5 |  * plugin for showing two stimuli sequentially and getting a same / different judgment
  6 |  * 
  7 |  * documentation: https://github.com/jodeleeuw/jsPsych/wiki/jspsych-same-different
  8 |  * 
  9 |  */ 
 10 | (function($) {
 11 |     jsPsych['same-different'] = (function() {
 12 | 
 13 |         var plugin = {};
 14 | 
 15 |         plugin.create = function(params) {
 16 |             
 17 |             params = jsPsych.pluginAPI.enforceArray(params, ['data','answer'])
 18 |             
 19 |             var trials = new Array(params.stimuli.length);
 20 |             for (var i = 0; i < trials.length; i++) {
 21 |                 trials[i] = {};
 22 |                 trials[i].type = "same-different";
 23 |                 trials[i].a_path = params.stimuli[i][0];
 24 |                 trials[i].b_path = params.stimuli[i][1];
 25 |                 trials[i].answer = params.answer[i];
 26 |                 trials[i].same_key = params.same_key || 81; // default is 'q'
 27 |                 trials[i].different_key = params.different_key || 80; // default is 'p'
 28 |                 // timing parameters
 29 |                 trials[i].timing_first_stim = params.timing_first_stim || 1000;
 30 |                 trials[i].timing_second_stim = params.timing_second_stim || 1000; // if -1, then second stim is shown until response.
 31 |                 trials[i].timing_gap = params.timing_gap || 500;
 32 |                 trials[i].timing_post_trial = (typeof params.timing_post_trial === 'undefined') ? 1000 : params.timing_post_trial;
 33 |                 // optional parameters
 34 |                 trials[i].is_html = (typeof params.is_html === 'undefined') ? false : true;
 35 |                 trials[i].prompt = (typeof params.prompt === 'undefined') ? "" : params.prompt;
 36 |                 trials[i].data = (typeof params.data === 'undefined') ? {} : params.data[i];
 37 |             }
 38 |             return trials;
 39 |         };
 40 | 
 41 |         var sd_trial_complete = false;
 42 | 
 43 |         plugin.trial = function(display_element, block, trial, part) {
 44 |             
 45 |             // if any trial variables are functions
 46 |             // this evaluates the function and replaces
 47 |             // it with the output of the function
 48 |             trial = jsPsych.pluginAPI.normalizeTrialVariables(trial);
 49 |             
 50 |             
 51 |             switch (part) {
 52 |             case 1:
 53 |                 sd_trial_complete = false;
 54 |                 // show image
 55 |                 if (!trial.is_html) {
 56 |                     display_element.append($('<img>', {
 57 |                         src: trial.a_path,
 58 |                         "class": 'jspsych-same-different-stimulus'
 59 |                     }));
 60 |                 }
 61 |                 else {
 62 |                     display_element.append($('<div>', {
 63 |                         html: trial.a_path,
 64 |                         "class": 'jspsych-same-different-stimulus'
 65 |                     }));
 66 |                 }
 67 |                 setTimeout(function() {
 68 |                     plugin.trial(display_element, block, trial, part + 1);
 69 |                 }, trial.timing_first_stim);
 70 |                 break;
 71 |             case 2:
 72 |                 $('.jspsych-same-different-stimulus').remove();
 73 |                 setTimeout(function() {
 74 |                     plugin.trial(display_element, block, trial, part + 1);
 75 |                 }, trial.timing_gap);
 76 |                 break;
 77 |             case 3:
 78 |                 if (!trial.is_html) {
 79 |                     display_element.append($('<img>', {
 80 |                         src: trial.b_path,
 81 |                         "class": 'jspsych-same-different-stimulus',
 82 |                         id: 'jspsych-same-different-second-stimulus'
 83 |                     }));
 84 |                 }
 85 |                 else {
 86 |                     display_element.append($('<div>', {
 87 |                         html: trial.b_path,
 88 |                         "class": 'jspsych-same-different-stimulus',
 89 |                         id: 'jspsych-same-different-second-stimulus'
 90 |                     }));
 91 |                 }
 92 | 
 93 |                 if (trial.timing_second_stim > 0) {
 94 |                     setTimeout(function() {
 95 |                         if (!sd_trial_complete) {
 96 |                             $("#jspsych-same-different-second-stimulus").css('visibility', 'hidden');
 97 |                         }
 98 |                     }, trial.timing_second_stim);
 99 |                 }
100 |                 
101 |                 //show prompt here
102 |                 if (trial.prompt !== "") {
103 |                     display_element.append(trial.prompt);
104 |                 }
105 | 
106 |                 var after_response = function(info){
107 |                     
108 |                     var correct = false;
109 |                     
110 |                     if(info.key == trial.same_key && trial.answer == 'same'){
111 |                         correct = true;
112 |                     }
113 |                     
114 |                     if(info.key == trial.different_key && trial.answer == 'different'){
115 |                         correct = true;
116 |                     }
117 |                     
118 |                     var trial_data = {
119 |                         "trial_type": "same-different",
120 |                         "trial_index": block.trial_idx,
121 |                         "rt": info.rt,
122 |                         "correct": correct,
123 |                         "stimulus": trial.a_path,
124 |                         "stimulus_2": trial.b_path,
125 |                         "key_press": info.key
126 |                     };
127 |                     block.writeData($.extend({}, trial_data, trial.data));
128 |                     
129 |                     display_element.html('');
130 |                     
131 |                     if(trial.timing_post_trial > 0) {
132 |                         setTimeout(function() {
133 |                             block.next();
134 |                         }, trial.timing_post_trial);
135 |                     } else {
136 |                         block.next();
137 |                     }
138 |                 }
139 |                 
140 |                 jsPsych.pluginAPI.getKeyboardResponse(after_response, [trial.same_key, trial.different_key], 'date', false);
141 |                 
142 |                 break;
143 |             }
144 |         };
145 | 
146 |         return plugin;
147 |     })();
148 | })(jQuery);
149 | 


--------------------------------------------------------------------------------
/scripts/plugins/jspsych-similarity.js:
--------------------------------------------------------------------------------
  1 | /** 
  2 |  * jspsych-similarity.js
  3 |  * Josh de Leeuw
  4 |  * 
  5 |  * This plugin create a trial where two images are shown sequentially, and the subject rates their similarity using a slider controlled with the mouse.
  6 |  *
  7 |  * documentation: https://github.com/jodeleeuw/jsPsych/wiki/jspsych-similarity
  8 |  * 
  9 |  */
 10 | 
 11 | (function($) {
 12 |     jsPsych.similarity = (function() {
 13 | 
 14 |         var plugin = {};
 15 | 
 16 |         plugin.create = function(params) {
 17 |             
 18 |             jsPsych.pluginAPI.enforceArray(params, ['data']);
 19 |             
 20 |             var trials = new Array(params.stimuli.length);
 21 |             for (var i = 0; i < trials.length; i++) {
 22 |                 trials[i] = {};
 23 |                 trials[i].type = "similarity";
 24 |                 trials[i].a_path = params.stimuli[i][0];
 25 |                 trials[i].b_path = params.stimuli[i][1];
 26 |                 trials[i].labels = (typeof params.labels === 'undefined') ? ["Not at all similar", "Identical"] : params.labels;
 27 |                 trials[i].intervals = params.intervals || 100;
 28 |                 trials[i].show_ticks = (typeof params.show_ticks === 'undefined') ? false : params.show_ticks;
 29 | 
 30 |                 trials[i].show_response = params.show_response || "SECOND_STIMULUS";
 31 | 
 32 |                 trials[i].timing_first_stim = params.timing_first_stim || 1000; // default 1000ms
 33 |                 trials[i].timing_second_stim = params.timing_second_stim || -1; // -1 = inf time; positive numbers = msec to display second image.
 34 |                 trials[i].timing_image_gap = params.timing_image_gap || 1000; // default 1000ms
 35 |                 trials[i].timing_post_trial = (typeof params.timing_post_trial === 'undefined') ? 1000 : params.timing_post_trial; // default 1000ms
 36 | 
 37 |                 trials[i].is_html = (typeof params.is_html === 'undefined') ? false : params.is_html;
 38 |                 trials[i].prompt = (typeof params.prompt === 'undefined') ? '' : params.prompt;
 39 |                 trials[i].data = (typeof params.data === 'undefined') ? {} : params.data[i];
 40 |             }
 41 |             return trials;
 42 |         };
 43 | 
 44 |         var sim_trial_complete = false;
 45 | 
 46 |         plugin.trial = function(display_element, block, trial, part) {
 47 |             
 48 |             // if any trial variables are functions
 49 |             // this evaluates the function and replaces
 50 |             // it with the output of the function
 51 |             trial = jsPsych.pluginAPI.normalizeTrialVariables(trial);
 52 |             
 53 |             switch (part) {
 54 |             case 1:
 55 |                 sim_trial_complete = false;
 56 |                 // show the images
 57 |                 if (!trial.is_html) {
 58 |                     display_element.append($('<img>', {
 59 |                         "src": trial.a_path,
 60 |                         "id": 'jspsych_sim_stim'
 61 |                     }));
 62 |                 }
 63 |                 else {
 64 |                     display_element.append($('<div>', {
 65 |                         "html": trial.a_path,
 66 |                         "id": 'jspsych_sim_stim'
 67 |                     }));
 68 |                 }
 69 | 
 70 |                 if (trial.show_response == "FIRST_STIMULUS") {
 71 |                     show_response_slider(display_element, trial, block);
 72 |                 }
 73 | 
 74 |                 setTimeout(function() {
 75 |                     plugin.trial(display_element, block, trial, part + 1);
 76 |                 }, trial.timing_first_stim);
 77 |                 break;
 78 | 
 79 |             case 2:
 80 | 
 81 |                 $('#jspsych_sim_stim').css('visibility', 'hidden');
 82 | 
 83 |                 setTimeout(function() {
 84 |                     plugin.trial(display_element, block, trial, part + 1);
 85 |                 }, trial.timing_image_gap);
 86 |                 break;
 87 | 
 88 |             case 3:
 89 | 
 90 |                 if (!trial.is_html) {
 91 |                     $('#jspsych_sim_stim').attr('src', trial.b_path);
 92 |                 }
 93 |                 else {
 94 |                     $('#jspsych_sim_stim').html(trial.b_path);
 95 |                 }
 96 | 
 97 |                 $('#jspsych_sim_stim').css('visibility', 'visible');
 98 | 
 99 |                 if (trial.show_response == "SECOND_STIMULUS") {
100 |                     show_response_slider(display_element, trial, block);
101 |                 }
102 | 
103 |                 if (trial.timing_second_stim > 0) {
104 |                     setTimeout(function() {
105 |                         if (!sim_trial_complete) {
106 |                             $("#jspsych_sim_stim").css('visibility', 'hidden');
107 |                             if (trial.show_response == "POST_STIMULUS") {
108 |                                 show_response_slider(display_element, trial, block);
109 |                             }
110 |                         }
111 |                     }, trial.timing_second_stim);
112 |                 }
113 | 
114 |                 break;
115 |             }
116 |         };
117 | 
118 |         function show_response_slider(display_element, trial, block) {
119 | 
120 |             var startTime = (new Date()).getTime();
121 | 
122 |             // create slider
123 |             display_element.append($('<div>', {
124 |                 "id": 'slider',
125 |                 "class": 'sim'
126 |             }));
127 | 
128 |             $("#slider").slider({
129 |                 value: Math.ceil(trial.intervals / 2),
130 |                 min: 1,
131 |                 max: trial.intervals,
132 |                 step: 1,
133 |             });
134 | 
135 |             // show tick marks
136 |             if (trial.show_ticks) {
137 |                 for (var j = 1; j < trial.intervals - 1; j++) {
138 |                     $('#slider').append('<div class="slidertickmark"></div>');
139 |                 }
140 | 
141 |                 $('#slider .slidertickmark').each(function(index) {
142 |                     var left = (index + 1) * (100 / (trial.intervals - 1));
143 |                     $(this).css({
144 |                         'position': 'absolute',
145 |                         'left': left + '%',
146 |                         'width': '1px',
147 |                         'height': '100%',
148 |                         'background-color': '#222222'
149 |                     });
150 |                 });
151 |             }
152 | 
153 |             // create labels for slider
154 |             display_element.append($('<ul>', {
155 |                 "id": "sliderlabels",
156 |                 "class": 'sliderlabels',
157 |                 "css": {
158 |                     "width": "100%",
159 |                     "height": "3em",
160 |                     "margin": "10px 0px 0px 0px",
161 |                     "padding": "0px",
162 |                     "display": "block",
163 |                     "position": "relative"
164 |                 }
165 |             }));
166 | 
167 |             for (var j = 0; j < trial.labels.length; j++) {
168 |                 $("#sliderlabels").append('<li>' + trial.labels[j] + '</li>');
169 |             }
170 | 
171 |             // position labels to match slider intervals
172 |             var slider_width = $("#slider").width();
173 |             var num_items = trial.labels.length;
174 |             var item_width = slider_width / num_items;
175 |             var spacing_interval = slider_width / (num_items - 1);
176 | 
177 |             $("#sliderlabels li").each(function(index) {
178 |                 $(this).css({
179 |                     'display': 'inline-block',
180 |                     'width': item_width + 'px',
181 |                     'margin': '0px',
182 |                     'padding': '0px',
183 |                     'text-align': 'center',
184 |                     'position': 'absolute',
185 |                     'left': (spacing_interval * index) - (item_width / 2)
186 |                 });
187 |             });
188 | 
189 |             //  create button
190 |             display_element.append($('<button>', {
191 |                 'id': 'next',
192 |                 'class': 'sim',
193 |                 'html': 'Submit Answer'
194 |             }));
195 | 
196 |             // if prompt is set, show prompt
197 |             if (trial.prompt !== "") {
198 |                 display_element.append(trial.prompt);
199 |             }
200 | 
201 |             $("#next").click(function() {
202 |                 var endTime = (new Date()).getTime();
203 |                 var response_time = endTime - startTime;
204 |                 sim_trial_complete = true;
205 |                 var score = $("#slider").slider("value");
206 |                 block.writeData($.extend({}, {
207 |                     "sim_score": score,
208 |                     "rt": response_time,
209 |                     "stimulus": trial.a_path,
210 |                     "stimulus_2": trial.b_path,
211 |                     "trial_type": "similarity",
212 |                     "trial_index": block.trial_idx
213 |                 }, trial.data));
214 |                 // goto next trial in block
215 |                 display_element.html('');
216 |                 if (trial.timing_post_trial > 0) {
217 |                     setTimeout(function() {
218 |                         block.next();
219 |                     }, trial.timing_post_trial);
220 |                 }
221 |                 else {
222 |                     block.next();
223 |                 }
224 |             });
225 |         }
226 | 
227 |         return plugin;
228 |     })();
229 | })(jQuery);
230 | 


--------------------------------------------------------------------------------
/scripts/plugins/jspsych-single-stim.js:
--------------------------------------------------------------------------------
  1 | /**
  2 |  * jspsych-single-stim
  3 |  * Josh de Leeuw
  4 |  * 
  5 |  * plugin for displaying a stimulus and getting a keyboard response
  6 |  * 
  7 |  * documentation: https://github.com/jodeleeuw/jsPsych/wiki/jspsych-single-stim
  8 |  *
  9 |  **/
 10 | 
 11 | (function($) {
 12 |     jsPsych["single-stim"] = (function() {
 13 | 
 14 |         var plugin = {};
 15 | 
 16 |         plugin.create = function(params) {
 17 |             
 18 |             params = jsPsych.pluginAPI.enforceArray(params, ['stimuli', 'choices', 'data']);
 19 |             
 20 |             var trials = new Array(params.stimuli.length);
 21 |             for (var i = 0; i < trials.length; i++) {
 22 |                 trials[i] = {};
 23 |                 trials[i].type = "single-stim";
 24 |                 trials[i].a_path = params.stimuli[i];
 25 |                 trials[i].choices = params.choices;
 26 |                 // option to show image for fixed time interval, ignoring key responses
 27 |                 //      true = image will keep displaying after response
 28 |                 //      false = trial will immediately advance when response is recorded
 29 |                 trials[i].continue_after_response = (typeof params.continue_after_response === 'undefined') ? true : params.continue_after_response;
 30 |                 // timing parameters
 31 |                 trials[i].timing_stim = params.timing_stim || -1; // if -1, then show indefinitely
 32 |                 trials[i].timing_response = params.timing_response || -1; // if -1, then wait for response forever
 33 |                 trials[i].timing_post_trial = (typeof params.timing_post_trial === 'undefined') ? 1000 : params.timing_post_trial;
 34 |                 // optional parameters
 35 |                 trials[i].is_html = (typeof params.is_html === 'undefined') ? false : params.is_html;
 36 |                 trials[i].prompt = (typeof params.prompt === 'undefined') ? "" : params.prompt;
 37 |                 trials[i].data = (typeof params.data === 'undefined') ? {} : params.data[i];
 38 |             }
 39 |             return trials;
 40 |         };
 41 | 
 42 | 
 43 | 
 44 |         plugin.trial = function(display_element, block, trial, part) {
 45 |             
 46 |             // if any trial variables are functions
 47 |             // this evaluates the function and replaces
 48 |             // it with the output of the function
 49 |             trial = jsPsych.pluginAPI.normalizeTrialVariables(trial);
 50 | 
 51 |             var trial_complete = false;
 52 | 
 53 |             if (!trial.is_html) {
 54 |                 display_element.append($('<img>', {
 55 |                     src: trial.a_path,
 56 |                     id: 'jspsych-single-stim-stimulus'
 57 |                 }));
 58 |             }
 59 |             else {
 60 |                 display_element.append($('<div>', {
 61 |                     html: trial.a_path,
 62 |                     id: 'jspsych-single-stim-stimulus'
 63 |                 }));
 64 |             }
 65 | 
 66 |             //show prompt here
 67 |             if (trial.prompt !== "") {
 68 |                 display_element.append(trial.prompt);
 69 |             }
 70 | 
 71 |             var end_trial = function(info) {
 72 |                 
 73 |                 trial_complete = true;
 74 | 
 75 |                 var trial_data = {
 76 |                     "trial_type": "single-stim",
 77 |                     "trial_index": block.trial_idx,
 78 |                     "rt": info.rt,
 79 |                     "stimulus": trial.a_path,
 80 |                     "key_press": info.key
 81 |                 };
 82 | 
 83 |                 block.writeData($.extend({}, trial_data, trial.data));
 84 |                 
 85 |                 display_element.html('');
 86 |                 if (trial.timing_post_trial > 0) {
 87 |                     setTimeout(function() {
 88 |                         block.next();
 89 |                     }, trial.timing_post_trial);
 90 |                 }
 91 |                 else {
 92 |                     block.next();
 93 |                 }
 94 |             };
 95 | 
 96 |             var after_response = function(info) {
 97 |                 
 98 |                 // after a valid response, the stimulus will have the CSS class 'responded'
 99 |                 // which can be used to provide visual feedback that a response was recorded
100 |                 $("#jspsych-single-stim-stimulus").addClass('responded');
101 | 
102 |                 if (trial.continue_after_response) {
103 |                     // response triggers the next trial in this case.
104 |                     // if hide_image_after_response is true, then next
105 |                     // trial should be triggered by timeout function below.
106 |                     end_trial(info);
107 |                 }
108 |             };
109 |         
110 | 
111 |             jsPsych.pluginAPI.getKeyboardResponse(after_response, trial.choices);
112 |             
113 |             // hide image if timing is set
114 |             if (trial.timing_stim > 0) {
115 |                 setTimeout(function() {
116 |                     if (!trial_complete) {
117 |                         $('#jspsych-single-stim-stimulus').css('visibility', 'hidden');
118 |                     }
119 |                 }, trial.timing_stim);
120 |             }
121 | 
122 |             // end trial if time limit is set
123 |             if (trial.timing_response > 0) {
124 |                 setTimeout(function() {
125 |                     if (!trial_complete) {
126 |                         end_trial({rt: -1, key: -1});
127 |                     }
128 |                 }, trial.timing_response);
129 |             }
130 | 
131 |         };
132 | 
133 | 
134 |         return plugin;
135 |     })();
136 | })(jQuery);
137 | 


--------------------------------------------------------------------------------
/scripts/plugins/jspsych-survey-likert.js:
--------------------------------------------------------------------------------
  1 | /**
  2 |  * jspsych-survey-likert
  3 |  * a jspsych plugin for measuring items on a likert scale
  4 |  *
  5 |  * Josh de Leeuw 
  6 |  * 
  7 |  * documentation: https://github.com/jodeleeuw/jsPsych/wiki/jspsych-survey-likert
  8 |  *
  9 |  */
 10 | 
 11 | (function($) {
 12 |     jsPsych['survey-likert'] = (function() {
 13 | 
 14 |         var plugin = {};
 15 | 
 16 |         plugin.create = function(params) {
 17 |             
 18 |             params = jsPsych.pluginAPI.enforceArray(params, ['data']);
 19 |             
 20 |             var trials = [];
 21 |             for (var i = 0; i < params.questions.length; i++) {
 22 |                 trials.push({
 23 |                     type: "survey-likert",
 24 |                     questions: params.questions[i],
 25 |                     labels: params.labels[i],
 26 |                     intervals: params.intervals[i],
 27 |                     show_ticks: (typeof params.show_ticks === 'undefined') ? true : params.show_ticks,
 28 |                     data: (typeof params.data === 'undefined') ? {} : params.data[i]
 29 |                 });
 30 |             }
 31 |             return trials;
 32 |         };
 33 | 
 34 |         plugin.trial = function(display_element, block, trial, part) {
 35 |             
 36 |             // if any trial variables are functions
 37 |             // this evaluates the function and replaces
 38 |             // it with the output of the function
 39 |             trial = jsPsych.pluginAPI.normalizeTrialVariables(trial);
 40 | 
 41 |             // add likert scale questions
 42 |             for (var i = 0; i < trial.questions.length; i++) {
 43 |                 // create div
 44 |                 display_element.append($('<div>', {
 45 |                     "id": 'jspsych-survey-likert-' + i,
 46 |                     "class": 'jspsych-survey-likert-question'
 47 |                 }));
 48 | 
 49 |                 // add question text
 50 |                 $("#jspsych-survey-likert-" + i).append('<p class="jspsych-survey-likert-text survey-likert">' + trial.questions[i] + '</p>');
 51 | 
 52 |                 // create slider
 53 |                 $("#jspsych-survey-likert-" + i).append($('<div>', {
 54 |                     "id": 'jspsych-survey-likert-slider-' + i,
 55 |                     "class": 'jspsych-survey-likert-slider jspsych-survey-likert'
 56 |                 }));
 57 |                 $("#jspsych-survey-likert-slider-" + i).slider({
 58 |                     value: Math.ceil(trial.intervals[i] / 2),
 59 |                     min: 1,
 60 |                     max: trial.intervals[i],
 61 |                     step: 1
 62 |                 });
 63 | 
 64 |                 // show tick marks
 65 |                 if (trial.show_ticks) {
 66 |                     $("#jspsych-survey-likert-" + i).append($('<div>', {
 67 |                         "id": 'jspsych-survey-likert-sliderticks' + i,
 68 |                         "class": 'jspsych-survey-likert-sliderticks jspsych-survey-likert',
 69 |                         "css": {
 70 |                             "position": 'relative'
 71 |                         }
 72 |                     }));
 73 |                     for (var j = 1; j < trial.intervals[i] - 1; j++) {
 74 |                         $('#jspsych-survey-likert-slider-' + i).append('<div class="jspsych-survey-likert-slidertickmark"></div>');
 75 |                     }
 76 | 
 77 |                     $('#jspsych-survey-likert-slider-' + i + ' .jspsych-survey-likert-slidertickmark').each(function(index) {
 78 |                         var left = (index + 1) * (100 / (trial.intervals[i] - 1));
 79 |                         $(this).css({
 80 |                             'position': 'absolute',
 81 |                             'left': left + '%',
 82 |                             'width': '1px',
 83 |                             'height': '100%',
 84 |                             'background-color': '#222222'
 85 |                         });
 86 |                     });
 87 |                 }
 88 | 
 89 |                 // create labels for slider
 90 |                 $("#jspsych-survey-likert-" + i).append($('<ul>', {
 91 |                     "id": "jspsych-survey-likert-sliderlabels-" + i,
 92 |                     "class": 'jspsych-survey-likert-sliderlabels survey-likert',
 93 |                     "css": {
 94 |                         "width": "100%",
 95 |                         "margin": "10px 0px 0px 0px",
 96 |                         "padding": "0px",
 97 |                         "display": "block",
 98 |                         "position": "relative"
 99 |                     }
100 |                 }));
101 | 
102 |                 for (var j = 0; j < trial.labels[i].length; j++) {
103 |                     $("#jspsych-survey-likert-sliderlabels-" + i).append('<li>' + trial.labels[i][j] + '</li>');
104 |                 }
105 | 
106 |                 // position labels to match slider intervals
107 |                 var slider_width = $("#jspsych-survey-likert-slider-" + i).width();
108 |                 var num_items = trial.labels[i].length;
109 |                 var item_width = slider_width / num_items;
110 |                 var spacing_interval = slider_width / (num_items - 1);
111 | 
112 |                 $("#jspsych-survey-likert-sliderlabels-" + i + " li").each(function(index) {
113 |                     $(this).css({
114 |                         'display': 'inline-block',
115 |                         'width': item_width + 'px',
116 |                         'margin': '0px',
117 |                         'padding': '0px',
118 |                         'text-align': 'center',
119 |                         'position': 'absolute',
120 |                         'left': (spacing_interval * index) - (item_width / 2)
121 |                     });
122 |                 });
123 |             }
124 | 
125 |             // add submit button
126 |             display_element.append($('<button>', {
127 |                 'id': 'jspsych-survey-likert-next',
128 |                 'class': 'jspsych-survey-likert'
129 |             }));
130 |             $("#jspsych-survey-likert-next").html('Submit Answers');
131 |             $("#jspsych-survey-likert-next").click(function() {
132 |                 // measure response time
133 |                 var endTime = (new Date()).getTime();
134 |                 var response_time = endTime - startTime;
135 | 
136 |                 // create object to hold responses
137 |                 var question_data = {};
138 |                 $("div.jspsych-survey-likert-slider").each(function(index) {
139 |                     var id = "Q" + index;
140 |                     var val = $(this).slider("value");
141 |                     var obje = {};
142 |                     obje[id] = val;
143 |                     $.extend(question_data, obje);
144 |                 });
145 | 
146 |                 // save data
147 |                 block.writeData($.extend({}, {
148 |                     "trial_type": "survey-likert",
149 |                     "trial_index": block.trial_idx,
150 |                     "rt": response_time
151 |                 }, question_data, trial.data));
152 | 
153 |                 display_element.html('');
154 | 
155 |                 // next trial
156 |                 block.next();
157 |             });
158 | 
159 |             var startTime = (new Date()).getTime();
160 |         };
161 | 
162 |         return plugin;
163 |     })();
164 | })(jQuery);
165 | 


--------------------------------------------------------------------------------
/scripts/plugins/jspsych-survey-text.js:
--------------------------------------------------------------------------------
 1 | /**
 2 |  * jspsych-survey-text
 3 |  * a jspsych plugin for free response survey questions
 4 |  *
 5 |  * Josh de Leeuw
 6 |  * 
 7 |  * documentation: https://github.com/jodeleeuw/jsPsych/wiki/jspsych-survey-text
 8 |  *
 9 |  */
10 | 
11 | (function($) {
12 |     jsPsych['survey-text'] = (function() {
13 | 
14 |         var plugin = {};
15 | 
16 |         plugin.create = function(params) {
17 |             
18 |             params = jsPsych.pluginAPI.enforceArray(params, ['data']);
19 |             
20 |             var trials = [];
21 |             for (var i = 0; i < params.questions.length; i++) {
22 |                 trials.push({
23 |                     type: "survey-text",
24 |                     questions: params.questions[i],
25 |                     data: (typeof params.data === 'undefined') ? {} : params.data[i]
26 |                 });
27 |             }
28 |             return trials;
29 |         };
30 | 
31 |         plugin.trial = function(display_element, block, trial, part) {
32 |             
33 |             // if any trial variables are functions
34 |             // this evaluates the function and replaces
35 |             // it with the output of the function
36 |             trial = jsPsych.pluginAPI.normalizeTrialVariables(trial);
37 | 
38 |             // add likert scale questions
39 |             for (var i = 0; i < trial.questions.length; i++) {
40 |                 // create div
41 |                 display_element.append($('<div>', {
42 |                     "id": 'jspsych-survey-text-' + i,
43 |                     "class": 'jspsych-survey-text-question'
44 |                 }));
45 | 
46 |                 // add question text
47 |                 $("#jspsych-survey-text-" + i).append('<p class="jspsych-survey-text">' + trial.questions[i] + '</p>');
48 | 
49 |                 // add text box
50 |                 $("#jspsych-survey-text-" + i).append('<input type="text" name="#jspsych-survey-text-response-' + i + '"></input>');
51 |             }
52 | 
53 |             // add submit button
54 |             display_element.append($('<button>', {
55 |                 'id': 'jspsych-survey-text-next',
56 |                 'class': 'jspsych-survey-text'
57 |             }));
58 |             $("#jspsych-survey-text-next").html('Submit Answers');
59 |             $("#jspsych-survey-text-next").click(function() {
60 |                 // measure response time
61 |                 var endTime = (new Date()).getTime();
62 |                 var response_time = endTime - startTime;
63 | 
64 |                 // create object to hold responses
65 |                 var question_data = {};
66 |                 $("div.jspsych-survey-text-question").each(function(index) {
67 |                     var id = "Q" + index;
68 |                     var val = $(this).children('input').val();
69 |                     var obje = {};
70 |                     obje[id] = val;
71 |                     $.extend(question_data, obje);
72 |                 });
73 | 
74 |                 // save data
75 |                 block.writeData($.extend({}, {
76 |                     "trial_type": "survey-text",
77 |                     "trial_index": block.trial_idx,
78 |                     "rt": response_time
79 |                 }, question_data, trial.data));
80 | 
81 |                 display_element.html('');
82 | 
83 |                 // next trial
84 |                 block.next();
85 |             });
86 | 
87 |             var startTime = (new Date()).getTime();
88 |         };
89 | 
90 |         return plugin;
91 |     })();
92 | })(jQuery);
93 | 


--------------------------------------------------------------------------------
/scripts/plugins/jspsych-text.js:
--------------------------------------------------------------------------------
 1 | /* jspsych-text.js
 2 |  * Josh de Leeuw
 3 |  *
 4 |  * This plugin displays text (including HTML formatted strings) during the experiment.
 5 |  * Use it to show instructions, provide performance feedback, etc...
 6 |  *
 7 |  * documentation: https://github.com/jodeleeuw/jsPsych/wiki/jspsych-text
 8 |  * 
 9 |  *
10 |  */
11 | 
12 | (function($) {
13 |     jsPsych.text = (function() {
14 | 
15 |         var plugin = {};
16 | 
17 |         plugin.create = function(params) {
18 |             
19 |             params = jsPsych.pluginAPI.enforceArray(params, ['text','data']);
20 |             
21 |             var trials = new Array(params.text.length);
22 |             for (var i = 0; i < trials.length; i++) {
23 |                 trials[i] = {};
24 |                 trials[i].type = "text"; // must match plugin name
25 |                 trials[i].text = params.text[i]; // text of all trials
26 |                 trials[i].cont_key = params.cont_key || []; // keycode to press to advance screen, default is all keys.
27 |                 trials[i].timing_post_trial = (typeof params.timing_post_trial === 'undefined') ? 0 : params.timing_post_trial;
28 |                 trials[i].data = (typeof params.data === 'undefined') ? {} : params.data[i];
29 |             }
30 |             return trials;
31 |         };
32 | 
33 |         plugin.trial = function(display_element, block, trial, part) {
34 |             
35 |             // if any trial variables are functions
36 |             // this evaluates the function and replaces
37 |             // it with the output of the function
38 |             trial = jsPsych.pluginAPI.normalizeTrialVariables(trial);
39 |             
40 |             // set the HTML of the display target to replaced_text.
41 |             display_element.html(trial.text);
42 | 
43 |             var after_response = function(info) {
44 |                     
45 |                 display_element.html(''); // clear the display
46 |                 
47 |                 save_data(info.key, info.rt);
48 |                 
49 |                 if (trial.timing_post_trial > 0) {
50 |                     setTimeout(function() {
51 |                         block.next();
52 |                     }, trial.timing_post_trial);
53 |                 }
54 |                 else {
55 |                     block.next();
56 |                 } // call block.next() to advance the experiment after a delay.
57 |                 
58 |             };
59 | 
60 |             var mouse_listener = function(e) {
61 |                 
62 |                 var rt = (new Date()).getTime() - start_time;
63 |                 
64 |                 display_element.unbind('click', mouse_listener); 
65 |                 
66 |                 after_response({key: 'mouse', rt: rt});
67 |                 
68 |             };
69 | 
70 |             // check if key is 'mouse'
71 |             if (trial.cont_key == 'mouse') {
72 |                 display_element.click(mouse_listener);
73 |                 var start_time = (new Date()).getTime();
74 |             } else {
75 |                 jsPsych.pluginAPI.getKeyboardResponse(after_response, trial.cont_key);
76 |             }
77 | 
78 |             function save_data(key, rt) {
79 |                 block.writeData($.extend({}, {
80 |                     "trial_type": "text",
81 |                     "trial_index": block.trial_idx,
82 |                     "rt": rt,
83 |                     "key_press": key
84 |                 }, trial.data));
85 |             }
86 |         };
87 | 
88 |         return plugin;
89 |     })();
90 | })(jQuery);
91 | 


--------------------------------------------------------------------------------
/scripts/plugins/jspsych-visual-search-circle.js:
--------------------------------------------------------------------------------
  1 | /**
  2 |  * jspsych-visual-search-circle
  3 |  * Josh de Leeuw
  4 |  * 
  5 |  * display a set of objects, with or without a target, equidistant from fixation
  6 |  * subject responds to whether or not the target is present
  7 |  * 
  8 |  * based on code written for psychtoolbox by Ben Motz
  9 |  * 
 10 |  * todo: 
 11 |  * 
 12 |  * allow for use of display_element
 13 |  * 
 14 |  **/
 15 | 
 16 | (function($) {
 17 |     jsPsych["visual-search-circle"] = (function() {
 18 | 
 19 |         var plugin = {};
 20 | 
 21 |         plugin.create = function(params) {
 22 | 
 23 |             var trials = new Array(params.target_present.length);
 24 | 
 25 |             for (var i = 0; i < trials.length; i++) {
 26 |                 trials[i] = {};
 27 |                 trials[i].type = "visual-search-circle";
 28 |                 trials[i].target_present = params.target_present[i];
 29 |                 trials[i].set_size = params.set_size[i];
 30 |                 trials[i].target = params.target;
 31 |                 trials[i].foil = params.foil;
 32 |                 trials[i].fixation_image = params.fixation_image;
 33 |                 trials[i].target_size = params.target_size || [50, 50];
 34 |                 trials[i].fixation_size = params.fixation_size || [16, 16];
 35 |                 trials[i].circle_diameter = params.circle_diameter || 250;
 36 |                 trials[i].target_present_key = params.target_present_key || 74;
 37 |                 trials[i].target_absent_key = params.target_absent_key || 70;
 38 |                 trials[i].timing_max_search = (typeof params.timing_max_search === 'undefined') ? -1 : params.timing_max_search;
 39 |                 trials[i].timing_fixation = (typeof params.timing_fixation === 'undefined') ? 1000 : params.timing_fixation;
 40 |                 trials[i].timing_post_trial = (typeof params.timing_post_trial === 'undefined') ? 1000 : params.timing_post_trial;
 41 |                 trials[i].data = (typeof params.data === 'undefined') ? {} : params.data[i];
 42 |             }
 43 | 
 44 |             return trials;
 45 |         };
 46 | 
 47 |         plugin.trial = function(display_element, block, trial, part) {
 48 | 
 49 |             trial = jsPsych.pluginAPI.normalizeTrialVariables(trial);
 50 | 
 51 |             // screen information
 52 |             var screenw = $(window).width();
 53 |             var screenh = $(window).height();
 54 |             var centerx = screenw / 2;
 55 |             var centery = screenh / 2;
 56 | 
 57 |             // circle params
 58 |             var diam = trial.circle_diameter; // pixels
 59 |             var radi = diam / 2;
 60 |             var paper_size = diam + trial.target_size[0];
 61 | 
 62 |             // stimuli width, height
 63 |             var stimh = trial.target_size[0];
 64 |             var stimw = trial.target_size[1];
 65 |             var hstimh = stimh / 2;
 66 |             var hstimw = stimw / 2;
 67 |             
 68 |             // fixation location
 69 |             var fix_loc = [Math.floor(paper_size / 2 - trial.fixation_size[0] / 2), Math.floor(paper_size / 2 - trial.fixation_size[1] / 2)];
 70 | 
 71 |             // possible stimulus locations on the circle
 72 |             var display_locs = [];
 73 |             var possible_display_locs = trial.set_size;
 74 |             var random_offset = Math.floor(Math.random()*360);
 75 |             for(var i = 0; i < possible_display_locs; i++){
 76 |                 display_locs.push([
 77 |                     Math.floor(paper_size / 2 + (cosd(random_offset + (i * (360/possible_display_locs))) * radi) - hstimw),
 78 |                     Math.floor(paper_size / 2 - (sind(random_offset + (i * (360/possible_display_locs))) * radi) - hstimh)
 79 |                 ]);
 80 |             }
 81 |                 
 82 |             // get target to draw on
 83 |             var paper = Raphael(centerx - paper_size / 2, centery - paper_size / 2, paper_size, paper_size);
 84 | 
 85 |             show_fixation();
 86 | 
 87 |             function show_fixation() {
 88 |                 // show fixation
 89 |                 var fixation = paper.image(trial.fixation_image, fix_loc[0], fix_loc[1], trial.fixation_size[0], trial.fixation_size[1]);
 90 | 
 91 |                 // wait 
 92 |                 setTimeout(function() {
 93 |                     // after wait is over
 94 |                     show_search_array();
 95 |                 }, trial.timing_fixation);
 96 |             }
 97 | 
 98 |             function show_search_array() {
 99 | 
100 |                 var search_array_images = [];
101 | 
102 |                 for (var i = 0; i < display_locs.length; i++) {
103 |                     
104 |                     var which_image = (i == 0 && trial.target_present) ? trial.target : trial.foil;
105 | 
106 |                     var img = paper.image(which_image, display_locs[i][0], display_locs[i][1], trial.target_size[0], trial.target_size[1]);
107 | 
108 |                     search_array_images.push(img);
109 |                     
110 |                 }
111 | 
112 |                 var trial_over = false;
113 |                 
114 |                 var after_response = function(info){
115 |                     
116 |                     trial_over = true;
117 |                     
118 |                     var correct = 0;
119 |                     
120 |                     if (info.key == trial.target_present_key && trial.target_present || 
121 |                         info.key == trial.target_absent_key && !trial.target_present) {
122 |                         correct = 1;
123 |                     }
124 |                     
125 |                     clear_display();
126 |                     
127 |                     end_trial(info.rt, correct, info.key);
128 |                         
129 |                 }
130 |                 
131 |                 var valid_keys = [trial.target_present_key, trial.target_absent_key];
132 |                 
133 |                 key_listener = jsPsych.pluginAPI.getKeyboardResponse(after_response, valid_keys, 'date',false);
134 | 
135 |                 if (trial.timing_max_search > 0) {
136 |                     setTimeout(function() {
137 | 
138 |                         if (!trial_over) {
139 |                             
140 |                             jsPsych.pluginAPI.cancelKeyboardResponse(key_listener);
141 |                             
142 |                             trial_over = true;
143 |                             
144 |                             var rt = -1;
145 |                             var correct = 0;
146 |                             var key_press = -1;
147 | 
148 |                             clear_display();
149 | 
150 |                             end_trial(rt, correct, key_press);
151 |                         }
152 |                     }, trial.timing_max_search);
153 |                 }
154 | 
155 |                 function clear_display() {
156 |                     paper.remove();
157 |                 }
158 |             }
159 | 
160 | 
161 |             function end_trial(rt, correct, key_press) {
162 |                 
163 |                 // data saving
164 |                 var trial_data = {
165 |                     trial_type: trial.type,
166 |                     trial_index: block.trial_idx,
167 |                     correct: correct,
168 |                     rt: rt,
169 |                     key_press: key_press,
170 |                     locations: JSON.stringify(display_locs),
171 |                     target_present: trial.target_present,
172 |                     set_size: trial.set_size
173 |                 };
174 | 
175 |                 // this line merges together the trial_data object and the generic
176 |                 // data object (trial.data), and then stores them.
177 |                 block.writeData($.extend({}, trial_data, trial.data));
178 | 
179 |                 // go to next trial
180 |                 if(trial.timing_post_trial > 0){
181 |                     setTimeout(function() {
182 |                         block.next();
183 |                     }, trial.timing_post_trial);
184 |                 } else {
185 |                     block.next();
186 |                 }
187 |             }
188 |         };
189 | 
190 |         // helper function for determining stimulus locations
191 | 
192 |         function cosd(num) {
193 |             return Math.cos(num / 180 * Math.PI);
194 |         }
195 | 
196 |         function sind(num) {
197 |             return Math.sin(num / 180 * Math.PI);
198 |         }
199 | 
200 |         return plugin;
201 |     })();
202 | })(jQuery);
203 | 


--------------------------------------------------------------------------------
/scripts/plugins/jspsych-vsl-animate-occlusion.js:
--------------------------------------------------------------------------------
  1 | /**
  2 |  * jsPsych plugin for showing animations that mimic the experiment described in
  3 |  * 
  4 |  * Fiser, J., & Aslin, R. N. (2002). Statistical learning of higher-order 
  5 |  * temporal structure from visual shape sequences. Journal of Experimental 
  6 |  * Psychology: Learning, Memory, and Cognition, 28(3), 458.
  7 |  * 
  8 |  * Josh de Leeuw
  9 |  * 
 10 |  * documentation: https://github.com/jodeleeuw/jsPsych/wiki/jspsych-vsl-animate-occlusion
 11 |  * 
 12 |  */
 13 | 
 14 | (function($) {
 15 |     jsPsych['vsl-animate-occlusion'] = (function() {
 16 | 
 17 |         var plugin = {};
 18 | 
 19 |         plugin.create = function(params) {
 20 |             
 21 |             var trials = new Array(1);
 22 | 
 23 |             trials[0] = {};
 24 |             trials[0].type = "vsl-animate-occlusion";
 25 |             trials[0].stims = params.stimuli;
 26 |             trials[0].timing_cycle = params.timing_cycle || 1000;
 27 |             trials[0].canvas_size = params.canvas_size || [400, 400];
 28 |             trials[0].image_size = params.image_size || [100, 100];
 29 |             trials[0].initial_direction = params.initial_direction || "left";
 30 |             trials[0].occlude_center = (typeof params.occlude_center === 'undefined') ? true : params.occlude_center;
 31 |             trials[0].choices = params.choices || []; // spacebar
 32 |             // timing
 33 |             trials[0].timing_post_trial = (typeof params.timing_post_trial === 'undefined') ? 1000 : params.timing_post_trial;
 34 |             trials[0].timing_pre_movement = (typeof params.timing_pre_movement === 'undefined') ? 500 : params.timing_pre_movement;
 35 |             //trials[0].prompt = (typeof params.prompt === 'undefined') ? "" : params.prompt;
 36 |             trials[0].data = (typeof params.data === 'undefined') ? {} : params.data;
 37 | 
 38 |             return trials;
 39 |         };
 40 | 
 41 |         plugin.trial = function(display_element, block, trial, part) {
 42 |             
 43 |             // if any trial variables are functions
 44 |             // this evaluates the function and replaces
 45 |             // it with the output of the function
 46 |             trial = jsPsych.pluginAPI.normalizeTrialVariables(trial);
 47 |             
 48 |             // variable to keep track of timing info and responses
 49 |             var start_time = 0;
 50 |             var responses = [];
 51 | 
 52 |             var directions = [
 53 |                 [{
 54 |                     params: {
 55 |                         x: trial.canvas_size[0] - trial.image_size[0]
 56 |                     },
 57 |                     ms: trial.timing_cycle / 2
 58 |                 }, {
 59 |                     params: {
 60 |                         x: trial.canvas_size[0] / 2 - trial.image_size[0] / 2
 61 |                     },
 62 |                     ms: trial.timing_cycle / 2
 63 |                 }],
 64 |                 [{
 65 |                     params: {
 66 |                         x: 0
 67 |                     },
 68 |                     ms: trial.timing_cycle / 2
 69 |                 }, {
 70 |                     params: {
 71 |                         x: trial.canvas_size[0] / 2 - trial.image_size[0] / 2
 72 |                     },
 73 |                     ms: trial.timing_cycle / 2
 74 |                 }]
 75 |             ];
 76 | 
 77 |             var which_image = 0;
 78 |             var next_direction = (trial.initial_direction == "right") ? 0 : 1;
 79 | 
 80 |             function next_step() {
 81 |                 if (trial.stims.length == which_image) {
 82 |                     endTrial();
 83 |                 }
 84 |                 else {
 85 | 
 86 |                     var d = directions[next_direction];
 87 |                     next_direction === 0 ? next_direction = 1 : next_direction = 0;
 88 |                     var i = trial.stims[which_image];
 89 |                     which_image++;
 90 | 
 91 |                     eve.once("raphael.attr.src."+c.id, function(){
 92 |                         c.animate(d[0].params, d[0].ms, function() {
 93 |                             c.animate(d[1].params, d[1].ms, function() {
 94 |                                 next_step();
 95 |                             });
 96 |                         });
 97 |                     });
 98 |                     c.attr({
 99 |                         src: i
100 |                     });
101 |                     
102 |                     // start timer for this trial
103 |                     start_time = (new Date()).getTime();
104 |                 }
105 |             }
106 |             
107 |             display_element.append($("<div id='jspsych-vsl-animate-occlusion-raphaelCanvas'>", {
108 |                 css: {
109 |                     width: trial.canvas_size[0] + "px",
110 |                     height: trial.canvas_size[1] + "px"
111 |                 }
112 |             }));
113 | 
114 |             var paper = Raphael("jspsych-vsl-animate-occlusion-raphaelCanvas", trial.canvas_size[0], trial.canvas_size[1]);
115 | 
116 |             var c = paper.image(trial.stims[which_image], trial.canvas_size[0] / 2 - trial.image_size[0] / 2, trial.canvas_size[1] / 2 - trial.image_size[1] / 2, trial.image_size[0], trial.image_size[1]);
117 | 
118 |             if (trial.occlude_center) {
119 |                 paper.rect((trial.canvas_size[0] / 2) - (trial.image_size[0] / 2), 0, trial.image_size[0], trial.canvas_size[1]).attr({
120 |                     fill: "#000"
121 |                 });
122 |             }
123 |             
124 |             // add key listener
125 |             var after_response = function(info){
126 |                 responses.push({
127 |                     key: info.key,
128 |                     stimulus: which_image - 1,
129 |                     rt: info.rt
130 |                 });
131 |             }
132 |             
133 |             key_listener = jsPsych.pluginAPI.getKeyboardResponse(after_response, trial.choices, 'date', true);
134 | 
135 |             if (trial.timing_pre_movement > 0) {
136 |                 setTimeout(function() {
137 |                     next_step();
138 |                 }, trial.timing_pre_movement);
139 |             }
140 |             else {
141 |                 next_step();
142 |             }
143 | 
144 |             function endTrial() {
145 |                 
146 |                 display_element.html('');
147 |                 
148 |                 jsPsych.pluginAPI.cancelKeyboardResponse(key_listener);
149 |                 
150 |                 block.writeData($.extend({}, {
151 |                     "trial_type": "vsl-animate-occlusion",
152 |                     "trial_index": block.trial_idx,
153 |                     "stimuli": JSON.stringify(trial.stims),
154 |                     "responses": JSON.stringify(responses)
155 |                 }, trial.data));
156 | 
157 |                 if (trial.timing_post_trial > 0) {
158 |                     setTimeout(function() {
159 |                         block.next();
160 |                     }, trial.timing_post_trial);
161 |                 }
162 |                 else {
163 |                     block.next();
164 |                 }
165 |             }
166 |         };
167 | 
168 |         return plugin;
169 |     })();
170 | })(jQuery);
171 | 


--------------------------------------------------------------------------------
/scripts/plugins/jspsych-vsl-grid-scene.js:
--------------------------------------------------------------------------------
  1 | /**
  2 |  * jsPsych plugin for showing scenes that mimic the experiments described in
  3 |  * 
  4 |  * Fiser, J., & Aslin, R. N. (2001). Unsupervised statistical learning of 
  5 |  * higher-order spatial structures from visual scenes. Psychological science, 
  6 |  * 12(6), 499-504.
  7 |  * 
  8 |  * Josh de Leeuw
  9 |  * 
 10 |  * documentation: https://github.com/jodeleeuw/jsPsych/wiki/jspsych-vsl-grid-scene
 11 |  * 
 12 |  */
 13 | 
 14 | (function($) {
 15 |     jsPsych['vsl-grid-scene'] = (function() {
 16 | 
 17 |         var plugin = {};
 18 | 
 19 |         plugin.create = function(params) {
 20 |             
 21 |             params = jsPsych.pluginAPI.enforceArray(params, ['data'])
 22 |             var trials = new Array(params.stimuli.length);
 23 |             for (var i = 0; i < trials.length; i++) {
 24 |                 trials[i] = {};
 25 |                 trials[i].type = "vsl-grid-scene";
 26 |                 trials[i].stimuli = params.stimuli[i];
 27 |                 trials[i].image_size = params.image_size || [100, 100];
 28 |                 trials[i].timing_post_trial = (typeof params.timing_post_trial === 'undefined') ? 1000 : params.timing_post_trial;
 29 |                 trials[i].timing_duration = (typeof params.timing_duration === 'undefined') ? 2000 : params.timing_duration;
 30 |                 //trials[i].prompt = (typeof params.prompt === 'undefined') ? "" : params.prompt;
 31 |                 trials[i].data = (typeof params.data === 'undefined') ? {} : params.data;
 32 |             }
 33 |             return trials;
 34 |         };
 35 | 
 36 |         plugin.trial = function(display_element, block, trial, part) {
 37 |             
 38 |             // if any trial variables are functions
 39 |             // this evaluates the function and replaces
 40 |             // it with the output of the function
 41 |             trial = jsPsych.pluginAPI.normalizeTrialVariables(trial);
 42 | 
 43 |             display_element.html(plugin.generate_stimulus(trial.stimuli, trial.image_size));
 44 | 
 45 |             setTimeout(function() {
 46 |                 endTrial();
 47 |             }, trial.timing_duration);
 48 | 
 49 |             function endTrial() {
 50 | 
 51 |                 display_element.html('');
 52 | 
 53 |                 block.writeData($.extend({}, {
 54 |                     "trial_type": "vsl-grid-scene",
 55 |                     "trial_index": block.trial_idx,
 56 |                     "stimuli": JSON.stringify(trial.stimuli)
 57 |                 }, trial.data));
 58 | 
 59 |                 if (trial.timing_post_trial > 0) {
 60 |                     setTimeout(function() {
 61 |                         block.next();
 62 |                     }, trial.timing_post_trial);
 63 |                 }
 64 |                 else {
 65 |                     block.next();
 66 |                 }
 67 |             }
 68 |         };
 69 | 
 70 |         plugin.generate_stimulus = function(pattern, image_size) {
 71 |             var nrows = pattern.length;
 72 |             var ncols = pattern[0].length;
 73 | 
 74 |             // create blank element to hold code that we generate
 75 |             $('body').append($('<div>', {
 76 |                 id: 'jspsych-vsl-grid-scene-dummy',
 77 |                 css: {
 78 |                     display: 'none'
 79 |                 }
 80 |             }));
 81 | 
 82 |             // create table
 83 |             $('#jspsych-vsl-grid-scene-dummy').append($('<table>', {
 84 |                 id: 'jspsych-vsl-grid-scene-table',
 85 |                 css: {
 86 |                     'border-collapse': 'collapse',
 87 |                     'margin-left': 'auto',
 88 |                     'margin-right': 'auto'
 89 |                 }
 90 |             }));
 91 | 
 92 |             for (var row = 0; row < nrows; row++) {
 93 |                 $("#jspsych-vsl-grid-scene-table").append($('<tr>', {
 94 |                     id: 'jspsych-vsl-grid-scene-table-row-' + row,
 95 |                     css: {
 96 |                         height: image_size[1] + "px"
 97 |                     }
 98 |                 }));
 99 |                 for (var col = 0; col < ncols; col++) {
100 |                     $("#jspsych-vsl-grid-scene-table-row-" + row).append($('<td>', {
101 |                         id: 'jspsych-vsl-grid-scene-table-' + row + '-' + col,
102 |                         css: {
103 |                             padding: image_size[1] / 10 + "px " + image_size[0] / 10 + "px",
104 |                             border: '1px solid #555'
105 |                         }
106 |                     }));
107 |                     $('#jspsych-vsl-grid-scene-table-' + row + '-' + col).append($('<div>', {
108 |                         id: 'jspsych-vsl-grid-scene-table-cell-' + row + '-' + col,
109 |                         css: {
110 |                             width: image_size[0] + "px",
111 |                             height: image_size[1] + "px"
112 |                         }
113 |                     }));
114 |                 }
115 |             }
116 | 
117 | 
118 |             for (var row = 0; row < nrows; row++) {
119 |                 for (var col = 0; col < ncols; col++) {
120 |                     if (pattern[row][col] !== 0) {
121 |                         $('#jspsych-vsl-grid-scene-table-cell-' + row + '-' + col).append($('<img>', {
122 |                             src: pattern[row][col],
123 |                             css: {
124 |                                 width: image_size[0] + "px",
125 |                                 height: image_size[1] + "px",
126 |                             }
127 |                         }));
128 |                     }
129 |                 }
130 |             }
131 |             
132 |             var html_out =  $('#jspsych-vsl-grid-scene-dummy').html();
133 |             $('#jspsych-vsl-grid-scene-dummy').remove();
134 |              
135 |             return html_out;
136 | 
137 |         };
138 | 
139 |         return plugin;
140 |     })();
141 | })(jQuery);
142 | 


--------------------------------------------------------------------------------
/scripts/plugins/jspsych-xab.js:
--------------------------------------------------------------------------------
  1 | /*  jspsych-xab.js
  2 |  *	Josh de Leeuw
  3 |  *
  4 |  *  This plugin runs a single XAB trial, where X is an image presented in isolation, and A and B are choices, with A or B being equal to X. 
  5 |  *	The subject's goal is to identify whether A or B is identical to X.
  6 |  *
  7 |  * documentation: https://github.com/jodeleeuw/jsPsych/wiki/jspsych-xab
  8 |  *
  9 |  */
 10 | 
 11 | (function($) {
 12 |     jsPsych.xab = (function() {
 13 | 
 14 |         var plugin = {};
 15 | 
 16 |         plugin.create = function(params) {
 17 |             
 18 |             params = jsPsych.pluginAPI.enforceArray(params, ['data']);
 19 | 
 20 |             // the number of trials is determined by how many entries the params.stimuli array has
 21 |             var trials = new Array(params.stimuli.length);
 22 | 
 23 |             for (var i = 0; i < trials.length; i++) {
 24 |                 trials[i] = {};
 25 |                 trials[i].type = "xab";
 26 |                 trials[i].x_path = params.stimuli[i][0];
 27 |                 // if there is only a pair of stimuli, then the first is the target and is shown twice.
 28 |                 // if there is a triplet, then the first is X, the second is the target, and the third is foil (useful for non-exact-match XAB).
 29 |                 if (params.stimuli[i].length == 2) {
 30 |                     trials[i].a_path = params.stimuli[i][0];
 31 |                     trials[i].b_path = params.stimuli[i][1];
 32 |                 }
 33 |                 else {
 34 |                     trials[i].a_path = params.stimuli[i][1];
 35 |                     trials[i].b_path = params.stimuli[i][2];
 36 |                 }
 37 |                 trials[i].left_key = params.left_key || 81; // defaults to 'q'
 38 |                 trials[i].right_key = params.right_key || 80; // defaults to 'p'
 39 |                 // timing parameters
 40 |                 trials[i].timing_x = params.timing_x || 1000; // defaults to 1000msec.
 41 |                 trials[i].timing_xab_gap = params.timing_xab_gap || 1000; // defaults to 1000msec.
 42 |                 trials[i].timing_ab = params.timing_ab || -1; // defaults to -1, meaning infinite time on AB. If a positive number is used, then AB will only be displayed for that length.
 43 |                 trials[i].timing_post_trial = (typeof params.timing_post_trial === 'undefined') ? 1000 : params.timing_post_trial; // defaults to 1000msec.
 44 |                 // optional parameters
 45 |                 trials[i].is_html = (typeof params.is_html === 'undefined') ? false : params.is_html;
 46 |                 trials[i].prompt = (typeof params.prompt === 'undefined') ? "" : params.prompt;
 47 |                 trials[i].data = (typeof params.data === 'undefined') ? {} : params.data[i];
 48 | 
 49 |             }
 50 |             return trials;
 51 |         };
 52 | 
 53 |         var xab_trial_complete = false;
 54 | 
 55 |         plugin.trial = function(display_element, block, trial, part) {
 56 |             
 57 |             // if any trial variables are functions
 58 |             // this evaluates the function and replaces
 59 |             // it with the output of the function
 60 |             trial = jsPsych.pluginAPI.normalizeTrialVariables(trial);
 61 |             
 62 |             switch (part) {
 63 | 
 64 |                 // the first part of the trial is to show the X stimulus.    
 65 |             case 1:
 66 |                 // reset this variable to false
 67 |                 xab_trial_complete = false;
 68 | 
 69 |                 // how we display the content depends on whether the content is 
 70 |                 // HTML code or an image path.
 71 |                 if (!trial.is_html) {
 72 |                     display_element.append($('<img>', {
 73 |                         src: trial.x_path,
 74 |                         "class": 'jspsych-xab-stimulus'
 75 |                     }));
 76 |                 }
 77 |                 else {
 78 |                     display_element.append($('<div>', {
 79 |                         "class": 'jspsych-xab-stimulus',
 80 |                         html: trial.x_path
 81 |                     }));
 82 |                 }
 83 | 
 84 |                 // start a timer of length trial.timing_x to move to the next part of the trial
 85 |                 setTimeout(function() {
 86 |                     plugin.trial(display_element, block, trial, part + 1);
 87 |                 }, trial.timing_x);
 88 |                 break;
 89 | 
 90 |                 // the second part of the trial is the gap between X and AB.
 91 |             case 2:
 92 |                 // remove the x stimulus
 93 |                 $('.jspsych-xab-stimulus').remove();
 94 | 
 95 |                 // start timer
 96 |                 setTimeout(function() {
 97 |                     plugin.trial(display_element, block, trial, part + 1);
 98 |                 }, trial.timing_xab_gap);
 99 |                 break;
100 | 
101 |                 // the third part of the trial is to display A and B, and get the subject's response
102 |             case 3:
103 | 
104 |                 // randomize whether the target is on the left or the right
105 |                 var images = [trial.a_path, trial.b_path];
106 |                 var target_left = (Math.floor(Math.random() * 2) === 0); // 50% chance target is on left.
107 |                 if (!target_left) {
108 |                     images = [trial.b_path, trial.a_path];
109 |                 }
110 | 
111 |                 // show the options
112 |                 if (!trial.is_html) {
113 |                     display_element.append($('<img>', {
114 |                         "src": images[0],
115 |                         "class": 'jspsych-xab-stimulus left'
116 |                     }));
117 |                     display_element.append($('<img>', {
118 |                         "src": images[1],
119 |                         "class": 'jspsych-xab-stimulus right'
120 |                     }));
121 |                 }
122 |                 else {
123 |                     display_element.append($('<div>', {
124 |                         "class": 'jspsych-xab-stimulus left',
125 |                         html: images[0]
126 |                     }));
127 |                     display_element.append($('<div>', {
128 |                         "class": 'jspsych-xab-stimulus right',
129 |                         html: images[1]
130 |                     }));
131 |                 }
132 | 
133 |                 if (trial.prompt !== "") {
134 |                     display_element.append(trial.prompt);
135 |                 }
136 | 
137 |                 // if timing_ab is > 0, then we hide the stimuli after timing_ab milliseconds
138 |                 if (trial.timing_ab > 0) {
139 |                     setTimeout(function() {
140 |                         if (!xab_trial_complete) {
141 |                             $('.jspsych-xab-stimulus').css('visibility', 'hidden');
142 |                         }
143 |                     }, trial.timing_ab);
144 |                 }
145 | 
146 |                 // create the function that triggers when a key is pressed.
147 |                 var after_response = function(info) {
148 |                     
149 |                     var correct = false; // true when the correct response is chosen
150 |                     
151 |                     if (info.key == trial.left_key) // 'q' key by default
152 |                     {
153 |                         if (target_left) {
154 |                             correct = true;
155 |                         }
156 |                     }
157 |                     else if (info.key == trial.right_key) // 'p' key by default
158 |                     {
159 |                         if (!target_left) {
160 |                             correct = true;
161 |                         }
162 |                     }
163 |                     
164 |                        
165 |                     // create object to store data from trial
166 |                     var trial_data = {
167 |                         "trial_type": "xab",
168 |                         "trial_index": block.trial_idx,
169 |                         "rt": info.rt,
170 |                         "correct": correct,
171 |                         "stimulus_x": trial.x_path,
172 |                         "stimulus_a": trial.a_path,
173 |                         "stimulus_b": trial.b_path,
174 |                         "key_press": info.key
175 |                     };
176 |                     block.writeData($.extend({}, trial_data, trial.data));
177 |                     
178 |                     display_element.html(''); // remove all
179 |                     
180 |                     xab_trial_complete = true;
181 |                     
182 |                     // move on to the next trial after timing_post_trial milliseconds
183 |                     if(trial.timing_post_trial > 0) {
184 |                         setTimeout(function() {
185 |                             block.next();
186 |                         }, trial.timing_post_trial);
187 |                     } else {
188 |                         block.next();
189 |                     }
190 |                 
191 |                 };
192 |                 
193 |                 jsPsych.pluginAPI.getKeyboardResponse(after_response, [trial.left_key, trial.right_key], 'date', false);
194 |                 
195 |                 break;
196 |             }
197 |         };
198 | 
199 |         return plugin;
200 |     })();
201 | })(jQuery);
202 | 


--------------------------------------------------------------------------------
/scripts/plugins/template/jspsych-plugin-template.js:
--------------------------------------------------------------------------------
 1 | /**
 2 |  * Josh de Leeuw
 3 |  * November 2013
 4 |  * 
 5 |  * This is a basic template for a jsPsych plugin. Use it to start creating your
 6 |  * own plugin. There is more information about how to create a plugin on the
 7 |  * jsPsych wiki (https://github.com/jodeleeuw/jsPsych/wiki/Create-a-Plugin).
 8 |  * 
 9 |  * 
10 |  */
11 |  
12 | (function( $ ) {
13 | 	jsPsych["PLUGIN-NAME"] = (function(){
14 | 
15 | 		var plugin = {};
16 | 
17 | 		plugin.create = function(params) {
18 | 			var trials = new Array(NUMBER_OF_TRIALS);
19 | 			for(var i = 0; i < NUMBER_OF_TRIALS; i++)
20 | 			{
21 | 				trials[i] = {};
22 | 				trials[i].type = "PLUGIN-NAME";
23 |                 // other information needed for the trial method can be added here
24 |                 
25 |                 // supporting the generic data object with the following line
26 |                 // is always a good idea. it allows people to pass in the data
27 |                 // parameter, but if they don't it gracefully adds an empty object
28 |                 // in it's place.
29 |                 trials[i].data = (typeof params.data === 'undefined') ? {} : params.data[i];
30 | 			}
31 | 			return trials;
32 | 		};
33 | 
34 | 		plugin.trial = function(display_element, block, trial, part) {
35 | 			// code for running the trial goes here
36 | 			
37 | 			// allow variables as functions
38 | 			// this allows any trial variable to be specified as a function
39 | 			// that will be evaluated when the trial runs. this allows users
40 | 			// to dynamically adjust the contents of a trial as a result
41 | 			// of other trials, among other uses. you can leave this out,
42 | 			// but in general it should be included
43 |             trial = jsPsych.normalizeTrialVariables(trial);
44 | 			
45 | 			// data saving
46 | 			// this is technically optional, but virtually every plugin will
47 | 			// need to do it. it is good practice to include the type and 
48 | 			// trial_index fields for all plugins.
49 | 			var trial_data = {
50 | 			    type: trial.type,
51 | 			    trial_index: block.trial_idx,
52 | 			    // other values to save go here
53 | 			};
54 | 			
55 | 			// this line merges together the trial_data object and the generic
56 | 			// data object (trial.data), and then stores them.
57 | 			block.writeData($.extend({}, trial_data, trial.data));
58 | 			
59 | 			// this method must be called at the end of the trial
60 | 			block.next();
61 | 		};
62 | 
63 | 		return plugin;
64 | 	})();
65 | }) (jQuery);


--------------------------------------------------------------------------------