jspsych 6.2.0 → 7.1.0

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 (360) hide show
  1. package/README.md +43 -29
  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 +3164 -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 +3158 -0
  10. package/dist/index.cjs.map +1 -0
  11. package/dist/index.d.ts +11 -0
  12. package/dist/index.js +3152 -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 +129 -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 +158 -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 -661
  59. package/docs/core_library/jspsych-data.md +0 -589
  60. package/docs/core_library/jspsych-pluginAPI.md +0 -510
  61. package/docs/core_library/jspsych-randomization.md +0 -397
  62. package/docs/core_library/jspsych-turk.md +0 -102
  63. package/docs/img/blue.png +0 -0
  64. package/docs/img/folder-setup.png +0 -0
  65. package/docs/img/folder-with-html.png +0 -0
  66. package/docs/img/githubreleases.jpg +0 -0
  67. package/docs/img/jspsych-favicon.png +0 -0
  68. package/docs/img/jspsych-logo-no-text-mono.svg +0 -493
  69. package/docs/img/jspsych-logo.jpg +0 -0
  70. package/docs/img/orange.png +0 -0
  71. package/docs/img/palmer_stim.png +0 -0
  72. package/docs/img/progress_bar.png +0 -0
  73. package/docs/img/visual_search_example.jpg +0 -0
  74. package/docs/index.md +0 -9
  75. package/docs/overview/browser-device-support.md +0 -35
  76. package/docs/overview/callbacks.md +0 -140
  77. package/docs/overview/data.md +0 -281
  78. package/docs/overview/exclude-browser.md +0 -32
  79. package/docs/overview/experiment-options.md +0 -121
  80. package/docs/overview/fullscreen.md +0 -36
  81. package/docs/overview/media-preloading.md +0 -91
  82. package/docs/overview/mturk.md +0 -77
  83. package/docs/overview/progress-bar.md +0 -110
  84. package/docs/overview/record-browser-interactions.md +0 -23
  85. package/docs/overview/running-experiments.md +0 -95
  86. package/docs/overview/timeline.md +0 -387
  87. package/docs/overview/trial.md +0 -142
  88. package/docs/plugins/creating-a-plugin.md +0 -79
  89. package/docs/plugins/jspsych-animation.md +0 -40
  90. package/docs/plugins/jspsych-audio-button-response.md +0 -60
  91. package/docs/plugins/jspsych-audio-keyboard-response.md +0 -58
  92. package/docs/plugins/jspsych-audio-slider-response.md +0 -53
  93. package/docs/plugins/jspsych-call-function.md +0 -81
  94. package/docs/plugins/jspsych-canvas-button-response.md +0 -66
  95. package/docs/plugins/jspsych-canvas-keyboard-response.md +0 -68
  96. package/docs/plugins/jspsych-canvas-slider-response.md +0 -89
  97. package/docs/plugins/jspsych-categorize-animation.md +0 -60
  98. package/docs/plugins/jspsych-categorize-html.md +0 -52
  99. package/docs/plugins/jspsych-categorize-image.md +0 -53
  100. package/docs/plugins/jspsych-cloze.md +0 -45
  101. package/docs/plugins/jspsych-external-html.md +0 -70
  102. package/docs/plugins/jspsych-free-sort.md +0 -55
  103. package/docs/plugins/jspsych-fullscreen.md +0 -57
  104. package/docs/plugins/jspsych-html-button-response.md +0 -42
  105. package/docs/plugins/jspsych-html-keyboard-response.md +0 -51
  106. package/docs/plugins/jspsych-html-slider-response.md +0 -45
  107. package/docs/plugins/jspsych-iat-html.md +0 -64
  108. package/docs/plugins/jspsych-iat-image.md +0 -64
  109. package/docs/plugins/jspsych-image-button-response.md +0 -46
  110. package/docs/plugins/jspsych-image-keyboard-response.md +0 -57
  111. package/docs/plugins/jspsych-image-slider-response.md +0 -52
  112. package/docs/plugins/jspsych-instructions.md +0 -58
  113. package/docs/plugins/jspsych-maxdiff.md +0 -42
  114. package/docs/plugins/jspsych-rdk.md +0 -119
  115. package/docs/plugins/jspsych-reconstruction.md +0 -48
  116. package/docs/plugins/jspsych-resize.md +0 -39
  117. package/docs/plugins/jspsych-same-different-html.md +0 -53
  118. package/docs/plugins/jspsych-same-different-image.md +0 -66
  119. package/docs/plugins/jspsych-serial-reaction-time-mouse.md +0 -50
  120. package/docs/plugins/jspsych-serial-reaction-time.md +0 -57
  121. package/docs/plugins/jspsych-survey-html-form.md +0 -50
  122. package/docs/plugins/jspsych-survey-likert.md +0 -70
  123. package/docs/plugins/jspsych-survey-multi-choice.md +0 -48
  124. package/docs/plugins/jspsych-survey-multi-select.md +0 -53
  125. package/docs/plugins/jspsych-survey-text.md +0 -63
  126. package/docs/plugins/jspsych-video-button-response.md +0 -52
  127. package/docs/plugins/jspsych-video-keyboard-response.md +0 -48
  128. package/docs/plugins/jspsych-video-slider-response.md +0 -58
  129. package/docs/plugins/jspsych-visual-search-circle.md +0 -52
  130. package/docs/plugins/jspsych-vsl-animate-occlusion.md +0 -55
  131. package/docs/plugins/jspsych-vsl-grid-scene.md +0 -62
  132. package/docs/plugins/overview.md +0 -111
  133. package/docs/tutorials/hello-world.md +0 -144
  134. package/docs/tutorials/rt-task.md +0 -1107
  135. package/examples/add-to-end-of-timeline.html +0 -32
  136. package/examples/conditional-and-loop-functions.html +0 -63
  137. package/examples/css/jquery-ui.css +0 -1225
  138. package/examples/data-add-properties.html +0 -40
  139. package/examples/data-as-function.html +0 -36
  140. package/examples/data-from-timeline.html +0 -45
  141. package/examples/data-from-url.html +0 -21
  142. package/examples/demo-flanker.html +0 -108
  143. package/examples/demo-simple-rt-task.html +0 -104
  144. package/examples/demos/demo_1.html +0 -29
  145. package/examples/demos/demo_2.html +0 -43
  146. package/examples/demos/demo_3.html +0 -58
  147. package/examples/display-element-to-embed-experiment.html +0 -73
  148. package/examples/end-active-node.html +0 -52
  149. package/examples/end-experiment.html +0 -43
  150. package/examples/exclusions.html +0 -32
  151. package/examples/external_html/simple_consent.html +0 -4
  152. package/examples/img/1.gif +0 -0
  153. package/examples/img/10.gif +0 -0
  154. package/examples/img/11.gif +0 -0
  155. package/examples/img/12.gif +0 -0
  156. package/examples/img/2.gif +0 -0
  157. package/examples/img/3.gif +0 -0
  158. package/examples/img/4.gif +0 -0
  159. package/examples/img/5.gif +0 -0
  160. package/examples/img/6.gif +0 -0
  161. package/examples/img/7.gif +0 -0
  162. package/examples/img/8.gif +0 -0
  163. package/examples/img/9.gif +0 -0
  164. package/examples/img/age/of1.jpg +0 -0
  165. package/examples/img/age/of2.jpg +0 -0
  166. package/examples/img/age/of3.jpg +0 -0
  167. package/examples/img/age/om1.jpg +0 -0
  168. package/examples/img/age/om2.jpg +0 -0
  169. package/examples/img/age/om3.jpg +0 -0
  170. package/examples/img/age/yf1.jpg +0 -0
  171. package/examples/img/age/yf4.jpg +0 -0
  172. package/examples/img/age/yf5.jpg +0 -0
  173. package/examples/img/age/ym2.jpg +0 -0
  174. package/examples/img/age/ym3.jpg +0 -0
  175. package/examples/img/age/ym5.jpg +0 -0
  176. package/examples/img/backwardN.gif +0 -0
  177. package/examples/img/blue.png +0 -0
  178. package/examples/img/con1.png +0 -0
  179. package/examples/img/con2.png +0 -0
  180. package/examples/img/fixation.gif +0 -0
  181. package/examples/img/happy_face_1.jpg +0 -0
  182. package/examples/img/happy_face_2.jpg +0 -0
  183. package/examples/img/happy_face_3.jpg +0 -0
  184. package/examples/img/happy_face_4.jpg +0 -0
  185. package/examples/img/inc1.png +0 -0
  186. package/examples/img/inc2.png +0 -0
  187. package/examples/img/normalN.gif +0 -0
  188. package/examples/img/orange.png +0 -0
  189. package/examples/img/redX.png +0 -0
  190. package/examples/img/ribbon.jpg +0 -0
  191. package/examples/img/sad_face_1.jpg +0 -0
  192. package/examples/img/sad_face_2.jpg +0 -0
  193. package/examples/img/sad_face_3.jpg +0 -0
  194. package/examples/img/sad_face_4.jpg +0 -0
  195. package/examples/js/snap.svg-min.js +0 -21
  196. package/examples/jspsych-RDK.html +0 -58
  197. package/examples/jspsych-animation.html +0 -33
  198. package/examples/jspsych-audio-button-response.html +0 -52
  199. package/examples/jspsych-audio-keyboard-response.html +0 -62
  200. package/examples/jspsych-audio-slider-response.html +0 -55
  201. package/examples/jspsych-call-function.html +0 -32
  202. package/examples/jspsych-canvas-button-response.html +0 -95
  203. package/examples/jspsych-canvas-keyboard-response.html +0 -78
  204. package/examples/jspsych-canvas-slider-response.html +0 -67
  205. package/examples/jspsych-categorize-animation.html +0 -46
  206. package/examples/jspsych-categorize-html.html +0 -38
  207. package/examples/jspsych-categorize-image.html +0 -38
  208. package/examples/jspsych-cloze.html +0 -42
  209. package/examples/jspsych-free-sort.html +0 -97
  210. package/examples/jspsych-fullscreen.html +0 -44
  211. package/examples/jspsych-html-button-response.html +0 -46
  212. package/examples/jspsych-html-keyboard-response.html +0 -42
  213. package/examples/jspsych-html-slider-response.html +0 -53
  214. package/examples/jspsych-iat.html +0 -510
  215. package/examples/jspsych-image-button-response.html +0 -84
  216. package/examples/jspsych-image-keyboard-response.html +0 -78
  217. package/examples/jspsych-image-slider-response.html +0 -76
  218. package/examples/jspsych-instructions.html +0 -37
  219. package/examples/jspsych-maxdiff.html +0 -33
  220. package/examples/jspsych-reconstruction.html +0 -43
  221. package/examples/jspsych-resize.html +0 -34
  222. package/examples/jspsych-same-different-html.html +0 -28
  223. package/examples/jspsych-same-different-image.html +0 -33
  224. package/examples/jspsych-serial-reaction-time-mouse.html +0 -98
  225. package/examples/jspsych-serial-reaction-time.html +0 -54
  226. package/examples/jspsych-survey-html-form.html +0 -33
  227. package/examples/jspsych-survey-likert.html +0 -42
  228. package/examples/jspsych-survey-multi-choice.html +0 -40
  229. package/examples/jspsych-survey-multi-select.html +0 -42
  230. package/examples/jspsych-survey-text.html +0 -34
  231. package/examples/jspsych-video-button-response.html +0 -57
  232. package/examples/jspsych-video-keyboard-response.html +0 -53
  233. package/examples/jspsych-video-slider-response.html +0 -55
  234. package/examples/jspsych-visual-search-circle.html +0 -58
  235. package/examples/jspsych-vsl-animate-occlusion.html +0 -29
  236. package/examples/jspsych-vsl-grid-scene.html +0 -41
  237. package/examples/lexical-decision.html +0 -132
  238. package/examples/manual-preloading.html +0 -53
  239. package/examples/pause-unpause.html +0 -33
  240. package/examples/progress-bar.html +0 -62
  241. package/examples/sound/hammer.mp3 +0 -0
  242. package/examples/sound/sound.mp3 +0 -0
  243. package/examples/sound/speech_blue.mp3 +0 -0
  244. package/examples/sound/speech_green.mp3 +0 -0
  245. package/examples/sound/speech_joke.mp3 +0 -0
  246. package/examples/sound/speech_red.mp3 +0 -0
  247. package/examples/sound/tone.mp3 +0 -0
  248. package/examples/timeline-variables-sampling.html +0 -50
  249. package/examples/timeline-variables.html +0 -55
  250. package/examples/video/sample_video.mp4 +0 -0
  251. package/jspsych.js +0 -2796
  252. package/license.txt +0 -21
  253. package/mkdocs.yml +0 -104
  254. package/plugins/jspsych-animation.js +0 -189
  255. package/plugins/jspsych-audio-button-response.js +0 -247
  256. package/plugins/jspsych-audio-keyboard-response.js +0 -204
  257. package/plugins/jspsych-audio-slider-response.js +0 -262
  258. package/plugins/jspsych-call-function.js +0 -58
  259. package/plugins/jspsych-canvas-button-response.js +0 -199
  260. package/plugins/jspsych-canvas-keyboard-response.js +0 -155
  261. package/plugins/jspsych-canvas-slider-response.js +0 -207
  262. package/plugins/jspsych-categorize-animation.js +0 -266
  263. package/plugins/jspsych-categorize-html.js +0 -220
  264. package/plugins/jspsych-categorize-image.js +0 -222
  265. package/plugins/jspsych-cloze.js +0 -112
  266. package/plugins/jspsych-external-html.js +0 -112
  267. package/plugins/jspsych-free-sort.js +0 -444
  268. package/plugins/jspsych-fullscreen.js +0 -104
  269. package/plugins/jspsych-html-button-response.js +0 -188
  270. package/plugins/jspsych-html-keyboard-response.js +0 -149
  271. package/plugins/jspsych-html-slider-response.js +0 -202
  272. package/plugins/jspsych-iat-html.js +0 -284
  273. package/plugins/jspsych-iat-image.js +0 -286
  274. package/plugins/jspsych-image-button-response.js +0 -311
  275. package/plugins/jspsych-image-keyboard-response.js +0 -247
  276. package/plugins/jspsych-image-slider-response.js +0 -353
  277. package/plugins/jspsych-instructions.js +0 -237
  278. package/plugins/jspsych-maxdiff.js +0 -174
  279. package/plugins/jspsych-rdk.js +0 -1373
  280. package/plugins/jspsych-reconstruction.js +0 -134
  281. package/plugins/jspsych-resize.js +0 -166
  282. package/plugins/jspsych-same-different-html.js +0 -168
  283. package/plugins/jspsych-same-different-image.js +0 -169
  284. package/plugins/jspsych-serial-reaction-time-mouse.js +0 -213
  285. package/plugins/jspsych-serial-reaction-time.js +0 -247
  286. package/plugins/jspsych-survey-html-form.js +0 -171
  287. package/plugins/jspsych-survey-likert.js +0 -195
  288. package/plugins/jspsych-survey-multi-choice.js +0 -208
  289. package/plugins/jspsych-survey-multi-select.js +0 -232
  290. package/plugins/jspsych-survey-text.js +0 -185
  291. package/plugins/jspsych-video-button-response.js +0 -320
  292. package/plugins/jspsych-video-keyboard-response.js +0 -279
  293. package/plugins/jspsych-video-slider-response.js +0 -351
  294. package/plugins/jspsych-visual-search-circle.js +0 -259
  295. package/plugins/jspsych-vsl-animate-occlusion.js +0 -196
  296. package/plugins/jspsych-vsl-grid-scene.js +0 -103
  297. package/plugins/template/jspsych-plugin-template.js +0 -35
  298. package/tests/README.md +0 -7
  299. package/tests/jsPsych/default-iti.test.js +0 -51
  300. package/tests/jsPsych/default-parameters.test.js +0 -58
  301. package/tests/jsPsych/endexperiment.test.js +0 -49
  302. package/tests/jsPsych/events.test.js +0 -369
  303. package/tests/jsPsych/init.test.js +0 -48
  304. package/tests/jsPsych/loads.test.js +0 -7
  305. package/tests/jsPsych/min-rt.test.js +0 -58
  306. package/tests/jsPsych/progressbar.test.js +0 -202
  307. package/tests/jsPsych/timeline-variables.test.js +0 -254
  308. package/tests/jsPsych/timelines.test.js +0 -498
  309. package/tests/jsPsych.data/datacollection.test.js +0 -116
  310. package/tests/jsPsych.data/datacolumn.test.js +0 -50
  311. package/tests/jsPsych.data/datamodule.test.js +0 -152
  312. package/tests/jsPsych.data/dataparameter.test.js +0 -251
  313. package/tests/jsPsych.data/interactions.test.js +0 -109
  314. package/tests/jsPsych.pluginAPI/pluginapi.test.js +0 -144
  315. package/tests/jsPsych.randomization/randomziation.test.js +0 -27
  316. package/tests/jsPsych.utils/utils.test.js +0 -58
  317. package/tests/media/blue.png +0 -0
  318. package/tests/media/orange.png +0 -0
  319. package/tests/media/sample_video.mp4 +0 -0
  320. package/tests/media/sound.mp3 +0 -0
  321. package/tests/plugins/plugin-animation.test.js +0 -35
  322. package/tests/plugins/plugin-audio-button-response.test.js +0 -15
  323. package/tests/plugins/plugin-audio-keyboard-response.test.js +0 -15
  324. package/tests/plugins/plugin-audio-slider-response.test.js +0 -15
  325. package/tests/plugins/plugin-call-function.test.js +0 -49
  326. package/tests/plugins/plugin-categorize-animation.test.js +0 -274
  327. package/tests/plugins/plugin-categorize-html.test.js +0 -17
  328. package/tests/plugins/plugin-categorize-image.test.js +0 -17
  329. package/tests/plugins/plugin-cloze.test.js +0 -140
  330. package/tests/plugins/plugin-free-sort.test.js +0 -112
  331. package/tests/plugins/plugin-fullscreen.test.js +0 -41
  332. package/tests/plugins/plugin-html-button-response.test.js +0 -161
  333. package/tests/plugins/plugin-html-keyboard-response.test.js +0 -139
  334. package/tests/plugins/plugin-html-slider-response.test.js +0 -155
  335. package/tests/plugins/plugin-iat-html.test.js +0 -328
  336. package/tests/plugins/plugin-iat-image.test.js +0 -308
  337. package/tests/plugins/plugin-image-button-response.test.js +0 -183
  338. package/tests/plugins/plugin-image-keyboard-response.test.js +0 -154
  339. package/tests/plugins/plugin-image-slider-response.test.js +0 -183
  340. package/tests/plugins/plugin-instructions.test.js +0 -66
  341. package/tests/plugins/plugin-maxdiff.test.js +0 -39
  342. package/tests/plugins/plugin-rdk.test.js +0 -17
  343. package/tests/plugins/plugin-reconstruction.test.js +0 -16
  344. package/tests/plugins/plugin-resize.test.js +0 -16
  345. package/tests/plugins/plugin-same-different-html.test.js +0 -17
  346. package/tests/plugins/plugin-same-different-image.test.js +0 -17
  347. package/tests/plugins/plugin-serial-reaction-time-mouse.test.js +0 -42
  348. package/tests/plugins/plugin-serial-reaction-time.test.js +0 -69
  349. package/tests/plugins/plugin-survey-html-form.test.js +0 -44
  350. package/tests/plugins/plugin-survey-likert.test.js +0 -48
  351. package/tests/plugins/plugin-survey-multi-choice.test.js +0 -48
  352. package/tests/plugins/plugin-survey-multi-select.test.js +0 -72
  353. package/tests/plugins/plugin-survey-text.test.js +0 -115
  354. package/tests/plugins/plugin-video-button-response.test.js +0 -35
  355. package/tests/plugins/plugin-video-keyboard-response.test.js +0 -35
  356. package/tests/plugins/plugin-video-slider-response.test.js +0 -34
  357. package/tests/plugins/plugin-visual-search-circle.test.js +0 -16
  358. package/tests/plugins/plugin-vsl-animate-occlusion.test.js +0 -16
  359. package/tests/plugins/plugin-vsl-grid-scene.test.js +0 -16
  360. package/tests/testing-utils.js +0 -13
@@ -1,40 +0,0 @@
1
- <!DOCTYPE html>
2
- <html>
3
-
4
- <head>
5
- <script src="../jspsych.js"></script>
6
- <script src="../plugins/jspsych-image-keyboard-response.js"></script>
7
- <link rel="stylesheet" href="../css/jspsych.css">
8
- <style>
9
- img {
10
- width: 300px;
11
- }
12
- </style>
13
- </head>
14
- <body></body>
15
- <script>
16
- var block_1 = {
17
- type: 'image-keyboard-response',
18
- stimulus: 'img/happy_face_1.jpg',
19
- choices: [89, 78], // Y or N
20
- prompt: '<p>The data displayed on the next page should have a subject and completed property. Press Y or N.</p>'
21
- }
22
-
23
- jsPsych.data.addProperties({
24
- subject: 1
25
- });
26
-
27
-
28
- jsPsych.init({
29
- timeline: [block_1],
30
- on_finish: function() {
31
- jsPsych.data.addProperties({
32
- completed: true
33
- });
34
- // data should have a subject and completed field for each trial.
35
- jsPsych.data.displayData();
36
- }
37
- });
38
- </script>
39
-
40
- </html>
@@ -1,36 +0,0 @@
1
- <!DOCTYPE html>
2
- <html>
3
-
4
- <head>
5
- <script src="../jspsych.js"></script>
6
- <script src="../plugins/jspsych-image-keyboard-response.js"></script>
7
- <link rel="stylesheet" href="../css/jspsych.css">
8
- <style>
9
- img {
10
- width: 300px;
11
- }
12
- </style>
13
- </head>
14
- <body></body>
15
- <script>
16
- var block_1 = {
17
- type: 'image-keyboard-response',
18
- stimulus: 'img/happy_face_1.jpg',
19
- choices: [89, 78], // Y or N
20
- prompt: '<p>Data should have a random int 0-19 on next page. Y or N.</p>',
21
- data: function() {
22
- return {
23
- random_number: Math.floor(Math.random() * 20)
24
- }
25
- }
26
- }
27
-
28
- jsPsych.init({
29
- timeline: [block_1],
30
- on_finish: function() {
31
- jsPsych.data.displayData();
32
- }
33
- });
34
- </script>
35
-
36
- </html>
@@ -1,45 +0,0 @@
1
- <!DOCTYPE html>
2
- <html>
3
- <head>
4
- <script src="../jspsych.js"></script>
5
- <script src="../plugins/jspsych-image-keyboard-response.js"></script>
6
- <link rel="stylesheet" href="../css/jspsych.css">
7
- </head>
8
- <body></body>
9
- <script>
10
- var trial_1 = {
11
- stimulus: 'img/happy_face_4.jpg',
12
- }
13
-
14
- var trial_2 = {
15
- stimulus: 'img/sad_face_4.jpg',
16
- }
17
-
18
- var trial_3 = {
19
- stimulus: 'img/sad_face_3.jpg',
20
- }
21
-
22
- var node = {
23
- type: 'image-keyboard-response',
24
- timeline: [trial_1, trial_2, trial_3],
25
- choices: [89, 78], // Y or N
26
- prompt: '<p>Have you seen this face before? Y or N.</p>',
27
- stimulus_width: 300,
28
- data: {
29
- node_data: true
30
- },
31
- on_finish: function(){
32
- console.log(jsPsych.data.getLastTimelineData().json());
33
- }
34
- }
35
-
36
- jsPsych.init({
37
- timeline: [node],
38
- on_finish: function() {
39
- jsPsych.data.displayData();
40
- },
41
- default_iti: 250
42
- });
43
- </script>
44
-
45
- </html>
@@ -1,21 +0,0 @@
1
- <!DOCTYPE html>
2
- <html>
3
- <head>
4
- <script src="../jspsych.js"></script>
5
- <link rel="stylesheet" href="../css/jspsych.css">
6
- </head>
7
- <body>
8
- <p>The URL variable should be logged to the console</p>
9
- </body>
10
- <script>
11
-
12
- if(typeof jsPsych.data.getURLVariable('v1') == 'undefined'){
13
- window.location = window.location + '?v1=abc&v2=def';
14
- }
15
-
16
- console.log(JSON.stringify(jsPsych.data.urlVariables()));
17
-
18
- console.log(jsPsych.data.getURLVariable('v1'));
19
-
20
- </script>
21
- </html>
@@ -1,108 +0,0 @@
1
- <!DOCTYPE html>
2
- <html>
3
- <head>
4
- <title>Flanker Task</title>
5
- <script src="../jspsych.js"></script>
6
- <script src="../plugins/jspsych-html-keyboard-response.js"></script>
7
- <script src="../plugins/jspsych-image-keyboard-response.js"></script>
8
- <link rel="stylesheet" href="../css/jspsych.css">
9
- </head>
10
- <body>
11
- </body>
12
- <script>
13
- /* experiment parameters */
14
- var reps_per_trial_type = 4;
15
-
16
- /*set up welcome block*/
17
- var welcome = {
18
- type: "html-keyboard-response",
19
- stimulus: "Welcome to the experiment. Press any key to begin."
20
- };
21
-
22
- /*set up instructions block*/
23
- var instructions = {
24
- type: "html-keyboard-response",
25
- stimulus: "<p>In this task, you will see five arrows on the screen, like the example below.</p>"+
26
- "<img src='img/inc1.png'></img>"+
27
- "<p>Press the left arrow key if the middle arrow is pointing left. (<)</p>"+
28
- "<p>Press the right arrow key if the middle arrow is pointing right. (>)</p>"+
29
- "<p>Press any key to begin.</p>",
30
- post_trial_gap: 1000
31
- };
32
-
33
- /*defining stimuli*/
34
- var test_stimuli = [
35
- {
36
- stimulus: "img/con1.png",
37
- data: { stim_type: 'congruent', direction: 'left'}
38
- },
39
- {
40
- stimulus: "img/con2.png",
41
- data: { stim_type: 'congruent', direction: 'right'}
42
- },
43
- {
44
- stimulus: "img/inc1.png",
45
- data: { stim_type: 'incongruent', direction: 'right'}
46
- },
47
- {
48
- stimulus: "img/inc2.png",
49
- data: { stim_type: 'incongruent', direction: 'left'}
50
- }
51
- ];
52
-
53
- /* defining test timeline */
54
- var test = {
55
- timeline: [{
56
- type: 'image-keyboard-response',
57
- choices: [37, 39],
58
- trial_duration: 1500,
59
- stimulus: jsPsych.timelineVariable('stimulus'),
60
- data: jsPsych.timelineVariable('data'),
61
- on_finish: function(data){
62
- var correct = false;
63
- if(data.direction == 'left' && data.key_press == 37 && data.rt > -1){
64
- correct = true;
65
- } else if(data.direction == 'right' && data.key_press == 39 && data.rt > -1){
66
- correct = true;
67
- }
68
- data.correct = correct;
69
- },
70
- post_trial_gap: function() {
71
- return Math.floor(Math.random() * 1500) + 500;
72
- }
73
- }],
74
- timeline_variables: test_stimuli,
75
- sample: {type: 'fixed-repetitions', size: reps_per_trial_type}
76
- };
77
-
78
- /*defining debriefing block*/
79
- var debrief = {
80
- type: "html-keyboard-response",
81
- stimulus: function() {
82
- var total_trials = jsPsych.data.get().filter({trial_type: 'image-keyboard-response'}).count();
83
- var accuracy = Math.round(jsPsych.data.get().filter({correct: true}).count() / total_trials * 100);
84
- var congruent_rt = Math.round(jsPsych.data.get().filter({correct: true, stim_type: 'congruent'}).select('rt').mean());
85
- var incongruent_rt = Math.round(jsPsych.data.get().filter({correct: true, stim_type: 'incongruent'}).select('rt').mean());
86
- return "<p>You responded correctly on <strong>"+accuracy+"%</strong> of the trials.</p> " +
87
- "<p>Your average response time for congruent trials was <strong>" + congruent_rt + "ms</strong>.</p>"+
88
- "<p>Your average response time for incongruent trials was <strong>" + incongruent_rt + "ms</strong>.</p>"+
89
- "<p>Press any key to complete the experiment. Thank you!</p>";
90
- }
91
- };
92
-
93
- /*set up experiment structure*/
94
- var timeline = [];
95
- timeline.push(welcome);
96
- timeline.push(instructions);
97
- timeline.push(test);
98
- timeline.push(debrief);
99
-
100
- /*start experiment*/
101
- jsPsych.init({
102
- timeline: timeline,
103
- on_finish: function() {
104
- jsPsych.data.displayData();
105
- }
106
- });
107
- </script>
108
- </html>
@@ -1,104 +0,0 @@
1
- <!DOCTYPE html>
2
- <html>
3
- <head>
4
- <title>My experiment</title>
5
- <script src="../jspsych.js"></script>
6
- <script src="../plugins/jspsych-html-keyboard-response.js"></script>
7
- <script src="../plugins/jspsych-image-keyboard-response.js"></script>
8
- <link rel="stylesheet" href="../css/jspsych.css">
9
- </head>
10
- <body></body>
11
- <script>
12
-
13
- /* create timeline */
14
- var timeline = [];
15
-
16
- /* define welcome message trial */
17
- var welcome_block = {
18
- type: "html-keyboard-response",
19
- stimulus: "Welcome to the experiment. Press any key to begin."
20
- };
21
- timeline.push(welcome_block);
22
-
23
- /* define instructions trial */
24
- var instructions = {
25
- type: "html-keyboard-response",
26
- stimulus: "<p>In this experiment, a circle will appear in the center " +
27
- "of the screen.</p><p>If the circle is <strong>blue</strong>, " +
28
- "press the letter F on the keyboard as fast as you can.</p>" +
29
- "<p>If the circle is <strong>orange</strong>, press the letter J " +
30
- "as fast as you can.</p>" +
31
- "<div style='width: 700px;'>"+
32
- "<div style='float: left;'><img src='img/blue.png'></img>" +
33
- "<p class='small'><strong>Press the F key</strong></p></div>" +
34
- "<div class='float: right;'><img src='img/orange.png'></img>" +
35
- "<p class='small'><strong>Press the J key</strong></p></div>" +
36
- "</div>"+
37
- "<p>Press any key to begin.</p>",
38
- post_trial_gap: 2000
39
- };
40
- timeline.push(instructions);
41
-
42
- /* test trials */
43
-
44
- var test_stimuli = [
45
- { stimulus: "img/blue.png", data: { test_part: 'test', correct_response: 'f' } },
46
- { stimulus: "img/orange.png", data: { test_part: 'test', correct_response: 'j' } }
47
- ];
48
-
49
- var fixation = {
50
- type: 'html-keyboard-response',
51
- stimulus: '<div style="font-size:60px;">+</div>',
52
- choices: jsPsych.NO_KEYS,
53
- trial_duration: function(){
54
- return jsPsych.randomization.sampleWithoutReplacement([250, 500, 750, 1000, 1250, 1500, 1750, 2000], 1)[0];
55
- },
56
- data: {test_part: 'fixation'}
57
- }
58
-
59
- var test = {
60
- type: "image-keyboard-response",
61
- stimulus: jsPsych.timelineVariable('stimulus'),
62
- choices: ['f', 'j'],
63
- data: jsPsych.timelineVariable('data'),
64
- on_finish: function(data){
65
- data.correct = data.key_press == jsPsych.pluginAPI.convertKeyCharacterToKeyCode(data.correct_response);
66
- },
67
- }
68
-
69
- var test_procedure = {
70
- timeline: [fixation, test],
71
- timeline_variables: test_stimuli,
72
- repetitions: 5,
73
- randomize_order: true
74
- }
75
- timeline.push(test_procedure);
76
-
77
- /* define debrief */
78
-
79
- var debrief_block = {
80
- type: "html-keyboard-response",
81
- stimulus: function() {
82
-
83
- var trials = jsPsych.data.get().filter({test_part: 'test'});
84
- var correct_trials = trials.filter({correct: true});
85
- var accuracy = Math.round(correct_trials.count() / trials.count() * 100);
86
- var rt = Math.round(correct_trials.select('rt').mean());
87
-
88
- return "<p>You responded correctly on "+accuracy+"% of the trials.</p>"+
89
- "<p>Your average response time was "+rt+"ms.</p>"+
90
- "<p>Press any key to complete the experiment. Thank you!</p>";
91
-
92
- }
93
- };
94
- timeline.push(debrief_block);
95
-
96
- /* start the experiment */
97
- jsPsych.init({
98
- timeline: timeline,
99
- on_finish: function() {
100
- jsPsych.data.displayData();
101
- }
102
- });
103
- </script>
104
- </html>
@@ -1,29 +0,0 @@
1
- <!DOCTYPE html>
2
- <html>
3
- <head>
4
- <script src="../../jspsych.js"></script>
5
- <script src="../../plugins/jspsych-instructions.js"></script>
6
- <link rel="stylesheet" href="../../css/jspsych.css">
7
- </head>
8
- <body>
9
- </body>
10
- <script>
11
- var trial = {
12
- type: 'instructions',
13
- pages: [
14
- 'Welcome to the experiment. Click next to begin.',
15
- '<div>In this experiment, you will view a ' +
16
- 'series of images and answer questions.<br>' +
17
- 'Answer with the keys "y" or "n".',
18
- 'Here is an example:<br><br> ' +
19
- '<img src="../img/age/of2.jpg"></img><br><br>' +
20
- 'Is this person OLD or YOUNG?'
21
- ],
22
- show_clickable_nav: true
23
- }
24
-
25
- jsPsych.init({
26
- timeline: [trial],
27
- });
28
- </script>
29
- </html>
@@ -1,43 +0,0 @@
1
- <!DOCTYPE html>
2
- <html>
3
- <head>
4
- <script src="../../jspsych.js"></script>
5
- <script src="../../plugins/jspsych-image-keyboard-response.js"></script>
6
- <link rel="stylesheet" href="../../css/jspsych.css">
7
- <style>
8
- img {
9
- width: 300px;
10
- }
11
- </style>
12
- </head>
13
- <body>
14
- </body>
15
- <script>
16
- var trial_1 = {
17
- type: "image-keyboard-response",
18
- stimulus: '../img/happy_face_1.jpg',
19
- choices: [89, 78],
20
- prompt: '<p>Is this face happy? Y or N.</p>'
21
- }
22
-
23
- var trial_2 = {
24
- type: 'image-keyboard-response',
25
- stimulus: '../img/sad_face_2.jpg',
26
- choices: [89, 78], // Y or N
27
- prompt: '<p>Is this face happy? Y or N.</p>'
28
- }
29
-
30
- var trial_3 = {
31
- type: 'image-keyboard-response',
32
- stimulus: '../img/happy_face_2.jpg',
33
- choices: [89, 78], // Y or N
34
- prompt: '<p>Is this face happy? Y or N.</p>',
35
- }
36
-
37
-
38
- jsPsych.init({
39
- timeline: [trial_1, trial_2, trial_3],
40
- default_iti: 250
41
- });
42
- </script>
43
- </html>
@@ -1,58 +0,0 @@
1
- <!DOCTYPE html>
2
- <html>
3
- <head>
4
- <script src="../../jspsych.js"></script>
5
- <script src="../../plugins/jspsych-html-keyboard-response.js"></script>
6
- <link rel="stylesheet" href="../../css/jspsych.css">
7
- <style>
8
- #jspsych-html-keyboard-response-stimulus {
9
- font-size: 500%;
10
- }
11
- </style>
12
- </head>
13
- <body>
14
- </body>
15
- <script>
16
- var test_stimuli = [
17
- { stimulus: "<<<<<", data: { stim_type: 'congruent'} },
18
- { stimulus: ">>>>>", data: { stim_type: 'congruent'} },
19
- { stimulus: "<<><<", data: { stim_type: 'incongruent'} },
20
- { stimulus: ">><>>", data: { stim_type: 'incongruent'} }
21
- ];
22
-
23
- var test = {
24
- timeline: [{
25
- type: 'html-keyboard-response',
26
- choices: [37, 39],
27
- stimulus: jsPsych.timelineVariable('stimulus'),
28
- data: jsPsych.timelineVariable('data'),
29
- post_trial_gap: 1500,
30
- response_ends_trial: true
31
- }],
32
- timeline_variables: test_stimuli,
33
- sample: {type: 'fixed-repetitions', size: 2}
34
- };
35
-
36
- var debrief = {
37
- type: "html-keyboard-response",
38
- stimulus: function() {
39
- var congruent_rt = Math.round(jsPsych.data.get()
40
- .filter({stim_type: 'congruent'}).select('rt').mean());
41
- var incongruent_rt = Math.round(jsPsych.data.get().filter({stim_type: 'incongruent'}).select('rt').mean());
42
- return "<p style='font-size:25px'>Your average response time for congruent trials was <strong>" + congruent_rt + "ms</strong>.</p>"+
43
- "<p style='font-size:25px'>Your average response time for incongruent trials was <strong>" + incongruent_rt + "ms</strong>.</p>";
44
- }
45
- };
46
-
47
- var timeline = [];
48
- timeline.push(test);
49
- timeline.push(debrief);
50
-
51
- jsPsych.init({
52
- timeline: timeline,
53
- on_finish: function() {
54
- jsPsych.data.displayData();
55
- }
56
- });
57
- </script>
58
- </html>
@@ -1,73 +0,0 @@
1
- <!DOCTYPE html>
2
- <html>
3
-
4
- <head>
5
-
6
- <script src="../jspsych.js"></script>
7
- <script src="../plugins/jspsych-image-keyboard-response.js"></script>
8
- <script src="../plugins/jspsych-html-keyboard-response.js"></script>
9
- <link rel="stylesheet" href="../css/jspsych.css">
10
- <style>
11
- p { line-height: 1.5em; font-size: 18px; }
12
- #jspsych-experiment { width: 600px; height: 400px; float: right; overflow: hidden; margin: 25px; border: 1px solid #999;}
13
- </style>
14
- </head>
15
-
16
- <body>
17
- <div id="jspsych-experiment"></div>
18
- <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer nec odio. Praesent libero. Sed cursus ante dapibus diam. Sed nisi. Nulla quis sem at nibh elementum imperdiet. Duis sagittis ipsum. Praesent mauris. Fusce nec tellus sed augue semper porta. Mauris massa. Vestibulum lacinia arcu eget nulla. </p>
19
-
20
- <p>Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Curabitur sodales ligula in libero. Sed dignissim lacinia nunc. Curabitur tortor. Pellentesque nibh. Aenean quam. In scelerisque sem at dolor. Maecenas mattis. Sed convallis tristique sem. Proin ut ligula vel nunc egestas porttitor. Morbi lectus risus, iaculis vel, suscipit quis, luctus non, massa. </p>
21
-
22
- <p>Fusce ac turpis quis ligula lacinia aliquet. Mauris ipsum. Nulla metus metus, ullamcorper vel, tincidunt sed, euismod in, nibh. Quisque volutpat condimentum velit. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Nam nec ante. Sed lacinia, urna non tincidunt mattis, tortor neque adipiscing diam, a cursus ipsum ante quis turpis. Nulla facilisi. Ut fringilla. Suspendisse potenti. Nunc feugiat mi a tellus consequat imperdiet. Vestibulum sapien. Proin quam. Etiam ultrices. </p>
23
-
24
- <p>Suspendisse in justo eu magna luctus suscipit. Sed lectus. Integer euismod lacus luctus magna. Quisque cursus, metus vitae pharetra auctor, sem massa mattis sem, at interdum magna augue eget diam. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Morbi lacinia molestie dui. Praesent blandit dolor. Sed non quam. In vel mi sit amet augue congue elementum. Morbi in ipsum sit amet pede facilisis laoreet. Donec lacus nunc, viverra nec, blandit vel, egestas et, augue. Vestibulum tincidunt malesuada tellus. </p>
25
-
26
- <p>Ut ultrices ultrices enim. Curabitur sit amet mauris. Morbi in dui quis est pulvinar ullamcorper. Nulla facilisi. Integer lacinia sollicitudin massa. Cras metus. Sed aliquet risus a tortor. Integer id quam. Morbi mi. Quisque nisl felis, venenatis tristique, dignissim in, ultrices sit amet, augue. Proin sodales libero eget ante. Nulla quam. </p>
27
- </body>
28
-
29
-
30
- <script>
31
- var trial_1 = {
32
- type: 'image-keyboard-response',
33
- stimulus: 'img/happy_face_1.jpg',
34
- choices: [89, 78], // Y or N
35
- prompt: '<p>Have you seen this face before? Y or N.</p>',
36
- stimulus_width: 300
37
- }
38
-
39
- var trial_2 = {
40
- type: 'image-keyboard-response',
41
- stimulus: 'img/happy_face_2.jpg',
42
- choices: [89, 78], // Y or N
43
- trial_duration: 5000,
44
- prompt: '<p>Have you seen this face before? Y or N. (5s time limit).</p>',
45
- stimulus_width: 300
46
- }
47
-
48
- var trial_3 = {
49
- type: 'html-keyboard-response',
50
- choices: jsPsych.NO_KEYS, // Y or N
51
- trial_duration: 5000,
52
- prompt: '<p>No response allowed. 5s wait.</p>',
53
- stimulus: '<p>:)</p>',
54
- is_html: true
55
- }
56
-
57
- var node = {
58
- type: 'html-keyboard-response',
59
- timeline: [trial_1, trial_2, trial_3],
60
- }
61
-
62
-
63
- jsPsych.init({
64
- timeline: [node],
65
- display_element: 'jspsych-experiment',
66
- on_finish: function() {
67
- jsPsych.data.displayData();
68
- },
69
- default_iti: 250
70
- });
71
- </script>
72
-
73
- </html>
@@ -1,52 +0,0 @@
1
- <!DOCTYPE html>
2
- <html>
3
-
4
- <head>
5
-
6
- <script src="../jspsych.js"></script>
7
- <script src="../plugins/jspsych-html-keyboard-response.js"></script>
8
- <script src="../plugins/jspsych-image-keyboard-response.js"></script>
9
- <link rel="stylesheet" href="../css/jspsych.css">
10
- <style>
11
- img {
12
- width: 300px;
13
- }
14
- </style>
15
- </head>
16
- <body></body>
17
- <script>
18
- var images = ["img/1.gif", "img/2.gif", "img/3.gif", "img/4.gif", "img/5.gif", "img/6.gif", "img/7.gif", "img/8.gif", "img/9.gif", "img/10.gif"];
19
-
20
- var trials = [];
21
- for (var i = 0; i < images.length; i++) {
22
- trials.push({
23
- stimulus: images[i]
24
- });
25
- }
26
-
27
- var block = {
28
- type: 'image-keyboard-response',
29
- choices: [89, 78], // Y or N
30
- prompt: '<p>Press Y to Continue. Press N to end this node of the experiment.</p>',
31
- on_finish: function(data) {
32
- if (data.key_press == 78) {
33
- jsPsych.endCurrentTimeline();
34
- }
35
- },
36
- timeline: trials
37
- }
38
-
39
- var after_block = {
40
- type: 'html-keyboard-response',
41
- stimulus: '<p>The next node</p>',
42
- }
43
-
44
- jsPsych.init({
45
- timeline: [block, after_block],
46
- on_finish: function() {
47
- jsPsych.data.displayData();
48
- }
49
- });
50
- </script>
51
-
52
- </html>
@@ -1,43 +0,0 @@
1
- <!DOCTYPE html>
2
- <html>
3
-
4
- <head>
5
- <script src="../jspsych.js"></script>
6
- <script src="../plugins/jspsych-image-keyboard-response.js"></script>
7
- <link rel="stylesheet" href="../css/jspsych.css">
8
- <style>
9
- img {
10
- width: 300px;
11
- }
12
- </style>
13
- </head>
14
- <body></body>
15
- <script>
16
- var images = ["img/1.gif", "img/2.gif", "img/3.gif", "img/4.gif", "img/5.gif", "img/6.gif", "img/7.gif", "img/8.gif", "img/9.gif", "img/10.gif"];
17
-
18
- var trials = [];
19
- for (var i = 0; i < images.length; i++) {
20
- trials.push({
21
- stimulus: images[i]
22
- });
23
- }
24
-
25
- var block = {
26
- type: 'image-keyboard-response',
27
- choices: [89, 78], // Y or N
28
- prompt: '<p>Press Y to Continue. Press N to end the experiment</p>',
29
- on_finish: function(data) {
30
- if (data.key_press == 78) {
31
- jsPsych.endExperiment('The experiment was ended. This is the end message.');
32
- }
33
- },
34
- timeline: trials
35
- }
36
-
37
-
38
- jsPsych.init({
39
- timeline: [block]
40
- });
41
- </script>
42
-
43
- </html>