@jspsych/plugin-html-keyboard-response 1.1.2 → 1.1.3

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 (8) hide show
  1. package/README.md +8 -2
  2. package/dist/index.browser.js +166 -166
  3. package/dist/index.browser.min.js +2 -2
  4. package/dist/index.browser.min.js.map +1 -1
  5. package/dist/index.cjs +165 -165
  6. package/dist/index.d.ts +126 -126
  7. package/dist/index.js +165 -165
  8. package/package.json +2 -2
package/README.md CHANGED
@@ -27,9 +27,15 @@ See the [contributing to jsPsych](https://www.jspsych.org/latest/developers/cont
27
27
 
28
28
  ## Citation
29
29
 
30
- If you use this library in academic work, please cite the [paper that describes jsPsych](http://link.springer.com/article/10.3758%2Fs13428-014-0458-y):
30
+ If you use this library in academic work, the preferred citation is:
31
31
 
32
- de Leeuw, J.R. (2015). jsPsych: A JavaScript library for creating behavioral experiments in a Web browser. _Behavior Research Methods_, _47_(1), 1-12. doi:10.3758/s13428-014-0458-y
32
+ de Leeuw, J.R., Gilbert, R.A., & Luchterhandt, B. (2023). jsPsych: Enabling an open-source collaborative ecosystem of behavioral experiments. *Journal of Open Source Software*, *8*(85), 5351, [https://joss.theoj.org/papers/10.21105/joss.05351](https://joss.theoj.org/papers/10.21105/joss.05351).
33
+
34
+ This paper is an updated description of jsPsych and includes all current core team members. It replaces the earlier paper that described jsPsych:
35
+
36
+ de Leeuw, J.R. (2015). jsPsych: A JavaScript library for creating behavioral experiments in a Web browser. *Behavior Research Methods*, _47_(1), 1-12. doi:[10.3758/s13428-014-0458-y](http://link.springer.com/article/10.3758%2Fs13428-014-0458-y)
37
+
38
+ Citations help us demonstrate that this library is used and valued, which allows us to continue working on it.
33
39
 
34
40
  ## Contributors
35
41
 
package/dist/index.browser.js CHANGED
@@ -1,174 +1,174 @@
1
1
  var jsPsychHtmlKeyboardResponse = (function (jspsych) {
2
2
  'use strict';
3
3
 
4
- const info = {
5
- name: "html-keyboard-response",
6
- parameters: {
7
- /**
8
- * The HTML string to be displayed.
9
- */
10
- stimulus: {
11
- type: jspsych.ParameterType.HTML_STRING,
12
- pretty_name: "Stimulus",
13
- default: undefined,
14
- },
15
- /**
16
- * Array containing the key(s) the subject is allowed to press to respond to the stimulus.
17
- */
18
- choices: {
19
- type: jspsych.ParameterType.KEYS,
20
- pretty_name: "Choices",
21
- default: "ALL_KEYS",
22
- },
23
- /**
24
- * Any content here will be displayed below the stimulus.
25
- */
26
- prompt: {
27
- type: jspsych.ParameterType.HTML_STRING,
28
- pretty_name: "Prompt",
29
- default: null,
30
- },
31
- /**
32
- * How long to show the stimulus.
33
- */
34
- stimulus_duration: {
35
- type: jspsych.ParameterType.INT,
36
- pretty_name: "Stimulus duration",
37
- default: null,
38
- },
39
- /**
40
- * How long to show trial before it ends.
41
- */
42
- trial_duration: {
43
- type: jspsych.ParameterType.INT,
44
- pretty_name: "Trial duration",
45
- default: null,
46
- },
47
- /**
48
- * If true, trial will end when subject makes a response.
49
- */
50
- response_ends_trial: {
51
- type: jspsych.ParameterType.BOOL,
52
- pretty_name: "Response ends trial",
53
- default: true,
54
- },
55
- },
56
- };
57
- /**
58
- * **html-keyboard-response**
59
- *
60
- * jsPsych plugin for displaying a stimulus and getting a keyboard response
61
- *
62
- * @author Josh de Leeuw
63
- * @see {@link https://www.jspsych.org/plugins/jspsych-html-keyboard-response/ html-keyboard-response plugin documentation on jspsych.org}
64
- */
65
- class HtmlKeyboardResponsePlugin {
66
- constructor(jsPsych) {
67
- this.jsPsych = jsPsych;
68
- }
69
- trial(display_element, trial) {
70
- var new_html = '<div id="jspsych-html-keyboard-response-stimulus">' + trial.stimulus + "</div>";
71
- // add prompt
72
- if (trial.prompt !== null) {
73
- new_html += trial.prompt;
74
- }
75
- // draw
76
- display_element.innerHTML = new_html;
77
- // store response
78
- var response = {
79
- rt: null,
80
- key: null,
81
- };
82
- // function to end trial when it is time
83
- const end_trial = () => {
84
- // kill any remaining setTimeout handlers
85
- this.jsPsych.pluginAPI.clearAllTimeouts();
86
- // kill keyboard listeners
87
- if (typeof keyboardListener !== "undefined") {
88
- this.jsPsych.pluginAPI.cancelKeyboardResponse(keyboardListener);
89
- }
90
- // gather the data to store for the trial
91
- var trial_data = {
92
- rt: response.rt,
93
- stimulus: trial.stimulus,
94
- response: response.key,
95
- };
96
- // clear the display
97
- display_element.innerHTML = "";
98
- // move on to the next trial
99
- this.jsPsych.finishTrial(trial_data);
100
- };
101
- // function to handle responses by the subject
102
- var after_response = (info) => {
103
- // after a valid response, the stimulus will have the CSS class 'responded'
104
- // which can be used to provide visual feedback that a response was recorded
105
- display_element.querySelector("#jspsych-html-keyboard-response-stimulus").className +=
106
- " responded";
107
- // only record the first response
108
- if (response.key == null) {
109
- response = info;
110
- }
111
- if (trial.response_ends_trial) {
112
- end_trial();
113
- }
114
- };
115
- // start the response listener
116
- if (trial.choices != "NO_KEYS") {
117
- var keyboardListener = this.jsPsych.pluginAPI.getKeyboardResponse({
118
- callback_function: after_response,
119
- valid_responses: trial.choices,
120
- rt_method: "performance",
121
- persist: false,
122
- allow_held_key: false,
123
- });
124
- }
125
- // hide stimulus if stimulus_duration is set
126
- if (trial.stimulus_duration !== null) {
127
- this.jsPsych.pluginAPI.setTimeout(() => {
128
- display_element.querySelector("#jspsych-html-keyboard-response-stimulus").style.visibility = "hidden";
129
- }, trial.stimulus_duration);
130
- }
131
- // end trial if trial_duration is set
132
- if (trial.trial_duration !== null) {
133
- this.jsPsych.pluginAPI.setTimeout(end_trial, trial.trial_duration);
134
- }
135
- }
136
- simulate(trial, simulation_mode, simulation_options, load_callback) {
137
- if (simulation_mode == "data-only") {
138
- load_callback();
139
- this.simulate_data_only(trial, simulation_options);
140
- }
141
- if (simulation_mode == "visual") {
142
- this.simulate_visual(trial, simulation_options, load_callback);
143
- }
144
- }
145
- create_simulation_data(trial, simulation_options) {
146
- const default_data = {
147
- stimulus: trial.stimulus,
148
- rt: this.jsPsych.randomization.sampleExGaussian(500, 50, 1 / 150, true),
149
- response: this.jsPsych.pluginAPI.getValidKey(trial.choices),
150
- };
151
- const data = this.jsPsych.pluginAPI.mergeSimulationData(default_data, simulation_options);
152
- this.jsPsych.pluginAPI.ensureSimulationDataConsistency(trial, data);
153
- return data;
154
- }
155
- simulate_data_only(trial, simulation_options) {
156
- const data = this.create_simulation_data(trial, simulation_options);
157
- this.jsPsych.finishTrial(data);
158
- }
159
- simulate_visual(trial, simulation_options, load_callback) {
160
- const data = this.create_simulation_data(trial, simulation_options);
161
- const display_element = this.jsPsych.getDisplayElement();
162
- this.trial(display_element, trial);
163
- load_callback();
164
- if (data.rt !== null) {
165
- this.jsPsych.pluginAPI.pressKey(data.response, data.rt);
166
- }
167
- }
168
- }
4
+ const info = {
5
+ name: "html-keyboard-response",
6
+ parameters: {
7
+ /**
8
+ * The HTML string to be displayed.
9
+ */
10
+ stimulus: {
11
+ type: jspsych.ParameterType.HTML_STRING,
12
+ pretty_name: "Stimulus",
13
+ default: undefined,
14
+ },
15
+ /**
16
+ * Array containing the key(s) the subject is allowed to press to respond to the stimulus.
17
+ */
18
+ choices: {
19
+ type: jspsych.ParameterType.KEYS,
20
+ pretty_name: "Choices",
21
+ default: "ALL_KEYS",
22
+ },
23
+ /**
24
+ * Any content here will be displayed below the stimulus.
25
+ */
26
+ prompt: {
27
+ type: jspsych.ParameterType.HTML_STRING,
28
+ pretty_name: "Prompt",
29
+ default: null,
30
+ },
31
+ /**
32
+ * How long to show the stimulus.
33
+ */
34
+ stimulus_duration: {
35
+ type: jspsych.ParameterType.INT,
36
+ pretty_name: "Stimulus duration",
37
+ default: null,
38
+ },
39
+ /**
40
+ * How long to show trial before it ends.
41
+ */
42
+ trial_duration: {
43
+ type: jspsych.ParameterType.INT,
44
+ pretty_name: "Trial duration",
45
+ default: null,
46
+ },
47
+ /**
48
+ * If true, trial will end when subject makes a response.
49
+ */
50
+ response_ends_trial: {
51
+ type: jspsych.ParameterType.BOOL,
52
+ pretty_name: "Response ends trial",
53
+ default: true,
54
+ },
55
+ },
56
+ };
57
+ /**
58
+ * **html-keyboard-response**
59
+ *
60
+ * jsPsych plugin for displaying a stimulus and getting a keyboard response
61
+ *
62
+ * @author Josh de Leeuw
63
+ * @see {@link https://www.jspsych.org/plugins/jspsych-html-keyboard-response/ html-keyboard-response plugin documentation on jspsych.org}
64
+ */
65
+ class HtmlKeyboardResponsePlugin {
66
+ constructor(jsPsych) {
67
+ this.jsPsych = jsPsych;
68
+ }
69
+ trial(display_element, trial) {
70
+ var new_html = '<div id="jspsych-html-keyboard-response-stimulus">' + trial.stimulus + "</div>";
71
+ // add prompt
72
+ if (trial.prompt !== null) {
73
+ new_html += trial.prompt;
74
+ }
75
+ // draw
76
+ display_element.innerHTML = new_html;
77
+ // store response
78
+ var response = {
79
+ rt: null,
80
+ key: null,
81
+ };
82
+ // function to end trial when it is time
83
+ const end_trial = () => {
84
+ // kill any remaining setTimeout handlers
85
+ this.jsPsych.pluginAPI.clearAllTimeouts();
86
+ // kill keyboard listeners
87
+ if (typeof keyboardListener !== "undefined") {
88
+ this.jsPsych.pluginAPI.cancelKeyboardResponse(keyboardListener);
89
+ }
90
+ // gather the data to store for the trial
91
+ var trial_data = {
92
+ rt: response.rt,
93
+ stimulus: trial.stimulus,
94
+ response: response.key,
95
+ };
96
+ // clear the display
97
+ display_element.innerHTML = "";
98
+ // move on to the next trial
99
+ this.jsPsych.finishTrial(trial_data);
100
+ };
101
+ // function to handle responses by the subject
102
+ var after_response = (info) => {
103
+ // after a valid response, the stimulus will have the CSS class 'responded'
104
+ // which can be used to provide visual feedback that a response was recorded
105
+ display_element.querySelector("#jspsych-html-keyboard-response-stimulus").className +=
106
+ " responded";
107
+ // only record the first response
108
+ if (response.key == null) {
109
+ response = info;
110
+ }
111
+ if (trial.response_ends_trial) {
112
+ end_trial();
113
+ }
114
+ };
115
+ // start the response listener
116
+ if (trial.choices != "NO_KEYS") {
117
+ var keyboardListener = this.jsPsych.pluginAPI.getKeyboardResponse({
118
+ callback_function: after_response,
119
+ valid_responses: trial.choices,
120
+ rt_method: "performance",
121
+ persist: false,
122
+ allow_held_key: false,
123
+ });
124
+ }
125
+ // hide stimulus if stimulus_duration is set
126
+ if (trial.stimulus_duration !== null) {
127
+ this.jsPsych.pluginAPI.setTimeout(() => {
128
+ display_element.querySelector("#jspsych-html-keyboard-response-stimulus").style.visibility = "hidden";
129
+ }, trial.stimulus_duration);
130
+ }
131
+ // end trial if trial_duration is set
132
+ if (trial.trial_duration !== null) {
133
+ this.jsPsych.pluginAPI.setTimeout(end_trial, trial.trial_duration);
134
+ }
135
+ }
136
+ simulate(trial, simulation_mode, simulation_options, load_callback) {
137
+ if (simulation_mode == "data-only") {
138
+ load_callback();
139
+ this.simulate_data_only(trial, simulation_options);
140
+ }
141
+ if (simulation_mode == "visual") {
142
+ this.simulate_visual(trial, simulation_options, load_callback);
143
+ }
144
+ }
145
+ create_simulation_data(trial, simulation_options) {
146
+ const default_data = {
147
+ stimulus: trial.stimulus,
148
+ rt: this.jsPsych.randomization.sampleExGaussian(500, 50, 1 / 150, true),
149
+ response: this.jsPsych.pluginAPI.getValidKey(trial.choices),
150
+ };
151
+ const data = this.jsPsych.pluginAPI.mergeSimulationData(default_data, simulation_options);
152
+ this.jsPsych.pluginAPI.ensureSimulationDataConsistency(trial, data);
153
+ return data;
154
+ }
155
+ simulate_data_only(trial, simulation_options) {
156
+ const data = this.create_simulation_data(trial, simulation_options);
157
+ this.jsPsych.finishTrial(data);
158
+ }
159
+ simulate_visual(trial, simulation_options, load_callback) {
160
+ const data = this.create_simulation_data(trial, simulation_options);
161
+ const display_element = this.jsPsych.getDisplayElement();
162
+ this.trial(display_element, trial);
163
+ load_callback();
164
+ if (data.rt !== null) {
165
+ this.jsPsych.pluginAPI.pressKey(data.response, data.rt);
166
+ }
167
+ }
168
+ }
169
169
  HtmlKeyboardResponsePlugin.info = info;
170
170
 
171
171
  return HtmlKeyboardResponsePlugin;
172
172
 
173
173
  })(jsPsychModule);
174
- //# sourceMappingURL=index.browser.js.map
174
+ //# sourceMappingURL=https://unpkg.com/@jspsych/plugin-html-keyboard-response@1.1.3/dist/index.browser.js.map
package/dist/index.browser.min.js CHANGED
@@ -1,2 +1,2 @@
1
- var jsPsychHtmlKeyboardResponse=function(e){"use strict";function t(e,t){for(var s=0;s<t.length;s++){var i=t[s];i.enumerable=i.enumerable||!1,i.configurable=!0,"value"in i&&(i.writable=!0),Object.defineProperty(e,i.key,i)}}var s={name:"html-keyboard-response",parameters:{stimulus:{type:e.ParameterType.HTML_STRING,pretty_name:"Stimulus",default:void 0},choices:{type:e.ParameterType.KEYS,pretty_name:"Choices",default:"ALL_KEYS"},prompt:{type:e.ParameterType.HTML_STRING,pretty_name:"Prompt",default:null},stimulus_duration:{type:e.ParameterType.INT,pretty_name:"Stimulus duration",default:null},trial_duration:{type:e.ParameterType.INT,pretty_name:"Trial duration",default:null},response_ends_trial:{type:e.ParameterType.BOOL,pretty_name:"Response ends trial",default:!0}}},i=function(){function e(t){!function(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}(this,e),this.jsPsych=t}var s,i,a;return s=e,i=[{key:"trial",value:function(e,t){var s=this,i='<div id="jspsych-html-keyboard-response-stimulus">'+t.stimulus+"</div>";null!==t.prompt&&(i+=t.prompt),e.innerHTML=i;var a={rt:null,key:null},n=function(){s.jsPsych.pluginAPI.clearAllTimeouts(),void 0!==r&&s.jsPsych.pluginAPI.cancelKeyboardResponse(r);var i={rt:a.rt,stimulus:t.stimulus,response:a.key};e.innerHTML="",s.jsPsych.finishTrial(i)};if("NO_KEYS"!=t.choices)var r=this.jsPsych.pluginAPI.getKeyboardResponse({callback_function:function(s){e.querySelector("#jspsych-html-keyboard-response-stimulus").className+=" responded",null==a.key&&(a=s),t.response_ends_trial&&n()},valid_responses:t.choices,rt_method:"performance",persist:!1,allow_held_key:!1});null!==t.stimulus_duration&&this.jsPsych.pluginAPI.setTimeout((function(){e.querySelector("#jspsych-html-keyboard-response-stimulus").style.visibility="hidden"}),t.stimulus_duration),null!==t.trial_duration&&this.jsPsych.pluginAPI.setTimeout(n,t.trial_duration)}},{key:"simulate",value:function(e,t,s,i){"data-only"==t&&(i(),this.simulate_data_only(e,s)),"visual"==t&&this.simulate_visual(e,s,i)}},{key:"create_simulation_data",value:function(e,t){var s={stimulus:e.stimulus,rt:this.jsPsych.randomization.sampleExGaussian(500,50,1/150,!0),response:this.jsPsych.pluginAPI.getValidKey(e.choices)},i=this.jsPsych.pluginAPI.mergeSimulationData(s,t);return this.jsPsych.pluginAPI.ensureSimulationDataConsistency(e,i),i}},{key:"simulate_data_only",value:function(e,t){var s=this.create_simulation_data(e,t);this.jsPsych.finishTrial(s)}},{key:"simulate_visual",value:function(e,t,s){var i=this.create_simulation_data(e,t),a=this.jsPsych.getDisplayElement();this.trial(a,e),s(),null!==i.rt&&this.jsPsych.pluginAPI.pressKey(i.response,i.rt)}}],i&&t(s.prototype,i),a&&t(s,a),Object.defineProperty(s,"prototype",{writable:!1}),e}();return i.info=s,i}(jsPsychModule);
2
- //# sourceMappingURL=index.browser.min.js.map
1
+ var jsPsychHtmlKeyboardResponse=function(e){"use strict";function t(e,t){for(var s=0;s<t.length;s++){var i=t[s];i.enumerable=i.enumerable||!1,i.configurable=!0,"value"in i&&(i.writable=!0),Object.defineProperty(e,(r=i.key,a=void 0,"symbol"==typeof(a=function(e,t){if("object"!=typeof e||null===e)return e;var s=e[Symbol.toPrimitive];if(void 0!==s){var i=s.call(e,t||"default");if("object"!=typeof i)return i;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===t?String:Number)(e)}(r,"string"))?a:String(a)),i)}var r,a}var s={name:"html-keyboard-response",parameters:{stimulus:{type:e.ParameterType.HTML_STRING,pretty_name:"Stimulus",default:void 0},choices:{type:e.ParameterType.KEYS,pretty_name:"Choices",default:"ALL_KEYS"},prompt:{type:e.ParameterType.HTML_STRING,pretty_name:"Prompt",default:null},stimulus_duration:{type:e.ParameterType.INT,pretty_name:"Stimulus duration",default:null},trial_duration:{type:e.ParameterType.INT,pretty_name:"Trial duration",default:null},response_ends_trial:{type:e.ParameterType.BOOL,pretty_name:"Response ends trial",default:!0}}},i=function(){function e(t){!function(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}(this,e),this.jsPsych=t}var s,i,r;return s=e,i=[{key:"trial",value:function(e,t){var s=this,i='<div id="jspsych-html-keyboard-response-stimulus">'+t.stimulus+"</div>";null!==t.prompt&&(i+=t.prompt),e.innerHTML=i;var r={rt:null,key:null},a=function(){s.jsPsych.pluginAPI.clearAllTimeouts(),void 0!==n&&s.jsPsych.pluginAPI.cancelKeyboardResponse(n);var i={rt:r.rt,stimulus:t.stimulus,response:r.key};e.innerHTML="",s.jsPsych.finishTrial(i)};if("NO_KEYS"!=t.choices)var n=this.jsPsych.pluginAPI.getKeyboardResponse({callback_function:function(s){e.querySelector("#jspsych-html-keyboard-response-stimulus").className+=" responded",null==r.key&&(r=s),t.response_ends_trial&&a()},valid_responses:t.choices,rt_method:"performance",persist:!1,allow_held_key:!1});null!==t.stimulus_duration&&this.jsPsych.pluginAPI.setTimeout((function(){e.querySelector("#jspsych-html-keyboard-response-stimulus").style.visibility="hidden"}),t.stimulus_duration),null!==t.trial_duration&&this.jsPsych.pluginAPI.setTimeout(a,t.trial_duration)}},{key:"simulate",value:function(e,t,s,i){"data-only"==t&&(i(),this.simulate_data_only(e,s)),"visual"==t&&this.simulate_visual(e,s,i)}},{key:"create_simulation_data",value:function(e,t){var s={stimulus:e.stimulus,rt:this.jsPsych.randomization.sampleExGaussian(500,50,1/150,!0),response:this.jsPsych.pluginAPI.getValidKey(e.choices)},i=this.jsPsych.pluginAPI.mergeSimulationData(s,t);return this.jsPsych.pluginAPI.ensureSimulationDataConsistency(e,i),i}},{key:"simulate_data_only",value:function(e,t){var s=this.create_simulation_data(e,t);this.jsPsych.finishTrial(s)}},{key:"simulate_visual",value:function(e,t,s){var i=this.create_simulation_data(e,t),r=this.jsPsych.getDisplayElement();this.trial(r,e),s(),null!==i.rt&&this.jsPsych.pluginAPI.pressKey(i.response,i.rt)}}],i&&t(s.prototype,i),r&&t(s,r),Object.defineProperty(s,"prototype",{writable:!1}),e}();return i.info=s,i}(jsPsychModule);
2
+ //# sourceMappingURL=https://unpkg.com/@jspsych/plugin-html-keyboard-response@1.1.3/dist/index.browser.min.js.map
package/dist/index.browser.min.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.browser.min.js","sources":["../src/index.ts"],"sourcesContent":["import { JsPsych, JsPsychPlugin, ParameterType, TrialType } from \"jspsych\";\n\nconst info = <const>{\n name: \"html-keyboard-response\",\n parameters: {\n /**\n * The HTML string to be displayed.\n */\n stimulus: {\n type: ParameterType.HTML_STRING,\n pretty_name: \"Stimulus\",\n default: undefined,\n },\n /**\n * Array containing the key(s) the subject is allowed to press to respond to the stimulus.\n */\n choices: {\n type: ParameterType.KEYS,\n pretty_name: \"Choices\",\n default: \"ALL_KEYS\",\n },\n /**\n * Any content here will be displayed below the stimulus.\n */\n prompt: {\n type: ParameterType.HTML_STRING,\n pretty_name: \"Prompt\",\n default: null,\n },\n /**\n * How long to show the stimulus.\n */\n stimulus_duration: {\n type: ParameterType.INT,\n pretty_name: \"Stimulus duration\",\n default: null,\n },\n /**\n * How long to show trial before it ends.\n */\n trial_duration: {\n type: ParameterType.INT,\n pretty_name: \"Trial duration\",\n default: null,\n },\n /**\n * If true, trial will end when subject makes a response.\n */\n response_ends_trial: {\n type: ParameterType.BOOL,\n pretty_name: \"Response ends trial\",\n default: true,\n },\n },\n};\n\ntype Info = typeof info;\n\n/**\n * **html-keyboard-response**\n *\n * jsPsych plugin for displaying a stimulus and getting a keyboard response\n *\n * @author Josh de Leeuw\n * @see {@link https://www.jspsych.org/plugins/jspsych-html-keyboard-response/ html-keyboard-response plugin documentation on jspsych.org}\n */\nclass HtmlKeyboardResponsePlugin implements JsPsychPlugin<Info> {\n static info = info;\n\n constructor(private jsPsych: JsPsych) {}\n\n trial(display_element: HTMLElement, trial: TrialType<Info>) {\n var new_html = '<div id=\"jspsych-html-keyboard-response-stimulus\">' + trial.stimulus + \"</div>\";\n\n // add prompt\n if (trial.prompt !== null) {\n new_html += trial.prompt;\n }\n\n // draw\n display_element.innerHTML = new_html;\n\n // store response\n var response = {\n rt: null,\n key: null,\n };\n\n // function to end trial when it is time\n const end_trial = () => {\n // kill any remaining setTimeout handlers\n this.jsPsych.pluginAPI.clearAllTimeouts();\n\n // kill keyboard listeners\n if (typeof keyboardListener !== \"undefined\") {\n this.jsPsych.pluginAPI.cancelKeyboardResponse(keyboardListener);\n }\n\n // gather the data to store for the trial\n var trial_data = {\n rt: response.rt,\n stimulus: trial.stimulus,\n response: response.key,\n };\n\n // clear the display\n display_element.innerHTML = \"\";\n\n // move on to the next trial\n this.jsPsych.finishTrial(trial_data);\n };\n\n // function to handle responses by the subject\n var after_response = (info) => {\n // after a valid response, the stimulus will have the CSS class 'responded'\n // which can be used to provide visual feedback that a response was recorded\n display_element.querySelector(\"#jspsych-html-keyboard-response-stimulus\").className +=\n \" responded\";\n\n // only record the first response\n if (response.key == null) {\n response = info;\n }\n\n if (trial.response_ends_trial) {\n end_trial();\n }\n };\n\n // start the response listener\n if (trial.choices != \"NO_KEYS\") {\n var keyboardListener = this.jsPsych.pluginAPI.getKeyboardResponse({\n callback_function: after_response,\n valid_responses: trial.choices,\n rt_method: \"performance\",\n persist: false,\n allow_held_key: false,\n });\n }\n\n // hide stimulus if stimulus_duration is set\n if (trial.stimulus_duration !== null) {\n this.jsPsych.pluginAPI.setTimeout(() => {\n display_element.querySelector<HTMLElement>(\n \"#jspsych-html-keyboard-response-stimulus\"\n ).style.visibility = \"hidden\";\n }, trial.stimulus_duration);\n }\n\n // end trial if trial_duration is set\n if (trial.trial_duration !== null) {\n this.jsPsych.pluginAPI.setTimeout(end_trial, trial.trial_duration);\n }\n }\n\n simulate(\n trial: TrialType<Info>,\n simulation_mode,\n simulation_options: any,\n load_callback: () => void\n ) {\n if (simulation_mode == \"data-only\") {\n load_callback();\n this.simulate_data_only(trial, simulation_options);\n }\n if (simulation_mode == \"visual\") {\n this.simulate_visual(trial, simulation_options, load_callback);\n }\n }\n\n private create_simulation_data(trial: TrialType<Info>, simulation_options) {\n const default_data = {\n stimulus: trial.stimulus,\n rt: this.jsPsych.randomization.sampleExGaussian(500, 50, 1 / 150, true),\n response: this.jsPsych.pluginAPI.getValidKey(trial.choices),\n };\n\n const data = this.jsPsych.pluginAPI.mergeSimulationData(default_data, simulation_options);\n\n this.jsPsych.pluginAPI.ensureSimulationDataConsistency(trial, data);\n\n return data;\n }\n\n private simulate_data_only(trial: TrialType<Info>, simulation_options) {\n const data = this.create_simulation_data(trial, simulation_options);\n\n this.jsPsych.finishTrial(data);\n }\n\n private simulate_visual(trial: TrialType<Info>, simulation_options, load_callback: () => void) {\n const data = this.create_simulation_data(trial, simulation_options);\n\n const display_element = this.jsPsych.getDisplayElement();\n\n this.trial(display_element, trial);\n load_callback();\n\n if (data.rt !== null) {\n this.jsPsych.pluginAPI.pressKey(data.response, data.rt);\n }\n }\n}\n\nexport default HtmlKeyboardResponsePlugin;\n"],"names":["info","name","parameters","stimulus","type","ParameterType","HTML_STRING","pretty_name","default","undefined","choices","KEYS","prompt","stimulus_duration","INT","trial_duration","response_ends_trial","BOOL","HtmlKeyboardResponsePlugin","jsPsych","_classCallCheck","this","display_element","trial","_this","new_html","innerHTML","response","rt","key","end_trial","pluginAPI","clearAllTimeouts","keyboardListener","cancelKeyboardResponse","trial_data","finishTrial","getKeyboardResponse","callback_function","querySelector","className","valid_responses","rt_method","persist","allow_held_key","setTimeout","style","visibility","value","simulation_mode","simulation_options","load_callback","simulate_data_only","simulate_visual","default_data","randomization","sampleExGaussian","getValidKey","data","mergeSimulationData","ensureSimulationDataConsistency","create_simulation_data","getDisplayElement","pressKey"],"mappings":"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"}
1
+ {"version":3,"file":"index.browser.min.js","sources":["../src/index.ts"],"sourcesContent":["import { JsPsych, JsPsychPlugin, ParameterType, TrialType } from \"jspsych\";\n\nconst info = <const>{\n name: \"html-keyboard-response\",\n parameters: {\n /**\n * The HTML string to be displayed.\n */\n stimulus: {\n type: ParameterType.HTML_STRING,\n pretty_name: \"Stimulus\",\n default: undefined,\n },\n /**\n * Array containing the key(s) the subject is allowed to press to respond to the stimulus.\n */\n choices: {\n type: ParameterType.KEYS,\n pretty_name: \"Choices\",\n default: \"ALL_KEYS\",\n },\n /**\n * Any content here will be displayed below the stimulus.\n */\n prompt: {\n type: ParameterType.HTML_STRING,\n pretty_name: \"Prompt\",\n default: null,\n },\n /**\n * How long to show the stimulus.\n */\n stimulus_duration: {\n type: ParameterType.INT,\n pretty_name: \"Stimulus duration\",\n default: null,\n },\n /**\n * How long to show trial before it ends.\n */\n trial_duration: {\n type: ParameterType.INT,\n pretty_name: \"Trial duration\",\n default: null,\n },\n /**\n * If true, trial will end when subject makes a response.\n */\n response_ends_trial: {\n type: ParameterType.BOOL,\n pretty_name: \"Response ends trial\",\n default: true,\n },\n },\n};\n\ntype Info = typeof info;\n\n/**\n * **html-keyboard-response**\n *\n * jsPsych plugin for displaying a stimulus and getting a keyboard response\n *\n * @author Josh de Leeuw\n * @see {@link https://www.jspsych.org/plugins/jspsych-html-keyboard-response/ html-keyboard-response plugin documentation on jspsych.org}\n */\nclass HtmlKeyboardResponsePlugin implements JsPsychPlugin<Info> {\n static info = info;\n\n constructor(private jsPsych: JsPsych) {}\n\n trial(display_element: HTMLElement, trial: TrialType<Info>) {\n var new_html = '<div id=\"jspsych-html-keyboard-response-stimulus\">' + trial.stimulus + \"</div>\";\n\n // add prompt\n if (trial.prompt !== null) {\n new_html += trial.prompt;\n }\n\n // draw\n display_element.innerHTML = new_html;\n\n // store response\n var response = {\n rt: null,\n key: null,\n };\n\n // function to end trial when it is time\n const end_trial = () => {\n // kill any remaining setTimeout handlers\n this.jsPsych.pluginAPI.clearAllTimeouts();\n\n // kill keyboard listeners\n if (typeof keyboardListener !== \"undefined\") {\n this.jsPsych.pluginAPI.cancelKeyboardResponse(keyboardListener);\n }\n\n // gather the data to store for the trial\n var trial_data = {\n rt: response.rt,\n stimulus: trial.stimulus,\n response: response.key,\n };\n\n // clear the display\n display_element.innerHTML = \"\";\n\n // move on to the next trial\n this.jsPsych.finishTrial(trial_data);\n };\n\n // function to handle responses by the subject\n var after_response = (info) => {\n // after a valid response, the stimulus will have the CSS class 'responded'\n // which can be used to provide visual feedback that a response was recorded\n display_element.querySelector(\"#jspsych-html-keyboard-response-stimulus\").className +=\n \" responded\";\n\n // only record the first response\n if (response.key == null) {\n response = info;\n }\n\n if (trial.response_ends_trial) {\n end_trial();\n }\n };\n\n // start the response listener\n if (trial.choices != \"NO_KEYS\") {\n var keyboardListener = this.jsPsych.pluginAPI.getKeyboardResponse({\n callback_function: after_response,\n valid_responses: trial.choices,\n rt_method: \"performance\",\n persist: false,\n allow_held_key: false,\n });\n }\n\n // hide stimulus if stimulus_duration is set\n if (trial.stimulus_duration !== null) {\n this.jsPsych.pluginAPI.setTimeout(() => {\n display_element.querySelector<HTMLElement>(\n \"#jspsych-html-keyboard-response-stimulus\"\n ).style.visibility = \"hidden\";\n }, trial.stimulus_duration);\n }\n\n // end trial if trial_duration is set\n if (trial.trial_duration !== null) {\n this.jsPsych.pluginAPI.setTimeout(end_trial, trial.trial_duration);\n }\n }\n\n simulate(\n trial: TrialType<Info>,\n simulation_mode,\n simulation_options: any,\n load_callback: () => void\n ) {\n if (simulation_mode == \"data-only\") {\n load_callback();\n this.simulate_data_only(trial, simulation_options);\n }\n if (simulation_mode == \"visual\") {\n this.simulate_visual(trial, simulation_options, load_callback);\n }\n }\n\n private create_simulation_data(trial: TrialType<Info>, simulation_options) {\n const default_data = {\n stimulus: trial.stimulus,\n rt: this.jsPsych.randomization.sampleExGaussian(500, 50, 1 / 150, true),\n response: this.jsPsych.pluginAPI.getValidKey(trial.choices),\n };\n\n const data = this.jsPsych.pluginAPI.mergeSimulationData(default_data, simulation_options);\n\n this.jsPsych.pluginAPI.ensureSimulationDataConsistency(trial, data);\n\n return data;\n }\n\n private simulate_data_only(trial: TrialType<Info>, simulation_options) {\n const data = this.create_simulation_data(trial, simulation_options);\n\n this.jsPsych.finishTrial(data);\n }\n\n private simulate_visual(trial: TrialType<Info>, simulation_options, load_callback: () => void) {\n const data = this.create_simulation_data(trial, simulation_options);\n\n const display_element = this.jsPsych.getDisplayElement();\n\n this.trial(display_element, trial);\n load_callback();\n\n if (data.rt !== null) {\n this.jsPsych.pluginAPI.pressKey(data.response, data.rt);\n }\n }\n}\n\nexport default HtmlKeyboardResponsePlugin;\n"],"names":["info","name","parameters","stimulus","type","ParameterType","HTML_STRING","pretty_name","default","undefined","choices","KEYS","prompt","stimulus_duration","INT","trial_duration","response_ends_trial","BOOL","HtmlKeyboardResponsePlugin","jsPsych","_classCallCheck","this","key","value","display_element","trial","_this","new_html","innerHTML","response","rt","end_trial","pluginAPI","clearAllTimeouts","keyboardListener","cancelKeyboardResponse","trial_data","finishTrial","getKeyboardResponse","callback_function","querySelector","className","valid_responses","rt_method","persist","allow_held_key","setTimeout","style","visibility","simulation_mode","simulation_options","load_callback","simulate_data_only","simulate_visual","default_data","randomization","sampleExGaussian","getValidKey","data","mergeSimulationData","ensureSimulationDataConsistency","create_simulation_data","getDisplayElement","pressKey"],"mappings":"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"}