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,84 +0,0 @@
1
- <!DOCTYPE html>
2
- <html>
3
- <head>
4
- <script src="../jspsych.js"></script>
5
- <script src="../plugins/jspsych-image-button-response.js"></script>
6
- <link rel="stylesheet" href="../css/jspsych.css">
7
- </head>
8
- <body></body>
9
- <script>
10
-
11
- var timeline = [];
12
-
13
- // If render_on_canvas is false, the images will be shown via an <img> rather than <canvas> element.
14
- // In some browsers, the first time the images are shown, the <img> method (render_on_canvas: false) will produce a brief
15
- // blank screen (white flash) between images that are presented consecutively with no post_trial_gap between them.
16
- var trial = {
17
- type: 'image-button-response',
18
- stimulus: jsPsych.timelineVariable('stim'),
19
- trial_duration: 1000,
20
- choices: ['Happy', 'Sad'],
21
- prompt: '<p>What emotion is this person showing?</p><p>(1s duration, consecutive images with no post_trial_gap)</p>',
22
- stimulus_width: 400,
23
- maintain_aspect_ratio: true,
24
- post_trial_gap: 0,
25
- //render_on_canvas: false
26
- }
27
-
28
- timeline.push({
29
- timeline: [trial],
30
- timeline_variables: [
31
- {stim: 'img/happy_face_1.jpg'},
32
- {stim: 'img/happy_face_2.jpg'},
33
- {stim: 'img/happy_face_3.jpg'},
34
- {stim: 'img/happy_face_4.jpg'}
35
- ]
36
- });
37
-
38
- timeline.push({
39
- type: 'image-button-response',
40
- stimulus: 'img/happy_face_1.jpg',
41
- choices: ['Happy', 'Sad'],
42
- prompt: "<p>What emotion is this person showing?</p><p>(Wait for response)</p>",
43
- post_trial_gap: 500
44
- });
45
-
46
- timeline.push({
47
- type: 'image-button-response',
48
- stimulus: 'img/happy_face_2.jpg',
49
- stimulus_height: 400,
50
- choices: ['Happy', 'Sad'],
51
- stimulus_duration: 1000,
52
- prompt: "<p>What emotion is this person showing? (image disappears after 1s)</p>",
53
- post_trial_gap: 500
54
- });
55
-
56
- timeline.push({
57
- type: 'image-button-response',
58
- stimulus: 'img/happy_face_3.jpg',
59
- stimulus_width: 600,
60
- choices: ['Happy', 'Sad'],
61
- trial_duration: 2000,
62
- response_ends_trial: false,
63
- prompt: "<p>What emotion is this person showing? (trial ends after 2s)</p>",
64
- post_trial_gap: 500
65
- });
66
-
67
- timeline.push({
68
- type: 'image-button-response',
69
- stimulus: 'img/happy_face_4.jpg',
70
- choices: ['Happy', 'Sad'],
71
- stimulus_width: 400,
72
- maintain_aspect_ratio: false,
73
- prompt: '<p>What emotion is this person showing?</p><p>(Stimulus_width set to a smaller value and maintain_aspect_ratio set to false.)</p>',
74
- post_trial_gap: 500
75
- });
76
-
77
- jsPsych.init({
78
- timeline: timeline,
79
- preload_images: ['img/happy_face_1.jpg','img/happy_face_2.jpg','img/happy_face_3.jpg','img/happy_face_4.jpg'],
80
- on_finish: function(){jsPsych.data.displayData();}
81
- });
82
-
83
- </script>
84
- </html>
@@ -1,78 +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
-
11
- // If render_on_canvas is false, the images will be shown via an <img> rather than <canvas> element.
12
- // In some browsers, the first time the images are shown, the <img> method (render_on_canvas: false) will produce a brief
13
- // blank screen (white flash) between images that are presented consecutively with no post_trial_gap between them.
14
- var trial = {
15
- type: 'image-keyboard-response',
16
- stimulus: jsPsych.timelineVariable('stim'),
17
- trial_duration: 300,
18
- choices: jsPsych.NO_KEYS,
19
- prompt: '<p>Watch the faces.</p>',
20
- stimulus_width: 400,
21
- maintain_aspect_ratio: true,
22
- post_trial_gap: 0,
23
- //render_on_canvas: false
24
- }
25
-
26
- var trial_proc = {
27
- timeline: [trial],
28
- timeline_variables: [
29
- {stim: 'img/happy_face_1.jpg'},
30
- {stim: 'img/happy_face_2.jpg'},
31
- {stim: 'img/happy_face_3.jpg'},
32
- {stim: 'img/happy_face_4.jpg'}
33
- ],
34
- repetitions: 3
35
- }
36
-
37
- var trial_1 = {
38
- type: 'image-keyboard-response',
39
- stimulus: 'img/happy_face_1.jpg',
40
- choices: ['y','n'],
41
- prompt: '<p>Have you seen this face before? Y or N.</p>'
42
- }
43
-
44
- var trial_2 = {
45
- type: 'image-keyboard-response',
46
- stimulus: 'img/happy_face_2.jpg',
47
- choices: ['y','n'],
48
- trial_duration: 5000,
49
- prompt: '<p>Have you seen this face before? Y or N. (5s time limit).</p>'
50
- }
51
-
52
- var trial_3 = {
53
- type: 'image-keyboard-response',
54
- stimulus: 'img/happy_face_3.jpg',
55
- choices: jsPsych.NO_KEYS,
56
- trial_duration: 2000,
57
- prompt: '<p>No response allowed. 2s wait.</p>'
58
- }
59
-
60
- var trial_4 = {
61
- type: 'image-keyboard-response',
62
- stimulus: 'img/happy_face_4.jpg',
63
- choices: ['y','n'],
64
- stimulus_width: 400,
65
- maintain_aspect_ratio: false,
66
- prompt: '<p>Have you seen this face before? Y or N.</p><p>(Stimulus_width set to a smaller value and maintain_aspect_ratio set to false.)</p>'
67
- }
68
-
69
- jsPsych.init({
70
- timeline: [trial_proc, trial_1, trial_2, trial_3, trial_4],
71
- preload_images: ['img/happy_face_1.jpg','img/happy_face_2.jpg','img/happy_face_3.jpg','img/happy_face_4.jpg'],
72
- on_finish: function() {
73
- jsPsych.data.displayData();
74
- }
75
- });
76
- </script>
77
-
78
- </html>
@@ -1,76 +0,0 @@
1
- <!DOCTYPE html>
2
- <html>
3
- <head>
4
- <script src="../jspsych.js"></script>
5
- <script src="../plugins/jspsych-image-slider-response.js"></script>
6
- <link rel="stylesheet" href="../css/jspsych.css">
7
- </head>
8
- <body></body>
9
- <script>
10
-
11
- // If render_on_canvas is false, the images will be shown via an <img> rather than <canvas> element.
12
- // In some browsers, the first time the images are shown, the <img> method (render_on_canvas: false) will produce a brief
13
- // blank screen (white flash) between images that are presented consecutively with no post_trial_gap between them.
14
- var trial = {
15
- type: 'image-slider-response',
16
- stimulus: jsPsych.timelineVariable('stim'),
17
- trial_duration: 1000,
18
- labels: ['1 (least happy)', '100 (most happy)'],
19
- prompt: '<p>How happy is this person on a scale of 1-100?</p><p>(Consecutive images with no post_trial_gap)</p>',
20
- response_ends_trial: false,
21
- slider_width: 500,
22
- stimulus_width: 400,
23
- maintain_aspect_ratio: true,
24
- post_trial_gap: 0,
25
- //render_on_canvas: false
26
- }
27
-
28
- var trial_proc = {
29
- timeline: [trial],
30
- timeline_variables: [
31
- {stim: 'img/happy_face_1.jpg'},
32
- {stim: 'img/happy_face_2.jpg'},
33
- {stim: 'img/happy_face_3.jpg'},
34
- {stim: 'img/happy_face_4.jpg'}
35
- ]
36
- }
37
-
38
- var trial_1 = {
39
- type: 'image-slider-response',
40
- stimulus: 'img/happy_face_1.jpg',
41
- labels: ['1 (least happy)', '100 (most happy)'],
42
- slider_width: 500,
43
- require_movement: true,
44
- prompt: '<p>How happy is this person on a scale of 1-100? (Interaction with slider is required)</p>'
45
- }
46
-
47
- var trial_2 = {
48
- type: 'image-slider-response',
49
- stimulus: 'img/happy_face_2.jpg',
50
- labels: ['1 (least happy)', '100 (most happy)'],
51
- slider_start: 80,
52
- slider_width: 500,
53
- prompt: '<p>How happy is this person on a scale of 1-100? (5s time limit; set start value)</p>',
54
- trial_duration: 5000
55
- }
56
-
57
- var trial_3 = {
58
- type: 'image-slider-response',
59
- stimulus: 'img/happy_face_3.jpg',
60
- labels: ['1 (least happy)', '100 (most happy)'],
61
- slider_width: 500,
62
- prompt: '<p>How happy is this person on a scale of 1-100? (1s stimulus duration)</p>',
63
- stimulus_duration: 1000
64
- }
65
-
66
- jsPsych.init({
67
- timeline: [trial_proc, trial_1, trial_2, trial_3],
68
- preload_images: ['img/happy_face_1.jpg','img/happy_face_2.jpg','img/happy_face_3.jpg','img/happy_face_4.jpg'],
69
- on_finish: function() {
70
- jsPsych.data.displayData();
71
- },
72
- default_iti: 250
73
- });
74
- </script>
75
-
76
- </html>
@@ -1,37 +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></body>
9
- <script>
10
-
11
- var trial_1 = {
12
- type: 'instructions',
13
- pages: ['<p>Welcome to the experiment.</p><p>This is the first set of instructions.</p><p>Click next to begin.</p>',
14
- '<p>This is the second page of instructions.</p>',
15
- '<p>This is the final page.</p>'],
16
- show_clickable_nav: true
17
- }
18
-
19
- var trial_2 = {
20
- type: 'instructions',
21
- pages: ['<p>This is a new set of instructions.</p><p>Custom "Page X/Y" and next/previous button labels provide support for different languages.</p>',
22
- '<p>This is the second page of instructions.</p>',
23
- '<p>This is the final page.</p>'],
24
- show_clickable_nav: true,
25
- show_page_number: true,
26
- button_label_previous: 'Anterior',
27
- button_label_next: 'Próxima',
28
- page_label: 'Página',
29
- }
30
-
31
- jsPsych.init({
32
- timeline: [trial_1, trial_2],
33
- on_finish: function(){ jsPsych.data.displayData(); }
34
- });
35
-
36
- </script>
37
- </html>
@@ -1,33 +0,0 @@
1
- <!DOCTYPE html>
2
- <html>
3
- <head>
4
- <script src="../jspsych.js"></script>
5
- <script src="../plugins/jspsych-maxdiff.js"></script>
6
- <link rel="stylesheet" href="../css/jspsych.css">
7
- </head>
8
- <body></body>
9
- <script>
10
-
11
- var maxdiff_trial = {
12
- type: 'maxdiff',
13
- alternatives: ['apple', 'orange', 'pear', 'banana'],
14
- labels: ['Most Preferred', 'Least Preferred'],
15
- preamble: '<p> Please select your <b>most preferred</b> and <b>least preferred</b> fruits. </p>'
16
- };
17
-
18
- var maxdiff_trial_random_required = {
19
- type: 'maxdiff',
20
- alternatives: ['strawberry', 'watermelon', 'kiwi', 'grapefruit'],
21
- labels: ['Most Preferred', 'Least Preferred'],
22
- preamble: '<p> Please select your <b>most preferred</b> and <b>least preferred</b> fruits. </p>',
23
- randomize_alternative_order: true,
24
- required: true
25
- }
26
-
27
- jsPsych.init({
28
- timeline: [maxdiff_trial, maxdiff_trial_random_required],
29
- on_finish: function() { jsPsych.data.displayData(); }
30
- });
31
-
32
- </script>
33
- </html>
@@ -1,43 +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
- <script src="../plugins/jspsych-reconstruction.js"></script>
7
- <link rel="stylesheet" href="../css/jspsych.css">
8
- </head>
9
- <body></body>
10
- <script>
11
-
12
- var sample_function = function(param){
13
- var size = 50 + Math.floor(param*250);
14
- var html = '<div style="display: block; margin: auto; height: 300px; width: 300px; position: relative;">'+
15
- '<div style="display: block; position: absolute; top: '+(150 - size/2)+'px; left:'+(150 - size/2)+'px; background-color: #000000; '+
16
- 'width: '+size+'px; height: '+size+'px;"></div></div><p>Press H to make the square larger. Press G to make the square smaller.</p>'+
17
- '<p>When the square is the same size as the previous one, click Next.</p>';
18
- return html;
19
- }
20
-
21
- var pre_test = {
22
- type: 'html-keyboard-response',
23
- stimulus: '<div style="display: block; margin: auto; height: 300px; width: 300px; position: relative;">'+
24
- '<div style="display: block; position: absolute; top: '+(150 - 210/2)+'px; left:'+(150 - 210/2)+'px; background-color: #000000; '+
25
- 'width: 210px; height: 210px;"></div></div>',
26
- choices: ['c'],
27
- post_trial_gap: 1250,
28
- prompt: '<p>Study the size of this square carefully. On the next screen you will have to recreate it. When you are ready, press C.</p>'
29
- }
30
-
31
- var test = {
32
- type: 'reconstruction',
33
- stim_function: sample_function,
34
- starting_value: 0.5,
35
- }
36
-
37
- jsPsych.init({
38
- timeline: [pre_test, test],
39
- on_finish: function() { jsPsych.data.displayData(); }
40
- });
41
-
42
- </script>
43
- </html>
@@ -1,34 +0,0 @@
1
- <!DOCTYPE html>
2
- <html>
3
- <head>
4
- <script src="../jspsych.js"></script>
5
- <script src="../plugins/jspsych-resize.js"></script>
6
- <script src="../plugins/jspsych-image-keyboard-response.js"></script>
7
- <link rel="stylesheet" href="../css/jspsych.css">
8
- </head>
9
- <body>
10
- </body>
11
- <script>
12
-
13
- var inputs = {
14
- type: 'resize',
15
- item_width: 3 + 3/8,
16
- item_height: 2 + 1/8,
17
- prompt: "<p>Click and drag the lower right corner of the box until the box is the same size as a credit card held up to the screen.</p>",
18
- pixels_per_unit: 642/4
19
- };
20
-
21
- var image_display = {
22
- type: 'image-keyboard-response',
23
- stimulus: 'img/happy_face_4.jpg',
24
- prompt: '<p>If scaling worked, then the image above should be 4 inches wide.</p>',
25
- }
26
-
27
- jsPsych.init({
28
- timeline: [inputs, image_display],
29
- on_finish: function() {
30
- jsPsych.data.displayData();
31
- }
32
- });
33
- </script>
34
- </html>
@@ -1,28 +0,0 @@
1
- <!DOCTYPE html>
2
- <html>
3
-
4
- <head>
5
- <script src="../jspsych.js"></script>
6
- <script src="../plugins/jspsych-same-different-html.js"></script>
7
- <link rel="stylesheet" href="../css/jspsych.css">
8
- </head>
9
- <body></body>
10
- <script>
11
- var trial = {
12
- type: 'same-different-html',
13
- stimuli: ['<p>Talkative</p>', '<p>Loquacious</p>'],
14
- prompt: "<p>Press S if the words mean the same thing. Press D if they mean different things.</p>",
15
- same_key: 'S',
16
- different_key: 'D',
17
- answer: 'same'
18
- }
19
-
20
- jsPsych.init({
21
- timeline: [trial],
22
- on_finish: function() {
23
- jsPsych.data.displayData();
24
- }
25
- });
26
- </script>
27
-
28
- </html>
@@ -1,33 +0,0 @@
1
- <!DOCTYPE html>
2
- <html>
3
-
4
- <head>
5
- <script src="../jspsych.js"></script>
6
- <script src="../plugins/jspsych-same-different-image.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 trial = {
17
- type: 'same-different-image',
18
- stimuli: ['img/happy_face_1.jpg', 'img/sad_face_3.jpg'],
19
- prompt: "<p>Press S if the faces had the same emotional expression. Press D if the faces had different emotional expressions.</p>",
20
- same_key: 'S',
21
- different_key: 'D',
22
- answer: 'different'
23
- }
24
-
25
- jsPsych.init({
26
- timeline: [trial],
27
- on_finish: function() {
28
- jsPsych.data.displayData();
29
- }
30
- });
31
- </script>
32
-
33
- </html>
@@ -1,98 +0,0 @@
1
- <!DOCTYPE html>
2
- <html>
3
-
4
- <head>
5
- <script src="../jspsych.js"></script>
6
- <script src="../plugins/jspsych-serial-reaction-time-mouse.js"></script>
7
- <link rel="stylesheet" href="../css/jspsych.css">
8
- </head>
9
-
10
- <body></body>
11
-
12
- <script>
13
-
14
- var grid_rows = 8;
15
- var grid_cols = 8;
16
- var square_size = 50;
17
-
18
- var grid = [];
19
- var locations = [];
20
-
21
- for(var i=0; i<grid_rows; i++){
22
- grid.push([]);
23
- for(var j=0; j<grid_cols; j++){
24
- grid[i].push(1);
25
- if(i>0 && i < grid_rows-1 && j > 0 && j < grid_cols - 1){
26
- locations.push([i,j]);
27
- }
28
- }
29
- }
30
-
31
- var last_predictor = null;
32
- var last_target = null;
33
- var colors = ["#f3c300", "#875692", "#f38400", "#a1caf1", "#be0032", "#c2b280", "#848482", "#008856"];
34
- var deltas = [[-1,-1], [-1, 0], [-1, 1], [0, -1], [0, 1], [1, -1], [1,0], [1,1]];
35
- var order = [0,1,2,3,4,5,6,7];
36
- order = jsPsych.randomization.shuffle(order);
37
- var current_idx = -1;
38
-
39
- function getNextPredictor(){
40
- current_idx++;
41
- if(current_idx >= order.length){
42
- order = jsPsych.randomization.shuffle(order);
43
- current_idx = 0;
44
- }
45
- var predictor = jsPsych.randomization.sampleWithoutReplacement(locations, 1)[0];
46
- if(last_target !== null){
47
- while(predictor[0] == last_target[0] && predictor[1] == last_target[1]){
48
- predictor = jsPsych.randomization.sampleWithoutReplacement(locations, 1)[0];
49
- }
50
- }
51
- last_predictor = predictor;
52
- return predictor;
53
- }
54
-
55
- function getNextTarget(){
56
- var target = last_predictor.slice();
57
- var d = deltas[order[current_idx]];
58
- target[0] = target[0] + d[0];
59
- target[1] = target[1] + d[1];
60
- last_target = target;
61
- return target;
62
- }
63
-
64
- function getColor(){
65
- return colors[order[current_idx]];
66
- }
67
-
68
- var timeline_2 = {
69
- timeline: [
70
- {
71
- type: 'serial-reaction-time-mouse',
72
- grid: grid,
73
- target: getNextPredictor,
74
- target_color: getColor,
75
- grid_square_size: square_size,
76
- allow_nontarget_responses: true
77
- },
78
- {
79
- type: 'serial-reaction-time-mouse',
80
- grid: grid,
81
- target: getNextTarget,
82
- target_color: getColor,
83
- grid_square_size: square_size
84
- }
85
- ],
86
- repetitions: 6,
87
- }
88
-
89
- jsPsych.init({
90
- timeline: [timeline_2],
91
- on_finish: function() {
92
- jsPsych.data.displayData();
93
- },
94
- default_iti: 0
95
- });
96
- </script>
97
-
98
- </html>
@@ -1,54 +0,0 @@
1
- <!DOCTYPE html>
2
- <html>
3
-
4
- <head>
5
-
6
- <script src="../jspsych.js"></script>
7
- <script src="../plugins/jspsych-serial-reaction-time.js"></script>
8
- <link rel="stylesheet" href="../css/jspsych.css">
9
- </head>
10
-
11
- <script>
12
-
13
- var locations = [
14
- [0,0],
15
- [0,1],
16
- [0,2],
17
- [0,3]
18
- ];
19
-
20
- locations = jsPsych.randomization.shuffle(locations);
21
-
22
- var timeline = {
23
- timeline: [
24
- {
25
- type: 'serial-reaction-time',
26
- target: jsPsych.timelineVariable('target1'),
27
- grid_square_size: 80,
28
- prompt: "<p>Press the key that corresponds to the dark box (use 3, 5, 7, 9)</p>"
29
- },
30
- {
31
- type: 'serial-reaction-time',
32
- target: jsPsych.timelineVariable('target2'),
33
- grid_square_size: 80,
34
- prompt: "<p>Press the key that corresponds to the dark box (use 3, 5, 7, 9)</p>"
35
- }
36
- ],
37
- timeline_variables: [
38
- {target1: locations[0], target2: locations[1]},
39
- {target1: locations[2], target2: locations[3]}
40
- ],
41
- randomize_order: true,
42
- repetitions: 10
43
- }
44
-
45
- jsPsych.init({
46
- timeline: [timeline],
47
- on_finish: function() {
48
- jsPsych.data.displayData();
49
- },
50
- default_iti: 0
51
- });
52
- </script>
53
-
54
- </html>
@@ -1,33 +0,0 @@
1
- <!DOCTYPE html>
2
- <html>
3
- <head>
4
- <script src="../jspsych.js"></script>
5
- <script src="../plugins/jspsych-survey-html-form.js"></script>
6
- <link rel="stylesheet" href="../css/jspsych.css"></script>
7
- </head>
8
- <body>
9
-
10
- </body>
11
- <script type="text/javascript">
12
-
13
- var form_trial = {
14
- type: 'survey-html-form',
15
- preamble: '<p> How are you feeling <b>right now?</b> </p>',
16
- html: '<p> I am feeling <input name="first" type="text" />, <input name="second" type="text" />, and <input name="third" type="text" />.</p>'
17
- }
18
-
19
- var autofocus_trial = {
20
- type: 'survey-html-form',
21
- preamble: '<p> What is your favorite bird?</p>',
22
- html: '<p>My favorite bird is <input type="text" id="test-resp-box" name="response" size="10" /></p>',
23
- autofocus: 'test-resp-box'
24
- }
25
-
26
- jsPsych.init({
27
- timeline: [form_trial,autofocus_trial],
28
- on_finish: function(){ jsPsych.data.displayData(); }
29
- });
30
-
31
- </script>
32
-
33
- </html>
@@ -1,42 +0,0 @@
1
- <!DOCTYPE html>
2
- <html>
3
- <head>
4
-
5
- <script src="../jspsych.js"></script>
6
- <script src="../plugins/jspsych-survey-likert.js"></script>
7
- <link rel="stylesheet" href="../css/jspsych.css">
8
- </head>
9
- <body></body>
10
- <script>
11
-
12
- var scale = ["Strongly Disagree", "Disagree", "Neutral", "Agree", "Strongly Agree"];
13
-
14
- var likert_trial = {
15
- type: 'survey-likert',
16
- questions: [
17
- {prompt: "I like vegetables.", name: 'Vegetables', labels: scale, required: true},
18
- {prompt: "I like fruit.", name: 'Fruit', labels: scale, required: true}
19
- ],
20
- };
21
-
22
- var likert_trial_random_order = {
23
- type: 'survey-likert',
24
- questions: [
25
- {prompt: "Question 1", labels: scale},
26
- {prompt: "Question 2", labels: scale},
27
- {prompt: "Question 3", labels: scale},
28
- {prompt: "Question 4", labels: scale},
29
- {prompt: "Question 5", labels: scale}
30
- ],
31
- randomize_question_order: true,
32
- scale_width: 500
33
- };
34
-
35
- jsPsych.init({
36
- timeline: [likert_trial, likert_trial_random_order],
37
- on_finish: function() { jsPsych.data.displayData(); }
38
- });
39
-
40
-
41
- </script>
42
- </html>