jspsych 6.3.1 → 7.1.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (401) hide show
  1. package/README.md +36 -37
  2. package/css/jspsych.css +39 -39
  3. package/dist/JsPsych.d.ts +112 -0
  4. package/dist/TimelineNode.d.ts +34 -0
  5. package/dist/index.browser.js +3171 -0
  6. package/dist/index.browser.js.map +1 -0
  7. package/dist/index.browser.min.js +2 -0
  8. package/dist/index.browser.min.js.map +1 -0
  9. package/dist/index.cjs +3165 -0
  10. package/dist/index.cjs.map +1 -0
  11. package/dist/index.d.ts +11 -0
  12. package/dist/index.js +3159 -0
  13. package/dist/index.js.map +1 -0
  14. package/dist/migration.d.ts +3 -0
  15. package/dist/modules/data/DataCollection.d.ts +45 -0
  16. package/dist/modules/data/DataColumn.d.ts +15 -0
  17. package/dist/modules/data/index.d.ts +25 -0
  18. package/dist/modules/data/utils.d.ts +3 -0
  19. package/dist/modules/extensions.d.ts +22 -0
  20. package/dist/modules/plugin-api/HardwareAPI.d.ts +15 -0
  21. package/dist/modules/plugin-api/KeyboardListenerAPI.d.ts +34 -0
  22. package/dist/modules/plugin-api/MediaAPI.d.ts +27 -0
  23. package/dist/modules/plugin-api/SimulationAPI.d.ts +41 -0
  24. package/dist/modules/plugin-api/TimeoutAPI.d.ts +5 -0
  25. package/dist/modules/plugin-api/index.d.ts +8 -0
  26. package/dist/modules/plugins.d.ts +136 -0
  27. package/dist/modules/randomization.d.ts +35 -0
  28. package/dist/modules/turk.d.ts +40 -0
  29. package/dist/modules/utils.d.ts +7 -0
  30. package/package.json +32 -15
  31. package/src/JsPsych.ts +884 -0
  32. package/src/TimelineNode.ts +536 -0
  33. package/src/index.ts +71 -0
  34. package/src/migration.ts +37 -0
  35. package/src/modules/data/DataCollection.ts +198 -0
  36. package/src/modules/data/DataColumn.ts +86 -0
  37. package/src/modules/data/index.ts +174 -0
  38. package/src/modules/data/utils.ts +75 -0
  39. package/src/modules/extensions.ts +23 -0
  40. package/src/modules/plugin-api/HardwareAPI.ts +32 -0
  41. package/src/modules/plugin-api/KeyboardListenerAPI.ts +165 -0
  42. package/src/modules/plugin-api/MediaAPI.ts +337 -0
  43. package/src/modules/plugin-api/SimulationAPI.ts +181 -0
  44. package/src/modules/plugin-api/TimeoutAPI.ts +16 -0
  45. package/src/modules/plugin-api/index.ts +28 -0
  46. package/src/modules/plugins.ts +165 -0
  47. package/src/modules/randomization.ts +327 -0
  48. package/src/modules/turk.ts +99 -0
  49. package/src/modules/utils.ts +30 -0
  50. package/.github/workflows/jest.yml +0 -20
  51. package/code-of-conduct.md +0 -56
  52. package/contributors.md +0 -61
  53. package/docs/CNAME +0 -1
  54. package/docs/about/about.md +0 -18
  55. package/docs/about/contributing.md +0 -43
  56. package/docs/about/license.md +0 -25
  57. package/docs/about/support.md +0 -7
  58. package/docs/core_library/jspsych-core.md +0 -719
  59. package/docs/core_library/jspsych-data.md +0 -587
  60. package/docs/core_library/jspsych-pluginAPI.md +0 -624
  61. package/docs/core_library/jspsych-randomization.md +0 -389
  62. package/docs/core_library/jspsych-turk.md +0 -98
  63. package/docs/extensions/extensions.md +0 -83
  64. package/docs/extensions/jspsych-ext-webgazer.md +0 -137
  65. package/docs/img/blue.png +0 -0
  66. package/docs/img/devtools-change-css.png +0 -0
  67. package/docs/img/devtools-css-errors.png +0 -0
  68. package/docs/img/devtools-inspect-element.png +0 -0
  69. package/docs/img/folder-setup.png +0 -0
  70. package/docs/img/folder-with-html.png +0 -0
  71. package/docs/img/githubreleases.jpg +0 -0
  72. package/docs/img/jspsych-favicon.png +0 -0
  73. package/docs/img/jspsych-logo-no-text-mono.svg +0 -493
  74. package/docs/img/jspsych-logo.jpg +0 -0
  75. package/docs/img/orange.png +0 -0
  76. package/docs/img/palmer_stim.png +0 -0
  77. package/docs/img/progress_bar.png +0 -0
  78. package/docs/img/prolific-study-completion.png +0 -0
  79. package/docs/img/prolific-study-link.png +0 -0
  80. package/docs/img/visual_search_example.jpg +0 -0
  81. package/docs/index.md +0 -9
  82. package/docs/overview/browser-device-support.md +0 -35
  83. package/docs/overview/callbacks.md +0 -180
  84. package/docs/overview/data.md +0 -281
  85. package/docs/overview/dynamic-parameters.md +0 -147
  86. package/docs/overview/exclude-browser.md +0 -32
  87. package/docs/overview/experiment-options.md +0 -149
  88. package/docs/overview/eye-tracking.md +0 -271
  89. package/docs/overview/fullscreen.md +0 -36
  90. package/docs/overview/media-preloading.md +0 -369
  91. package/docs/overview/mturk.md +0 -77
  92. package/docs/overview/plugins.md +0 -320
  93. package/docs/overview/progress-bar.md +0 -110
  94. package/docs/overview/prolific.md +0 -78
  95. package/docs/overview/record-browser-interactions.md +0 -23
  96. package/docs/overview/running-experiments.md +0 -95
  97. package/docs/overview/style.md +0 -293
  98. package/docs/overview/timeline.md +0 -457
  99. package/docs/plugins/jspsych-animation.md +0 -40
  100. package/docs/plugins/jspsych-audio-button-response.md +0 -60
  101. package/docs/plugins/jspsych-audio-keyboard-response.md +0 -58
  102. package/docs/plugins/jspsych-audio-slider-response.md +0 -53
  103. package/docs/plugins/jspsych-call-function.md +0 -81
  104. package/docs/plugins/jspsych-canvas-button-response.md +0 -66
  105. package/docs/plugins/jspsych-canvas-keyboard-response.md +0 -68
  106. package/docs/plugins/jspsych-canvas-slider-response.md +0 -89
  107. package/docs/plugins/jspsych-categorize-animation.md +0 -60
  108. package/docs/plugins/jspsych-categorize-html.md +0 -53
  109. package/docs/plugins/jspsych-categorize-image.md +0 -53
  110. package/docs/plugins/jspsych-cloze.md +0 -45
  111. package/docs/plugins/jspsych-external-html.md +0 -70
  112. package/docs/plugins/jspsych-free-sort.md +0 -56
  113. package/docs/plugins/jspsych-fullscreen.md +0 -57
  114. package/docs/plugins/jspsych-html-button-response.md +0 -42
  115. package/docs/plugins/jspsych-html-keyboard-response.md +0 -51
  116. package/docs/plugins/jspsych-html-slider-response.md +0 -45
  117. package/docs/plugins/jspsych-iat-html.md +0 -64
  118. package/docs/plugins/jspsych-iat-image.md +0 -64
  119. package/docs/plugins/jspsych-image-button-response.md +0 -48
  120. package/docs/plugins/jspsych-image-keyboard-response.md +0 -58
  121. package/docs/plugins/jspsych-image-slider-response.md +0 -54
  122. package/docs/plugins/jspsych-instructions.md +0 -58
  123. package/docs/plugins/jspsych-maxdiff.md +0 -41
  124. package/docs/plugins/jspsych-preload.md +0 -128
  125. package/docs/plugins/jspsych-rdk.md +0 -119
  126. package/docs/plugins/jspsych-reconstruction.md +0 -48
  127. package/docs/plugins/jspsych-resize.md +0 -39
  128. package/docs/plugins/jspsych-same-different-html.md +0 -53
  129. package/docs/plugins/jspsych-same-different-image.md +0 -66
  130. package/docs/plugins/jspsych-serial-reaction-time-mouse.md +0 -52
  131. package/docs/plugins/jspsych-serial-reaction-time.md +0 -57
  132. package/docs/plugins/jspsych-survey-html-form.md +0 -50
  133. package/docs/plugins/jspsych-survey-likert.md +0 -70
  134. package/docs/plugins/jspsych-survey-multi-choice.md +0 -48
  135. package/docs/plugins/jspsych-survey-multi-select.md +0 -53
  136. package/docs/plugins/jspsych-survey-text.md +0 -63
  137. package/docs/plugins/jspsych-video-button-response.md +0 -54
  138. package/docs/plugins/jspsych-video-keyboard-response.md +0 -50
  139. package/docs/plugins/jspsych-video-slider-response.md +0 -60
  140. package/docs/plugins/jspsych-virtual-chinrest.md +0 -105
  141. package/docs/plugins/jspsych-visual-search-circle.md +0 -52
  142. package/docs/plugins/jspsych-vsl-animate-occlusion.md +0 -55
  143. package/docs/plugins/jspsych-vsl-grid-scene.md +0 -62
  144. package/docs/plugins/jspsych-webgazer-calibrate.md +0 -61
  145. package/docs/plugins/jspsych-webgazer-init-camera.md +0 -30
  146. package/docs/plugins/jspsych-webgazer-validate.md +0 -44
  147. package/docs/plugins/list-of-plugins.md +0 -54
  148. package/docs/tutorials/hello-world.md +0 -162
  149. package/docs/tutorials/rt-task.md +0 -1334
  150. package/docs/tutorials/video-tutorials.md +0 -11
  151. package/examples/add-to-end-of-timeline.html +0 -38
  152. package/examples/case-sensitive-responses.html +0 -45
  153. package/examples/conditional-and-loop-functions.html +0 -64
  154. package/examples/css/jquery-ui.css +0 -1225
  155. package/examples/css-classes-parameter.html +0 -145
  156. package/examples/data-add-properties.html +0 -44
  157. package/examples/data-as-function.html +0 -39
  158. package/examples/data-from-timeline.html +0 -52
  159. package/examples/data-from-url.html +0 -21
  160. package/examples/demo-flanker.html +0 -117
  161. package/examples/demo-simple-rt-task.html +0 -120
  162. package/examples/demos/demo_1.html +0 -35
  163. package/examples/demos/demo_2.html +0 -50
  164. package/examples/demos/demo_3.html +0 -63
  165. package/examples/display-element-to-embed-experiment.html +0 -79
  166. package/examples/end-active-node.html +0 -52
  167. package/examples/end-experiment.html +0 -45
  168. package/examples/exclusions.html +0 -32
  169. package/examples/external_html/simple_consent.html +0 -4
  170. package/examples/img/1.gif +0 -0
  171. package/examples/img/10.gif +0 -0
  172. package/examples/img/11.gif +0 -0
  173. package/examples/img/12.gif +0 -0
  174. package/examples/img/2.gif +0 -0
  175. package/examples/img/3.gif +0 -0
  176. package/examples/img/4.gif +0 -0
  177. package/examples/img/5.gif +0 -0
  178. package/examples/img/6.gif +0 -0
  179. package/examples/img/7.gif +0 -0
  180. package/examples/img/8.gif +0 -0
  181. package/examples/img/9.gif +0 -0
  182. package/examples/img/age/of1.jpg +0 -0
  183. package/examples/img/age/of2.jpg +0 -0
  184. package/examples/img/age/of3.jpg +0 -0
  185. package/examples/img/age/om1.jpg +0 -0
  186. package/examples/img/age/om2.jpg +0 -0
  187. package/examples/img/age/om3.jpg +0 -0
  188. package/examples/img/age/yf1.jpg +0 -0
  189. package/examples/img/age/yf4.jpg +0 -0
  190. package/examples/img/age/yf5.jpg +0 -0
  191. package/examples/img/age/ym2.jpg +0 -0
  192. package/examples/img/age/ym3.jpg +0 -0
  193. package/examples/img/age/ym5.jpg +0 -0
  194. package/examples/img/backwardN.gif +0 -0
  195. package/examples/img/blue.png +0 -0
  196. package/examples/img/card.png +0 -0
  197. package/examples/img/con1.png +0 -0
  198. package/examples/img/con2.png +0 -0
  199. package/examples/img/fixation.gif +0 -0
  200. package/examples/img/happy_face_1.jpg +0 -0
  201. package/examples/img/happy_face_2.jpg +0 -0
  202. package/examples/img/happy_face_3.jpg +0 -0
  203. package/examples/img/happy_face_4.jpg +0 -0
  204. package/examples/img/inc1.png +0 -0
  205. package/examples/img/inc2.png +0 -0
  206. package/examples/img/normalN.gif +0 -0
  207. package/examples/img/orange.png +0 -0
  208. package/examples/img/redX.png +0 -0
  209. package/examples/img/ribbon.jpg +0 -0
  210. package/examples/img/sad_face_1.jpg +0 -0
  211. package/examples/img/sad_face_2.jpg +0 -0
  212. package/examples/img/sad_face_3.jpg +0 -0
  213. package/examples/img/sad_face_4.jpg +0 -0
  214. package/examples/js/snap.svg-min.js +0 -21
  215. package/examples/js/webgazer/ridgeWorker.mjs +0 -135
  216. package/examples/js/webgazer/webgazer.js +0 -88909
  217. package/examples/js/webgazer/worker_scripts/mat.js +0 -306
  218. package/examples/js/webgazer/worker_scripts/util.js +0 -398
  219. package/examples/jspsych-RDK.html +0 -58
  220. package/examples/jspsych-animation.html +0 -39
  221. package/examples/jspsych-audio-button-response.html +0 -58
  222. package/examples/jspsych-audio-keyboard-response.html +0 -68
  223. package/examples/jspsych-audio-slider-response.html +0 -61
  224. package/examples/jspsych-call-function.html +0 -32
  225. package/examples/jspsych-canvas-button-response.html +0 -95
  226. package/examples/jspsych-canvas-keyboard-response.html +0 -78
  227. package/examples/jspsych-canvas-slider-response.html +0 -67
  228. package/examples/jspsych-categorize-animation.html +0 -49
  229. package/examples/jspsych-categorize-html.html +0 -33
  230. package/examples/jspsych-categorize-image.html +0 -44
  231. package/examples/jspsych-cloze.html +0 -37
  232. package/examples/jspsych-free-sort.html +0 -109
  233. package/examples/jspsych-fullscreen.html +0 -45
  234. package/examples/jspsych-html-button-response.html +0 -43
  235. package/examples/jspsych-html-keyboard-response.html +0 -42
  236. package/examples/jspsych-html-slider-response.html +0 -53
  237. package/examples/jspsych-iat.html +0 -520
  238. package/examples/jspsych-image-button-response.html +0 -91
  239. package/examples/jspsych-image-keyboard-response.html +0 -85
  240. package/examples/jspsych-image-slider-response.html +0 -85
  241. package/examples/jspsych-instructions.html +0 -37
  242. package/examples/jspsych-maxdiff.html +0 -33
  243. package/examples/jspsych-preload.html +0 -140
  244. package/examples/jspsych-reconstruction.html +0 -43
  245. package/examples/jspsych-resize.html +0 -34
  246. package/examples/jspsych-same-different-html.html +0 -28
  247. package/examples/jspsych-same-different-image.html +0 -39
  248. package/examples/jspsych-serial-reaction-time-mouse.html +0 -98
  249. package/examples/jspsych-serial-reaction-time.html +0 -54
  250. package/examples/jspsych-survey-html-form.html +0 -33
  251. package/examples/jspsych-survey-likert.html +0 -42
  252. package/examples/jspsych-survey-multi-choice.html +0 -40
  253. package/examples/jspsych-survey-multi-select.html +0 -42
  254. package/examples/jspsych-survey-text.html +0 -34
  255. package/examples/jspsych-video-button-response.html +0 -65
  256. package/examples/jspsych-video-keyboard-response.html +0 -61
  257. package/examples/jspsych-video-slider-response.html +0 -63
  258. package/examples/jspsych-virtual-chinrest.html +0 -69
  259. package/examples/jspsych-visual-search-circle.html +0 -64
  260. package/examples/jspsych-vsl-animate-occlusion.html +0 -35
  261. package/examples/jspsych-vsl-grid-scene.html +0 -47
  262. package/examples/lexical-decision.html +0 -134
  263. package/examples/manual-preloading.html +0 -59
  264. package/examples/pause-unpause.html +0 -33
  265. package/examples/progress-bar.html +0 -68
  266. package/examples/save-trial-parameters.html +0 -98
  267. package/examples/sound/hammer.mp3 +0 -0
  268. package/examples/sound/sound.mp3 +0 -0
  269. package/examples/sound/speech_blue.mp3 +0 -0
  270. package/examples/sound/speech_green.mp3 +0 -0
  271. package/examples/sound/speech_joke.mp3 +0 -0
  272. package/examples/sound/speech_red.mp3 +0 -0
  273. package/examples/sound/tone.mp3 +0 -0
  274. package/examples/timeline-variables-sampling.html +0 -50
  275. package/examples/timeline-variables.html +0 -64
  276. package/examples/video/sample_video.mp4 +0 -0
  277. package/examples/webgazer.html +0 -174
  278. package/examples/webgazer_audio.html +0 -90
  279. package/examples/webgazer_image.html +0 -60
  280. package/extensions/jspsych-ext-webgazer.js +0 -265
  281. package/jspsych.js +0 -3023
  282. package/license.txt +0 -21
  283. package/mkdocs.yml +0 -118
  284. package/plugins/jspsych-animation.js +0 -189
  285. package/plugins/jspsych-audio-button-response.js +0 -269
  286. package/plugins/jspsych-audio-keyboard-response.js +0 -209
  287. package/plugins/jspsych-audio-slider-response.js +0 -278
  288. package/plugins/jspsych-call-function.js +0 -58
  289. package/plugins/jspsych-canvas-button-response.js +0 -199
  290. package/plugins/jspsych-canvas-keyboard-response.js +0 -155
  291. package/plugins/jspsych-canvas-slider-response.js +0 -207
  292. package/plugins/jspsych-categorize-animation.js +0 -266
  293. package/plugins/jspsych-categorize-html.js +0 -220
  294. package/plugins/jspsych-categorize-image.js +0 -222
  295. package/plugins/jspsych-cloze.js +0 -112
  296. package/plugins/jspsych-external-html.js +0 -112
  297. package/plugins/jspsych-free-sort.js +0 -478
  298. package/plugins/jspsych-fullscreen.js +0 -106
  299. package/plugins/jspsych-html-button-response.js +0 -188
  300. package/plugins/jspsych-html-keyboard-response.js +0 -149
  301. package/plugins/jspsych-html-slider-response.js +0 -202
  302. package/plugins/jspsych-iat-html.js +0 -284
  303. package/plugins/jspsych-iat-image.js +0 -286
  304. package/plugins/jspsych-image-button-response.js +0 -327
  305. package/plugins/jspsych-image-keyboard-response.js +0 -263
  306. package/plugins/jspsych-image-slider-response.js +0 -369
  307. package/plugins/jspsych-instructions.js +0 -237
  308. package/plugins/jspsych-maxdiff.js +0 -173
  309. package/plugins/jspsych-preload.js +0 -345
  310. package/plugins/jspsych-rdk.js +0 -1373
  311. package/plugins/jspsych-reconstruction.js +0 -134
  312. package/plugins/jspsych-resize.js +0 -166
  313. package/plugins/jspsych-same-different-html.js +0 -168
  314. package/plugins/jspsych-same-different-image.js +0 -169
  315. package/plugins/jspsych-serial-reaction-time-mouse.js +0 -212
  316. package/plugins/jspsych-serial-reaction-time.js +0 -247
  317. package/plugins/jspsych-survey-html-form.js +0 -171
  318. package/plugins/jspsych-survey-likert.js +0 -195
  319. package/plugins/jspsych-survey-multi-choice.js +0 -208
  320. package/plugins/jspsych-survey-multi-select.js +0 -232
  321. package/plugins/jspsych-survey-text.js +0 -185
  322. package/plugins/jspsych-video-button-response.js +0 -335
  323. package/plugins/jspsych-video-keyboard-response.js +0 -279
  324. package/plugins/jspsych-video-slider-response.js +0 -351
  325. package/plugins/jspsych-virtual-chinrest.js +0 -471
  326. package/plugins/jspsych-visual-search-circle.js +0 -259
  327. package/plugins/jspsych-vsl-animate-occlusion.js +0 -196
  328. package/plugins/jspsych-vsl-grid-scene.js +0 -103
  329. package/plugins/jspsych-webgazer-calibrate.js +0 -161
  330. package/plugins/jspsych-webgazer-init-camera.js +0 -139
  331. package/plugins/jspsych-webgazer-validate.js +0 -314
  332. package/plugins/template/jspsych-plugin-template.js +0 -35
  333. package/tests/README.md +0 -7
  334. package/tests/jsPsych/case-sensitive-responses.test.js +0 -53
  335. package/tests/jsPsych/css-classes-parameter.test.js +0 -107
  336. package/tests/jsPsych/default-iti.test.js +0 -51
  337. package/tests/jsPsych/default-parameters.test.js +0 -58
  338. package/tests/jsPsych/endexperiment.test.js +0 -49
  339. package/tests/jsPsych/events.test.js +0 -606
  340. package/tests/jsPsych/functions-as-parameters.test.js +0 -210
  341. package/tests/jsPsych/init.test.js +0 -48
  342. package/tests/jsPsych/loads.test.js +0 -7
  343. package/tests/jsPsych/min-rt.test.js +0 -58
  344. package/tests/jsPsych/progressbar.test.js +0 -202
  345. package/tests/jsPsych/timeline-variables.test.js +0 -531
  346. package/tests/jsPsych/timelines.test.js +0 -569
  347. package/tests/jsPsych.data/data-csv-conversion.test.js +0 -85
  348. package/tests/jsPsych.data/data-json-conversion.test.js +0 -120
  349. package/tests/jsPsych.data/datacollection.test.js +0 -117
  350. package/tests/jsPsych.data/datacolumn.test.js +0 -50
  351. package/tests/jsPsych.data/datamodule.test.js +0 -152
  352. package/tests/jsPsych.data/dataparameter.test.js +0 -251
  353. package/tests/jsPsych.data/interactions.test.js +0 -109
  354. package/tests/jsPsych.data/trialparameters.test.js +0 -175
  355. package/tests/jsPsych.extensions/extensions.test.js +0 -207
  356. package/tests/jsPsych.extensions/test-extension.js +0 -42
  357. package/tests/jsPsych.pluginAPI/pluginapi.test.js +0 -365
  358. package/tests/jsPsych.pluginAPI/preloads.test.js +0 -43
  359. package/tests/jsPsych.randomization/randomziation.test.js +0 -27
  360. package/tests/jsPsych.utils/utils.test.js +0 -58
  361. package/tests/plugins/plugin-animation.test.js +0 -34
  362. package/tests/plugins/plugin-audio-button-response.test.js +0 -15
  363. package/tests/plugins/plugin-audio-keyboard-response.test.js +0 -15
  364. package/tests/plugins/plugin-audio-slider-response.test.js +0 -15
  365. package/tests/plugins/plugin-call-function.test.js +0 -49
  366. package/tests/plugins/plugin-categorize-animation.test.js +0 -263
  367. package/tests/plugins/plugin-categorize-html.test.js +0 -17
  368. package/tests/plugins/plugin-categorize-image.test.js +0 -17
  369. package/tests/plugins/plugin-cloze.test.js +0 -157
  370. package/tests/plugins/plugin-free-sort.test.js +0 -106
  371. package/tests/plugins/plugin-fullscreen.test.js +0 -41
  372. package/tests/plugins/plugin-html-button-response.test.js +0 -161
  373. package/tests/plugins/plugin-html-keyboard-response.test.js +0 -139
  374. package/tests/plugins/plugin-html-slider-response.test.js +0 -155
  375. package/tests/plugins/plugin-iat-html.test.js +0 -299
  376. package/tests/plugins/plugin-iat-image.test.js +0 -298
  377. package/tests/plugins/plugin-image-button-response.test.js +0 -174
  378. package/tests/plugins/plugin-image-keyboard-response.test.js +0 -147
  379. package/tests/plugins/plugin-image-slider-response.test.js +0 -174
  380. package/tests/plugins/plugin-instructions.test.js +0 -85
  381. package/tests/plugins/plugin-maxdiff.test.js +0 -39
  382. package/tests/plugins/plugin-preload.test.js +0 -916
  383. package/tests/plugins/plugin-rdk.test.js +0 -61
  384. package/tests/plugins/plugin-reconstruction.test.js +0 -16
  385. package/tests/plugins/plugin-resize.test.js +0 -16
  386. package/tests/plugins/plugin-same-different-html.test.js +0 -17
  387. package/tests/plugins/plugin-same-different-image.test.js +0 -17
  388. package/tests/plugins/plugin-serial-reaction-time-mouse.test.js +0 -42
  389. package/tests/plugins/plugin-serial-reaction-time.test.js +0 -109
  390. package/tests/plugins/plugin-survey-html-form.test.js +0 -44
  391. package/tests/plugins/plugin-survey-likert.test.js +0 -48
  392. package/tests/plugins/plugin-survey-multi-choice.test.js +0 -47
  393. package/tests/plugins/plugin-survey-multi-select.test.js +0 -71
  394. package/tests/plugins/plugin-survey-text.test.js +0 -115
  395. package/tests/plugins/plugin-video-button-response.test.js +0 -32
  396. package/tests/plugins/plugin-video-keyboard-response.test.js +0 -32
  397. package/tests/plugins/plugin-video-slider-response.test.js +0 -31
  398. package/tests/plugins/plugin-visual-search-circle.test.js +0 -16
  399. package/tests/plugins/plugin-vsl-animate-occlusion.test.js +0 -16
  400. package/tests/plugins/plugin-vsl-grid-scene.test.js +0 -16
  401. package/tests/testing-utils.js +0 -13
package/docs/overview/plugins.md DELETED
@@ -1,320 +0,0 @@
1
- # Plugins
2
-
3
- In jsPsych, plugins define the kinds of trials or events that should occur during the experiment. Some plugins define very general events, like displaying a set of instructions pages, displaying an image and recording a keyboard response, or playing a sound file and recording a button response. Other plugins are more specific, like those that display particular kinds of stimuli (e.g. Random-Dot Kinematogram, visual search circle), or run a specific version of particular kind of task (e.g. the Implicit Association Test). Creating an experiment with jsPsych involves figuring out which plugins are needed to create the tasks you want your participants to perform.
4
-
5
- Plugins provide a structure for a particular trial or task, but often allow for significant customization and flexibility. For example, the `image-keyboard-response` plugin defines a simple structure for showing an image and collecting a keyboard response. You can specify the what the stimulus is, what keys the subject is allowed to press, and how long the stimulus should be on the screen, how long the subject has to respond, and so on. Many of these options have reasonable default values; even though the image plugin has many different parameters, you only *need* to specify the image stimulus in order to use it. Each plugin has its own documentation page, which describes what the plugin does, what options are available, and what kind of data it collects.
6
-
7
- ## Using a plugin
8
-
9
- To use a plugin, you'll need to load the plugin's JavaScript file in your experiment's HTML page. All jsPsych experiments also need to load the "jsPsych.js" file.
10
-
11
- ```html
12
- <head>
13
- <script src="jsPsych/jspsych.js" type="text/javascript"></script>
14
- <script src="jsPsych/plugins/jspsych-image-keyboard-response.js" type="text/javascript"></script>
15
- </head>
16
- ```
17
-
18
- Once a plugin is loaded, you can use JavaScript to define a trial that uses that plugin. All jsPsych trials have a `type`, which tells jsPsych what plugin to use to run the trial. The trial's `type` is the plugin name, which usually the same as the plugin file name, but with the "jspsych-" prefix removed.
19
-
20
- The following JavaScript code defines a trial using the `image-keyboard-response` plugin to display an image file. This trial uses the default values for valid keys, stimulus duration, trial duration, and other parameters.
21
-
22
- ```javascript
23
- var image_trial = {
24
- type: 'image-keyboard-response',
25
- stimulus: 'images/happy_face.jpg'
26
- }
27
- ```
28
-
29
- You can override any default parameter values by adding them into your trial object. Here's an exampe of overriding the default values for `trial_duration` and `post_trial_gap`:
30
-
31
- ```javascript
32
- var image_trial = {
33
- type: 'image-keyboard-response',
34
- stimulus: 'images/happy_face.jpg',
35
- trial_duration: 3000,
36
- post_trial_gap: 2000
37
- }
38
- ```
39
-
40
- ## Parameters available in all plugins
41
-
42
- Each plugin specifies its own set of parameters. Check the documentation for a plugin to see what parameters are available and what they do.
43
-
44
- There is also a set of parameters that can be specified for any plugin:
45
-
46
- | Parameter | Type | Default Value | Description |
47
- | -------------- | -------- | ----------------------- | ---------------------------------------- |
48
- | data | object | *undefined* | An object containing additional data to store for the trial. See [the Data page](../overview/data.md) for more details. |
49
- | post_trial_gap | numeric | null | Sets the time, in milliseconds, between the current trial and the next trial. If null, there will be no gap. |
50
- | on_start | function | `function(){ return; }` | A callback function to execute when the trial begins, before any loading has occurred. See [the Event-Related Callbacks page](../overview/callbacks.md) for more details. |
51
- | on_finish | function | `function(){ return; }` | A callback function to execute when the trial finishes, and before the next trial begins. See [the Event-Related Callbacks page](../overview/callbacks.md) for more details. |
52
- | on_load | function | `function(){ return; }` | A callback function to execute when the trial has loaded, which typically happens after the initial display of the plugin has loaded. See [the Event-Related Callbacks page](../overview/callbacks.md) for more details. |
53
- | css_classes | string | null | A list of CSS classes to add to the jsPsych display element for the duration of this trial. This allows you to create custom formatting rules (CSS classes) that are only applied to specific trials. For more information and examples, see the [Controlling Visual Appearance page](../overview/style.md) and the "css-classes-parameter.html" file in the jsPsych examples folder. |
54
- | save_trial_parameters | object | `{}` | An object containing any trial parameters that should or should not be saved to the trial data. Each key is the name of a trial parameter, and its value should be `true` or `false`, depending on whether or not its value should be saved to the data. If the parameter is a function that returns the parameter value, then the value that is returned will be saved to the data. If the parameter is always expected to be a function (e.g. an event-related callback function), then the function itself will be saved as a string. For more examples, see the "save-trial-parameters.html" file in the jsPsych examples folder. |
55
-
56
- ### The data parameter
57
-
58
- The `data` parameter allows you to add additional properties to the trial data. This can be useful for storing properties of the trial that are not directly apparent from the values that the plugin records. The `data` parameter value should be an object that contains key-value pairs.
59
-
60
- A simple example is the [Flanker Task](https://en.wikipedia.org/wiki/Eriksen_flanker_task). In this experiment, participants respond to the direction of a central arrow by pressing a key to the left for a left-pointing arrow (<) and a key to the right for a right-pointing arrow (>). The arrow appears in the center of *flankers*, or arrows that the participant should ignore. Those flankers can be congruent (>>>>>) or incongruent (<<><<).
61
-
62
- A trial for the Flanker Task written with jsPsych might look like this:
63
-
64
- ```javascript
65
- var trial = {
66
- type: 'html-keyboard-response',
67
- stimulus: '<<<<<',
68
- choices: ['f','j'],
69
- data: {
70
- stimulus_type: 'congruent',
71
- target_direction: 'left'
72
- }
73
- }
74
- ```
75
-
76
- Note the use of the data parameter to add a property `stimulus_type` with the value `congruent` and a property `target_direction` with the value `left`. Having these properties recorded directly in the data simplifies data analysis, making it easy to aggregate data by `stimulus_type` and/or `target_direction`.
77
-
78
- ### The post_trial_gap (ITI) parameter
79
-
80
- The default inter-trial interval (ITI) in jsPsych is 0 ms. This can be adjusted at the experiment-wide level by changing the `default_iti` parameter in `jsPsych.init()`.
81
-
82
- The ITI can also be controlled at the trial level through the `post_trial_gap` parameter. Setting this parameter to a positive integer *x* will cause a blank screen to display after the trial for *x* milliseconds. Setting this parameter for a trial will override the `default_iti` value set in `jsPsych.init`.
83
-
84
- ```javascript
85
- var trial = {
86
- type: 'html-keyboard-response',
87
- stimulus: 'There will be a 1.5 second blank screen after this trial.',
88
- post_trial_gap: 1500
89
- }
90
- ```
91
-
92
- ### The on_start parameter
93
-
94
- Immediately before a trial runs, there is an opportunity to run an arbitrary function through the `on_start` event handler. This event handler is passed a single argument containing an *editable* copy of the trial parameters. This function can therefore be used to alter the trial based on the state of the experiment, among other uses.
95
-
96
- ```javascript
97
- // when this trial runs, the on_start function will change the trial's stimulus and data parameters,
98
- // so the trial will display an incongruent Flanker stimulus with a right-facing central arrow
99
- var trial = {
100
- type: 'html-keyboard-response',
101
- stimulus: '<<<<<',
102
- choices: ['f','j'],
103
- data: {
104
- stimulus_type: 'congruent',
105
- target_direction: 'left'
106
- },
107
- on_start: function(trial){
108
- trial.stimulus = '<<><<';
109
- trial.data.stimulus_type = 'incongruent';
110
- trial.data.target_direction = 'right';
111
- }
112
- }
113
- ```
114
-
115
- ### The on_finish parameter
116
-
117
- After a trial is completed, there is an opportunity to run an arbitrary function through the `on_finish` event handler. This function is passed a single argument containing an *editable* copy of the data recorded for that trial. This function can therefore be used to update the state of the experiment based on the data collected, or modify the data collected.
118
-
119
- The `on_finish` function can be useful to calculate new data properties that were unknowable at the start of the trial. For example, with the Flanker Task example above, the `on_finish` function could check the response and use to this information to add a new property to the data called `correct`, which is either `true` or `false`.
120
-
121
- ```javascript
122
- // in addition to all of the standard data collected for this trial,
123
- // this on_finish function adds a property called 'correct'
124
- // which is either 'true' or 'false'
125
- // depending on the response that was made
126
- var trial = {
127
- type: 'html-keyboard-response',
128
- stimulus: '<<<<<',
129
- choices: ['f','j'],
130
- data: {
131
- stimulus_type: 'congruent',
132
- target_direction: 'left',
133
- correct_response: 'f'
134
- },
135
- on_finish: function(data){
136
- if(jsPsych.pluginAPI.compareKeys(data.response, data.correct_response)){
137
- data.correct = true;
138
- } else {
139
- data.correct = false;
140
- }
141
- }
142
- }
143
- ```
144
-
145
- ### The on_load parameter
146
-
147
- The `on_load` callback function will trigger once the trial has completed loading. For most plugins, this will occur once the display has been initially updated but before any user interactions or timed events (e.g., animations) have occurred. This can be useful for changing various aspects of the page elements and their properties that would otherwise require modifying the plugin file.
148
-
149
- ```javascript
150
- var trial = {
151
- type: 'image-keyboard-response',
152
- stimulus: 'imgA.png',
153
- on_load: function() {
154
- // this will change the src attribute of the image after 500ms
155
- setTimeout(function(){
156
- document.querySelector('img').src = 'imgB.png'
157
- }, 500);
158
- }
159
- };
160
- ```
161
-
162
- ### The css_classes parameter
163
-
164
- The `css_classes` parameter allows you to add an array of CSS class names to the jsPsych display element on that specific trial. This allows you to create custom style and formatting rules that are only applied to specific trials. If you want CSS rules that only apply to specific elements during a trial, you can use additional CSS selectors.
165
-
166
- ```html
167
- <style>
168
- .flanker-stimulus {
169
- font-size: 500%;
170
- }
171
- .flanker-stimulus #prompt {
172
- font-size: 18px;
173
- }
174
- .fixation {
175
- font-size: 80px;
176
- }
177
- </style>
178
- <script>
179
- var fixation_trial = {
180
- type: 'html-keyboard-response',
181
- choices: jsPsych.NO_KEYS,
182
- stimulus: '+',
183
- css_classes: ['fixation']
184
- };
185
- var flanker_trial = {
186
- type: 'html-keyboard-response',
187
- choices: ["ArrowLeft", "ArrowRight"],
188
- stimulus: '>>>>>',
189
- prompt: '<span id="prompt">Press the left or right arrow key.</span>',
190
- css_classes: ['flanker-stimulus']
191
- };
192
- </script>
193
- ```
194
-
195
- ### The save_trial_parameters parameter
196
-
197
- The `save_trial_parameters` parameter allows you to tell jsPsych what parameters you want to be saved to the data. This can be used to override the parameter values that the plugin saves by default. You can add more parameter values to the data that are not normally saved, or remove parameter values that normally are saved. This can be especially useful when the parameter value is dynamic (i.e. a function) and you want to record the value that was used during the trial.
198
-
199
- ```javascript
200
- var trial = {
201
- type: 'html-button-response',
202
- stimulus: '<p style="color: orange; font-size: 48px; font-weight: bold;">BLUE</p>',
203
- choices: function() {
204
- return jsPsych.randomization.shuffle(['Yes','No']);
205
- },
206
- post_trial_gap: function() {
207
- return jsPsych.randomization.sampleWithoutReplacement([200,300,400,500],1)[0];
208
- },
209
- save_trial_parameters: {
210
- // save the randomly-selected button order and post trial gap duration to the trial data
211
- choices: true,
212
- post_trial_gap: true,
213
- // don't save the stimulus
214
- stimulus: false
215
- }
216
- }
217
- ```
218
-
219
- !!! note
220
- You cannot remove the `internal_node_id` and `trial_index` values from the trial data, because these are used internally by jsPsych.
221
-
222
- ## Data collected by all plugins
223
-
224
- Each plugin defines what data is collected on the trial. The documentation for each plugin specifies what information will be stored in the trial data.
225
-
226
- In addition to the data collected by a plugin, there is a default set of data that is collected on every trial.
227
-
228
- | Name | Type | Value |
229
- | ---------------- | ------- | ---------------------------------------- |
230
- | trial_type | string | The name of the plugin used to run the trial. |
231
- | trial_index | numeric | The index of the current trial across the whole experiment. |
232
- | time_elapsed | numeric | The number of milliseconds between the start of the experiment and when the trial ended. |
233
- | internal_node_id | string | A string identifier for the current TimelineNode. |
234
-
235
- ## Creating a new plugin
236
-
237
- You can add new kinds of tasks to jsPsych by creating new plugins, or modifying existing plugins. A task can be virtually any kind of activity. If it can be implemented in JavaScript, then it almost certainly can be turned into a jsPsych plugin.
238
-
239
- ### What's in a plugin file?
240
-
241
- Plugin files follow a specific template. Adherence to the template is what allows jsPsych to run a plugin without knowing anything about what the plugin is doing. What makes plugins so flexible is that the template imposes very few requirements on the code. Here's what an empty plugin template looks like:
242
-
243
- ```js
244
- jsPsych.plugins['plugin-name'] = (function(){
245
-
246
- var plugin = {};
247
-
248
- plugin.info = {
249
- name: 'plugin-name',
250
- parameters: {
251
- }
252
- }
253
-
254
- plugin.trial = function(display_element, trial){
255
- jsPsych.finishTrial();
256
- }
257
-
258
- return plugin;
259
-
260
- })();
261
- ```
262
-
263
- This plugin will work! It defines a plugin called 'plugin-name', and it does absolutely nothing. However, it won't break the experiment, and jsPsych will understand that this is a valid plugin.
264
-
265
- Let's examine it in more detail.
266
-
267
- The overall structure of the plugin is defined using a module JavaScript design pattern. This pattern uses a technique called an anonymous closure. This is why the first line has `(function(){` and the last line is `})();`. The details aren't important, but if you want to learn more about it, [this is a nice overview](http://www.adequatelygood.com/JavaScript-Module-Pattern-In-Depth.html). The reason this pattern is useful is because it allows for persistent state and private scope. In other words, the plugin is isolated and can't be altered by other plugins.
268
-
269
- The module, created by the `(function(){` `})();` expressions, contains an object called `plugin`. The `plugin` object has two properties: `info` and `trial`. The `plugin` object is returned at the end of the module, which is what assigns the defined properties of `plugin` to `jsPsych['plugin-name']`.
270
-
271
- #### plugin.info
272
-
273
- The plugin's `info` property is an object that contains all of the available parameters for the plugin. Each parameter name is a property, and the value is an object that includes a description of the parameter, the value's type (string, integer, etc.), and the default value. See some of the plugin files in the jsPsych plugins folder for examples.
274
-
275
- jsPsych allows most [plugin parameters to be dynamic](dynamic-parameters.md), which means that the parameter value can be a function that will be evaluated right before the trial starts. However, if you want your plugin to have a parameter that is a function that _shouldn't_ be evaluated before the trial starts, then you should make sure that the parameter type is `'FUNCTION'`. This tells jsPsych not to evaluate the function as it normally does for dynamic parameters. See the `canvas-*` plugins for examples.
276
-
277
- #### plugin.trial
278
-
279
- The plugin's `trial` property is a function that runs a single trial. There are two parameters that are passed into the trial method. The first, `display_element`, is the DOM element where jsPsych content is being rendered. This parameter will be an `HTMLElement`. Generally, you don't need to worry about this parameter being in the correct format, and can assume that it is an `HMTLElement` and use methods of that class. The second, `trial`, is an object containing all of the parameters specified in the corresponding TimelineNode. If you have specified all of your parameters in `plugin.info`, along with default values for each one, then the `trial` object will contain the default values for any parameters that were not specified in the trial's definition.
280
-
281
- The only requirement for the `trial` method is that it calls `jsPsych.finishTrial()` when it is done. This is how jsPsych knows to advance to the next trial in the experiment (or end the experiment if it is the last trial). The plugin can do whatever it needs to do before that point.
282
-
283
- Of course, there are other things that you will probably want the plugin to do inside the `plugin.trial` function, besides just end. Here are some examples:
284
-
285
- ### Changing the content of the display
286
-
287
- There are a few ways to change the content of the display. The `display_element` parameter of the trial method contains the DOM element for displaying content, so you can use various JavaScript methods for interaction with the display element. A common one is to change the `innerHTML`.
288
-
289
- ```javascript
290
- var html_content = '<p>This is the first paragraph</p>';
291
- html_content += '<p>This is the second paragraph</p>';
292
-
293
- display_element.innerHTML = html_content;
294
- ```
295
-
296
- jsPsych doesn't clear the display before or after each trial, so it is often appropriate to use `innerHTML` to clear the display at the end of a trial:
297
-
298
- ```javascript
299
- // clear the display
300
- display_element.innerHTML = '';
301
- ```
302
-
303
- ### Writing data
304
-
305
- Plugins exist to collect data, so saving data is obviously a crucial thing to do. You can pass an object of data as the parameter to `jsPsych.finishTrial()`:
306
-
307
- ```javascript
308
- var data = {
309
- correct: true,
310
- rt: 350
311
- }
312
-
313
- jsPsych.finishTrial(data);
314
- ```
315
-
316
- The data recorded will be that `correct` is `true` and that `rt` is `350`. Additional data for the trial will also be collected automatically by the jsPsych library.
317
-
318
- ### The plugin template
319
-
320
- An empty plugin template is included in the `plugins/template` folder.
package/docs/overview/progress-bar.md DELETED
@@ -1,110 +0,0 @@
1
- # Automatic Progress Bar
2
-
3
- jsPsych can show a progress bar at the top of the experiment page indicating the subject's overall completion progress. The progress bar is rendered outside the jsPsych display element, and it requires the `jspsych.css` file to be loaded on the page. As of version 6.0, the progress bar looks like this:
4
-
5
- ![Progressbar Screenshot](/img/progress_bar.png)
6
-
7
- To show the progress bar, set the `show_progress_bar` option in `jsPsych.init` to `true`:
8
-
9
- ```javascript
10
- jsPsych.init({
11
- timeline: exp,
12
- show_progress_bar: true
13
- });
14
- ```
15
-
16
- The progress bar updates after every node on the top-level timeline updates. This avoids distracting updates in the middle of trials that are composed of multiple plugins, or confusing updates due to looping or conditional structures that may or may not execute depending on the actions of the subject. This also allows some flexibility for the programmer; by nesting timelines in a deliberate manner, the timing of progress bar updates can be controlled.
17
-
18
- ## Manual Control
19
-
20
- The progress bar can also be manually controlled using the function `jsPsych.setProgressBar()`. This function takes a numeric value between 0 and 1, representing the proportion of the progress bar to fill.
21
-
22
- ```js
23
- var trial = {
24
- type: 'html-keyboard-response',
25
- stimulus: 'Almost done...',
26
- on_finish: function(){
27
- jsPsych.setProgressBar(0.85); // set progress bar to 85% full.
28
- }
29
- }
30
- ```
31
-
32
- You can also get the current value of the progress bar with `jsPsych.getProgressBarCompleted()`.
33
-
34
- ```js
35
- var proportion_complete = jsPsych.getProgressBarCompleted();
36
- ```
37
-
38
- If you are going to use manual progress bar control, you may want to disable the automatic progress bar updates by setting the `auto_update_progress_bar` property in `jsPsych.init()` to `false`.
39
-
40
- ```js
41
- jsPsych.init({
42
- timeline: exp,
43
- show_progress_bar: true,
44
- auto_update_progress_bar: false
45
- });
46
- ```
47
-
48
- Here's a complete example showing how to use these functions and `jsPsych.init()` settings to manually update the progress bar:
49
-
50
- ```js
51
- var n_trials = 5;
52
-
53
- var start = {
54
- type: 'html-keyboard-response',
55
- stimulus: 'Press any key to start!',
56
- on_start: function() {
57
- // set progress bar to 0 at the start of experiment
58
- jsPsych.setProgressBar(0);
59
- }
60
- };
61
-
62
- var trial = {
63
- type: 'html-keyboard-response',
64
- stimulus: 'This is a trial!',
65
- on_finish: function() {
66
- // at the end of each trial, update the progress bar
67
- // based on the current value and the proportion to update for each trial
68
- var curr_progress_bar_value = jsPsych.getProgressBarCompleted();
69
- jsPsych.setProgressBar(curr_progress_bar_value + (1/n_trials));
70
- }
71
- };
72
-
73
- var trials = {
74
- timeline: [trial],
75
- repetitions: n_trials
76
- };
77
-
78
- var done = {
79
- type: 'html-keyboard-response',
80
- stimulus: 'Done!'
81
- };
82
-
83
- jsPsych.init({
84
- timeline: [start, trials, done],
85
- show_progress_bar: true,
86
- auto_update_progress_bar: false
87
- });
88
- ```
89
-
90
- ## Custom Text
91
-
92
- By default, jsPsych adds the text "Completion Progress" to the left of the progress bar. You can specify custom text using the `message_progress_bar` parameter in `jsPsych.init`.
93
-
94
- ```js
95
- // support for different spoken languages
96
- jsPsych.init({
97
- timeline: [...],
98
- show_progress_bar: true,
99
- message_progress_bar: 'Porcentaje completo'
100
- });
101
- ```
102
-
103
- ```js
104
- // no message
105
- jsPsych.init({
106
- timeline: [...],
107
- show_progress_bar: true,
108
- message_progress_bar: ''
109
- });
110
- ```
package/docs/overview/prolific.md DELETED
@@ -1,78 +0,0 @@
1
- # Intergrating with Prolific
2
-
3
- [Prolific](https://www.prolific.co/?ref=5JCXZPVU) is a participant recruitment service aimed at research. Integrating a jsPsych experiment with Prolific requires capturing the participant's ID and sending the participant to a completion URL at the end of the experiment.
4
-
5
- ## Capturing the Participant ID, Study ID, and Session ID
6
-
7
- When creating a study on Prolific you must provide the URL to your study. You can host your jsPsych experiment however you'd like - some options are discussed in the [Running Experiments](/overview/running-experiments/#hosting-the-experiment-and-saving-the-data) documentation page. Once you've got a URL to your experiment, you can enter that in the *study link* section of Prolific. Then, click the option to record Prolific IDs via URL parameters.
8
-
9
- ![Prolific screenshot](/img/prolific-study-link.png)
10
-
11
- This will append information about the participant's prolific ID (`PROLIFIC_PID`), the study's ID (`STUDY_ID`), and the session ID (`SESSION_ID`) to the URL that participants use to access your experiment.
12
-
13
- We can capture these variables with jsPsych, and add them to jsPsych's data. This can be done anywhere in your code. This code does not need to run as part of your experiment timeline.
14
-
15
- ```html
16
- <script>
17
- // capture info from Prolific
18
- var subject_id = jsPsych.data.getURLVariable('PROLIFIC_PID');
19
- var study_id = jsPsych.data.getURLVariable('STUDY_ID');
20
- var session_id = jsPsych.data.getURLVariable('SESSION_ID');
21
-
22
- jsPsych.data.addProperties({
23
- subject_id: subject_id,
24
- study_id: study_id,
25
- session_id: session_id
26
- });
27
-
28
- // create the rest of the experiment
29
- var timeline = [...]
30
-
31
- jsPsych.init({
32
- timeline: timeline
33
- })
34
- </script>
35
- ```
36
-
37
- ## Completing the Experiment
38
-
39
- When the experiment is complete, Prolific requires that you send the participant to a specific URL that marks the session as complete on Prolific's server. The link is provided to you by Prolific in the *study completion* section of the setup.
40
-
41
- ![Prolific Study Completion Screenshot](/img/prolific-study-completion.png)
42
-
43
- You can accomplish this in a couple different ways.
44
-
45
- !!! warning
46
- It's important that you've saved all the data from your experiment before the participant returns to Prolific. Make sure that any server communication has completed prior to redirecting the participant. One way to do this is by using the async features of the `call-function` plugin ([example](/plugins/jspsych-call-function/#async-function-call)).
47
-
48
- ### Participant clicks a link
49
-
50
- One option is to create a trial that contains a link that the participant clicks to end the experiment and return to Prolific. For example, the `html-keyboard-response` plugin can be used to display text that includes a link. This could go on a debriefing page.
51
-
52
- Here's an example trial that could be used. Note that `choices` is set to `jsPsych.NO_KEYS`, which will prevent the participant from continuing past this point in the experiment.
53
-
54
- ```js
55
- var final_trial = {
56
- type: 'html-keyboard-response',
57
- stimulus: `<p>You've finished the last task. Thanks for participating!</p>
58
- <p><a href="https://app.prolific.co/submissions/complete?cc=XXXXXXX">Click here to return to Prolific and complete the study</a>.</p>`,
59
- choices: jsPsych.NO_KEYS
60
- }
61
- ```
62
-
63
- ### Automatically redirect
64
-
65
- A second option is to automatically redirect the participant to the completion URL when the experiment is finished. You could do this in a number of places in the jsPsych timeline.
66
-
67
- Here's an example using the `on_finish` event for the entire experiment.
68
-
69
- ```js
70
- jsPsych.init({
71
- timeline: [...],
72
- on_finish: function(){
73
- window.location = "https://app.prolific.co/submissions/complete?cc=XXXXXXX"
74
- }
75
- });
76
- ```
77
-
78
-
package/docs/overview/record-browser-interactions.md DELETED
@@ -1,23 +0,0 @@
1
- # Record browser interactions
2
-
3
- Participants in an online experiment have the freedom to multitask while performing an experiment. jsPsych automatically records information about when the user clicks on a window that is not the experiment, and about when the user exits full screen mode if the experiment is running in full screen mode. This data is stored separately from the main experiment data, and can be accessed with [jsPsych.data.getInteractionData()](../core_library/jspsych-data.md#jspsychdatagetinteractiondata).
4
-
5
- Each time the user leaves the experiment window, returns to the experiment window, exits full screen mode, or enters full screen mode, the event is recorded in the interaction data. Each event has the following structure.
6
-
7
- ```javascript
8
- {
9
- event: 'focus', // 'focus' or 'blur' or 'fullscreenenter' or 'fullscreenexit'
10
- trial: 12, // the index of the active trial when the event happened
11
- time: 1240543 // time in ms since the start of the experiment
12
- }
13
- ```
14
-
15
- You can specify a custom function, in the jsPsych.init() method, that is called whenever one of these events occurs
16
-
17
- ```javascript
18
- jsPsych.init({
19
- on_interaction_data_update: function(data) {
20
- console.log(JSON.stringify(data))
21
- }
22
- });
23
- ```
package/docs/overview/running-experiments.md DELETED
@@ -1,95 +0,0 @@
1
- # Running Experiments
2
-
3
- You can run your jsPsych experiment:
4
-
5
- **Offline**, by opening the HTML file directly in the browser using the `file://` protocol.
6
-
7
- **Online**, by hosting the files on a web server using the `http://` or `https://` protocol.
8
-
9
- The way that you run your experiment will have consequences for certain aspects about how the experiment works, and what your experiment will be able to do. This page explains what you need to know about both of these options.
10
-
11
-
12
-
13
- ## Offline
14
-
15
- You can run your jsPsych experiment offline by opening the HTML file directly in a web browser, for instance by double-clicking on it. This uses the `file://` protocol. It's usually the fastest and easiest way to run through an experiment, and is very useful while writing and testing the code.
16
-
17
- At some point you will need to move your experiment files onto a server and send the data to a database, since this is how you will ultimately collect the data (unless you're planning to collect data on your local computer). There are some important differences between the way the experiment runs offline compared to online via a web server.
18
-
19
- Note that, unless noted, here we're using the word "server" to mean either a _local_ server (which runs on your computer and only makes the experiment files available from within that computer, and is often used during development), or a _remote_ server (which does not run on your computer and does share your experiment files over the internet).
20
-
21
- ### Cross-origin requests (CORS) and safe mode
22
-
23
- Web browsers have a security policy called [cross-origin resource sharing (CORS)](https://en.wikipedia.org/wiki/Cross-origin_resource_sharing) that determines whether the webpage can request files that come from a different origin (i.e. protocol, host/domain, and port). This isn't a problem when your study runs _online_, because in that case your experiment files all have the same origin. However, when you run your experiment _offline_, the CORS policy blocks some jsPsych features that require [loading local files](https://security.stackexchange.com/questions/190266/why-chrome-blocks-ajax-locally/190321#190321). If your experiment uses these features, then [CORS errors](https://developer.mozilla.org/en-US/docs/Web/HTTP/CORS/Errors) will prevent the experiment from running.
24
-
25
- To prevent these errors, jsPsych uses a 'safe mode' when it detects that the HTML page is running via the `file://` protocol, and if so, automatically disables the features that don't work in that context. Specifically, when a jsPsych experiment runs offline:
26
-
27
- * **Web Audio is disabled** (even if `use_webaudio` is set to `true` in `jsPsych.init`). The WebAudio API option is used by default because it allows more precise measurement of response times relative to the onset of the audio. But because WebAudio doesn't work offline, audio will be played using HTML5 audio instead. This is equivalent to setting `use_webaudio` to `false` in `jsPsych.init`.
28
- * **Video preloading is disabled** (both automatic and manual preloading via the `preload` plugin). Videos will still play when you run your experiment offline, but they will load _during_ the experiment, which might cause noticeable delays before video playback starts.
29
-
30
- This safe mode feature is controlled by the `override_safe_mode` parameter in [`jsPsych.init`](../core_library/jspsych-core.md#jspsychinit), which defaults to `false`. If you leave this setting as the default, then you won't need to worry about CORS errors while running your experiment offline, or remembering to change your `jsPsych.init` settings when you move the experiment online.
31
-
32
- It's possible to override jsPsych's safe mode by setting `override_safe_mode` to `true` in `jsPsych.init`. One reason you might do this is if you've disabled web security features in your browser (see [here](https://alfilatov.com/posts/run-chrome-without-cors/) and [here](https://stackoverflow.com/questions/4819060/allow-google-chrome-to-use-xmlhttprequest-to-load-a-url-from-a-local-file) for instructions in Chrome), which is safe to do if you know what you're doing. If your experiment does not use Web Audio or preloaded videos, then jsPsych's safe mode feature will not have any effect.
33
-
34
- The `override_safe_mode` parameter also has no effect when your experiment is running online a web server, because the page will be loaded via the `http://` or `https://` protocol.
35
-
36
- ### Media loading
37
-
38
- While running your experiment offline, any media files are likely to load very quickly because they are stored on your own computer's disk. Therefore you may not notice problems with file loading delays while running your experiment locally (either offline or on a _local_ server) because the files will load fast enough that they never cause disruption. However, when your experiment is hosted on a _remote_ server, the files will need to be transferred over the internet, which means they will take longer to load - in some cases much longer. Loading delays are most noticeable with media files: images, audio, and video. As explained on the [Media Preloading](media-preloading.md) page, loading delays during your experiment can cause problems for stimulus display and response times.
39
-
40
- It is important to test your experiment to ensure that any media files are preloading successfully and not being requested again during the experiment. You can use the Network tab in your browser's developer tools to see when files are loaded and to simulate a slow internet connection (see [here](https://developers.google.com/web/tools/chrome-devtools/network) for Chrome Network tab documentation). If you are preloading many and/or large files, such as videos, you may want to increase the `max_load_time` parameter in [`the preload plugin`](../plugins/jspsych-preload.md) so that participants with slow/unreliable internet connections will be able to take part in your experiment.
41
-
42
- ### Permanent data storage
43
-
44
- As explained in the [Data Storage, Aggregation, and Manipulation](data.md#data-in-jspsych-permanent-and-non-permanent-data) page, jsPsych stores information in the participant's browser. While running an experiment offline, you won't be able to send the data to a database. However you can still see the data that jsPsych collects by saving it as a local file (using [`jsPsych.data.get().localSave`](../core_library/jspsych-data.md#localsave)), displaying it in the webpage at the end of the experiment (using [`jsPsych.data.displayData`](../core_library/jspsych-data.md#jspsychdatadisplaydata)), or printing it to the browser's console (using [`console.log`](https://www.w3schools.com/jsref/met_console_log.asp)).
45
-
46
- Permanent data storage is also necessary when the code that runs the experiment depends on information that can't be known in advance, and that changes throughout data collection. Some common examples of this in cognitive behavioral research are **version counterbalancing**, where the experiment code needs to access and update the history of version assignment in order to determine which version should be assigned, and **multi-session/training studies**, where the experiment might need to access and update information about each participant like their current session number, task difficulty level, etc.
47
-
48
- Doing these things in an automated way requires the use of a server. While developing and testing your experiment offline, you might choose to simulate some of these things and then implement them properly once you move your experiment online. For instance, you could [randomize](../core_library/jspsych-randomization.md#jspsychrandomizationsamplewithoutreplacement) instead of counterbalancing version assignment:
49
-
50
- ```js
51
- var versions = [1,2];
52
- var random_version = jsPsych.randomization.sampleWithoutReplacement(versions,1)[0];
53
- ```
54
-
55
- And use [URL query parameters](../core_library/jspsych-data.md#jspsychdatageturlvariable) to pass in variables like session number and difficulty level:
56
-
57
- ```js
58
- // add the variables onto the end of the URL that appears in the browser when you open the file
59
- // e.g., file:///C:/my_experiment.html?id=1&sess=2&diff=3
60
- var participant_id = jsPsych.data.getURLVariable('id');
61
- var session = jsPsych.data.getURLVariable('sess');
62
- var difficulty = jsPsych.data.getURLVariable('diff');
63
- ```
64
-
65
-
66
-
67
-
68
-
69
- ## Online
70
-
71
- ### Hosting the Experiment and Saving the Data
72
-
73
- jsPsych is a front-end JavaScript library that runs entirely on the participant's computer. To run a jsPsych experiment over the internet, the files need to be hosted on a public web server so that participants can access the experiment using a web browser. When the participant completes the experiment in the browser, all of the data that jsPsych collects is stored on the participant's computer in the browser's memory. To get access to this data, it needs to be sent from the participant's browser back to the web server and stored in a database or a file.
74
-
75
- To be maximally flexible, jsPsych doesn't provide a single built-in solution for the web server component of your experiment. This makes jsPsych compatible with a wide range of hosting services and tools, allowing researchers to choose the web server option that best suit their needs.
76
-
77
- Some options for running your jsPsych experiment online include:
78
-
79
- * [Cognition.run](https://www.cognition.run/) - A free service designed specifically for hosting jsPsych experiments, with an easy-to-use interface.
80
- * [JATOS](https://www.jatos.org/Whats-JATOS.html) - A free program that runs on your own server and provides a GUI for setting up experiments and accessing the data. Offers lots of features for creating more complex experiments and managing multiple researchers.
81
- * [Pavlovia](https://pavlovia.org/) - A paid hosting service for web-based experiments, run by the PsychoPy team. Experiment files are managed on a GitLab repository. Participants will access the experiment through a link to Pavlovia.
82
- * [PsiTurk](https://psiturk.org/) - Python-based program to help you host your experiment on your own computer and collect data from MTurk (see Recruiting Participants below). Relatively easy for a DIY option.
83
- * [Pushkin](https://languagelearninglab.gitbook.io/pushkin/) - A set of tools to help you set up your own virtual laboratory for online experiments. This option differs from the others in that it helps you set up a complete website that may contain many different experiments, information about the laboratory, participant logins, and other features that are targeted at hosting large-scale data collection efforts.
84
- * Full DIY - You can setup your own web server and database and handle the communication yourself. Traditional web server 'stacks' include [LAMP](https://www.digitalocean.com/community/tutorial_collections/how-to-install-lamp)/[LEMP](https://www.digitalocean.com/community/tutorials/how-to-install-linux-nginx-mysql-php-lemp-stack-on-ubuntu-20-04) (Linux operating system, Apache or Nginx server application, MySQL database, and PHP programming language). Other common web server frameworks include [Flask](https://flask.palletsprojects.com/) (Python) and [Node.js](https://nodejs.org/) (JavaScript).
85
-
86
- ### Recruiting Participants
87
-
88
- Once your experiment is running online, you could recruit participants in the same way that you would for lab-based studies. For instance, if your institution uses SONA, you can advertise your web-based study link on SONA. SONA allows you to automactically embed a unique ID in online study URLs, which you can then save in your data using [jsPsych's URL query parameters function](../core_library/jspsych-data.md#jspsychdatageturlvariable). SONA will also generate a completion URL that you can redirect participants to at the end of the study, and this will mark them as having completed the study in SONA.
89
-
90
- To take full advantage of hosting an experiment online, many researchers advertise their experiments more widely. Social media and other media outlets provide one option for reaching a large number of potential participants. There are also some commercial platforms that you can use to advertise your study and pay anonymous online participants. These recruitment platforms charge a fee for use. The advantages of these platforms are that they handle the participant payments and allow you to specify pre-screening criteria. The most commonly used recruitment platforms in online behavioral research are:
91
-
92
- * [Prolific](https://www.prolific.co/): An online labor market designed specifically for web-based research.
93
- * [Amazon Mechanical Turk (MTurk)](https://www.mturk.com/): An online labor market designed for advertising paid 'human intelligence tasks'. This service was designed for use by commercial businesses but has been used by behavioral researchers for many years.
94
-
95
- Like SONA, Prolific and MTurk use URL query parameters to get participant information, and redirection to specific URLs to mark participants as having finished the study. jsPsych includes [convenience functions for interacting with MTurk participants](../core_library/jspsych-turk.md). Information about integrating with Prolific can be found in the researcher support section of their website.