@jspsych/plugin-html-keyboard-response 1.1.1 → 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 +47 -0
  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 +3 -3
package/dist/index.cjs CHANGED
@@ -2,171 +2,171 @@
2
2
 
3
3
  var jspsych = require('jspsych');
4
4
 
5
- const info = {
6
- name: "html-keyboard-response",
7
- parameters: {
8
- /**
9
- * The HTML string to be displayed.
10
- */
11
- stimulus: {
12
- type: jspsych.ParameterType.HTML_STRING,
13
- pretty_name: "Stimulus",
14
- default: undefined,
15
- },
16
- /**
17
- * Array containing the key(s) the subject is allowed to press to respond to the stimulus.
18
- */
19
- choices: {
20
- type: jspsych.ParameterType.KEYS,
21
- pretty_name: "Choices",
22
- default: "ALL_KEYS",
23
- },
24
- /**
25
- * Any content here will be displayed below the stimulus.
26
- */
27
- prompt: {
28
- type: jspsych.ParameterType.HTML_STRING,
29
- pretty_name: "Prompt",
30
- default: null,
31
- },
32
- /**
33
- * How long to show the stimulus.
34
- */
35
- stimulus_duration: {
36
- type: jspsych.ParameterType.INT,
37
- pretty_name: "Stimulus duration",
38
- default: null,
39
- },
40
- /**
41
- * How long to show trial before it ends.
42
- */
43
- trial_duration: {
44
- type: jspsych.ParameterType.INT,
45
- pretty_name: "Trial duration",
46
- default: null,
47
- },
48
- /**
49
- * If true, trial will end when subject makes a response.
50
- */
51
- response_ends_trial: {
52
- type: jspsych.ParameterType.BOOL,
53
- pretty_name: "Response ends trial",
54
- default: true,
55
- },
56
- },
57
- };
58
- /**
59
- * **html-keyboard-response**
60
- *
61
- * jsPsych plugin for displaying a stimulus and getting a keyboard response
62
- *
63
- * @author Josh de Leeuw
64
- * @see {@link https://www.jspsych.org/plugins/jspsych-html-keyboard-response/ html-keyboard-response plugin documentation on jspsych.org}
65
- */
66
- class HtmlKeyboardResponsePlugin {
67
- constructor(jsPsych) {
68
- this.jsPsych = jsPsych;
69
- }
70
- trial(display_element, trial) {
71
- var new_html = '<div id="jspsych-html-keyboard-response-stimulus">' + trial.stimulus + "</div>";
72
- // add prompt
73
- if (trial.prompt !== null) {
74
- new_html += trial.prompt;
75
- }
76
- // draw
77
- display_element.innerHTML = new_html;
78
- // store response
79
- var response = {
80
- rt: null,
81
- key: null,
82
- };
83
- // function to end trial when it is time
84
- const end_trial = () => {
85
- // kill any remaining setTimeout handlers
86
- this.jsPsych.pluginAPI.clearAllTimeouts();
87
- // kill keyboard listeners
88
- if (typeof keyboardListener !== "undefined") {
89
- this.jsPsych.pluginAPI.cancelKeyboardResponse(keyboardListener);
90
- }
91
- // gather the data to store for the trial
92
- var trial_data = {
93
- rt: response.rt,
94
- stimulus: trial.stimulus,
95
- response: response.key,
96
- };
97
- // clear the display
98
- display_element.innerHTML = "";
99
- // move on to the next trial
100
- this.jsPsych.finishTrial(trial_data);
101
- };
102
- // function to handle responses by the subject
103
- var after_response = (info) => {
104
- // after a valid response, the stimulus will have the CSS class 'responded'
105
- // which can be used to provide visual feedback that a response was recorded
106
- display_element.querySelector("#jspsych-html-keyboard-response-stimulus").className +=
107
- " responded";
108
- // only record the first response
109
- if (response.key == null) {
110
- response = info;
111
- }
112
- if (trial.response_ends_trial) {
113
- end_trial();
114
- }
115
- };
116
- // start the response listener
117
- if (trial.choices != "NO_KEYS") {
118
- var keyboardListener = this.jsPsych.pluginAPI.getKeyboardResponse({
119
- callback_function: after_response,
120
- valid_responses: trial.choices,
121
- rt_method: "performance",
122
- persist: false,
123
- allow_held_key: false,
124
- });
125
- }
126
- // hide stimulus if stimulus_duration is set
127
- if (trial.stimulus_duration !== null) {
128
- this.jsPsych.pluginAPI.setTimeout(() => {
129
- display_element.querySelector("#jspsych-html-keyboard-response-stimulus").style.visibility = "hidden";
130
- }, trial.stimulus_duration);
131
- }
132
- // end trial if trial_duration is set
133
- if (trial.trial_duration !== null) {
134
- this.jsPsych.pluginAPI.setTimeout(end_trial, trial.trial_duration);
135
- }
136
- }
137
- simulate(trial, simulation_mode, simulation_options, load_callback) {
138
- if (simulation_mode == "data-only") {
139
- load_callback();
140
- this.simulate_data_only(trial, simulation_options);
141
- }
142
- if (simulation_mode == "visual") {
143
- this.simulate_visual(trial, simulation_options, load_callback);
144
- }
145
- }
146
- create_simulation_data(trial, simulation_options) {
147
- const default_data = {
148
- stimulus: trial.stimulus,
149
- rt: this.jsPsych.randomization.sampleExGaussian(500, 50, 1 / 150, true),
150
- response: this.jsPsych.pluginAPI.getValidKey(trial.choices),
151
- };
152
- const data = this.jsPsych.pluginAPI.mergeSimulationData(default_data, simulation_options);
153
- this.jsPsych.pluginAPI.ensureSimulationDataConsistency(trial, data);
154
- return data;
155
- }
156
- simulate_data_only(trial, simulation_options) {
157
- const data = this.create_simulation_data(trial, simulation_options);
158
- this.jsPsych.finishTrial(data);
159
- }
160
- simulate_visual(trial, simulation_options, load_callback) {
161
- const data = this.create_simulation_data(trial, simulation_options);
162
- const display_element = this.jsPsych.getDisplayElement();
163
- this.trial(display_element, trial);
164
- load_callback();
165
- if (data.rt !== null) {
166
- this.jsPsych.pluginAPI.pressKey(data.response, data.rt);
167
- }
168
- }
169
- }
5
+ const info = {
6
+ name: "html-keyboard-response",
7
+ parameters: {
8
+ /**
9
+ * The HTML string to be displayed.
10
+ */
11
+ stimulus: {
12
+ type: jspsych.ParameterType.HTML_STRING,
13
+ pretty_name: "Stimulus",
14
+ default: undefined,
15
+ },
16
+ /**
17
+ * Array containing the key(s) the subject is allowed to press to respond to the stimulus.
18
+ */
19
+ choices: {
20
+ type: jspsych.ParameterType.KEYS,
21
+ pretty_name: "Choices",
22
+ default: "ALL_KEYS",
23
+ },
24
+ /**
25
+ * Any content here will be displayed below the stimulus.
26
+ */
27
+ prompt: {
28
+ type: jspsych.ParameterType.HTML_STRING,
29
+ pretty_name: "Prompt",
30
+ default: null,
31
+ },
32
+ /**
33
+ * How long to show the stimulus.
34
+ */
35
+ stimulus_duration: {
36
+ type: jspsych.ParameterType.INT,
37
+ pretty_name: "Stimulus duration",
38
+ default: null,
39
+ },
40
+ /**
41
+ * How long to show trial before it ends.
42
+ */
43
+ trial_duration: {
44
+ type: jspsych.ParameterType.INT,
45
+ pretty_name: "Trial duration",
46
+ default: null,
47
+ },
48
+ /**
49
+ * If true, trial will end when subject makes a response.
50
+ */
51
+ response_ends_trial: {
52
+ type: jspsych.ParameterType.BOOL,
53
+ pretty_name: "Response ends trial",
54
+ default: true,
55
+ },
56
+ },
57
+ };
58
+ /**
59
+ * **html-keyboard-response**
60
+ *
61
+ * jsPsych plugin for displaying a stimulus and getting a keyboard response
62
+ *
63
+ * @author Josh de Leeuw
64
+ * @see {@link https://www.jspsych.org/plugins/jspsych-html-keyboard-response/ html-keyboard-response plugin documentation on jspsych.org}
65
+ */
66
+ class HtmlKeyboardResponsePlugin {
67
+ constructor(jsPsych) {
68
+ this.jsPsych = jsPsych;
69
+ }
70
+ trial(display_element, trial) {
71
+ var new_html = '<div id="jspsych-html-keyboard-response-stimulus">' + trial.stimulus + "</div>";
72
+ // add prompt
73
+ if (trial.prompt !== null) {
74
+ new_html += trial.prompt;
75
+ }
76
+ // draw
77
+ display_element.innerHTML = new_html;
78
+ // store response
79
+ var response = {
80
+ rt: null,
81
+ key: null,
82
+ };
83
+ // function to end trial when it is time
84
+ const end_trial = () => {
85
+ // kill any remaining setTimeout handlers
86
+ this.jsPsych.pluginAPI.clearAllTimeouts();
87
+ // kill keyboard listeners
88
+ if (typeof keyboardListener !== "undefined") {
89
+ this.jsPsych.pluginAPI.cancelKeyboardResponse(keyboardListener);
90
+ }
91
+ // gather the data to store for the trial
92
+ var trial_data = {
93
+ rt: response.rt,
94
+ stimulus: trial.stimulus,
95
+ response: response.key,
96
+ };
97
+ // clear the display
98
+ display_element.innerHTML = "";
99
+ // move on to the next trial
100
+ this.jsPsych.finishTrial(trial_data);
101
+ };
102
+ // function to handle responses by the subject
103
+ var after_response = (info) => {
104
+ // after a valid response, the stimulus will have the CSS class 'responded'
105
+ // which can be used to provide visual feedback that a response was recorded
106
+ display_element.querySelector("#jspsych-html-keyboard-response-stimulus").className +=
107
+ " responded";
108
+ // only record the first response
109
+ if (response.key == null) {
110
+ response = info;
111
+ }
112
+ if (trial.response_ends_trial) {
113
+ end_trial();
114
+ }
115
+ };
116
+ // start the response listener
117
+ if (trial.choices != "NO_KEYS") {
118
+ var keyboardListener = this.jsPsych.pluginAPI.getKeyboardResponse({
119
+ callback_function: after_response,
120
+ valid_responses: trial.choices,
121
+ rt_method: "performance",
122
+ persist: false,
123
+ allow_held_key: false,
124
+ });
125
+ }
126
+ // hide stimulus if stimulus_duration is set
127
+ if (trial.stimulus_duration !== null) {
128
+ this.jsPsych.pluginAPI.setTimeout(() => {
129
+ display_element.querySelector("#jspsych-html-keyboard-response-stimulus").style.visibility = "hidden";
130
+ }, trial.stimulus_duration);
131
+ }
132
+ // end trial if trial_duration is set
133
+ if (trial.trial_duration !== null) {
134
+ this.jsPsych.pluginAPI.setTimeout(end_trial, trial.trial_duration);
135
+ }
136
+ }
137
+ simulate(trial, simulation_mode, simulation_options, load_callback) {
138
+ if (simulation_mode == "data-only") {
139
+ load_callback();
140
+ this.simulate_data_only(trial, simulation_options);
141
+ }
142
+ if (simulation_mode == "visual") {
143
+ this.simulate_visual(trial, simulation_options, load_callback);
144
+ }
145
+ }
146
+ create_simulation_data(trial, simulation_options) {
147
+ const default_data = {
148
+ stimulus: trial.stimulus,
149
+ rt: this.jsPsych.randomization.sampleExGaussian(500, 50, 1 / 150, true),
150
+ response: this.jsPsych.pluginAPI.getValidKey(trial.choices),
151
+ };
152
+ const data = this.jsPsych.pluginAPI.mergeSimulationData(default_data, simulation_options);
153
+ this.jsPsych.pluginAPI.ensureSimulationDataConsistency(trial, data);
154
+ return data;
155
+ }
156
+ simulate_data_only(trial, simulation_options) {
157
+ const data = this.create_simulation_data(trial, simulation_options);
158
+ this.jsPsych.finishTrial(data);
159
+ }
160
+ simulate_visual(trial, simulation_options, load_callback) {
161
+ const data = this.create_simulation_data(trial, simulation_options);
162
+ const display_element = this.jsPsych.getDisplayElement();
163
+ this.trial(display_element, trial);
164
+ load_callback();
165
+ if (data.rt !== null) {
166
+ this.jsPsych.pluginAPI.pressKey(data.response, data.rt);
167
+ }
168
+ }
169
+ }
170
170
  HtmlKeyboardResponsePlugin.info = info;
171
171
 
172
172
  module.exports = HtmlKeyboardResponsePlugin;
package/dist/index.d.ts CHANGED
@@ -1,126 +1,126 @@
1
- import { JsPsych, JsPsychPlugin, ParameterType, TrialType } from "jspsych";
2
- declare const info: {
3
- readonly name: "html-keyboard-response";
4
- readonly parameters: {
5
- /**
6
- * The HTML string to be displayed.
7
- */
8
- readonly stimulus: {
9
- readonly type: ParameterType.HTML_STRING;
10
- readonly pretty_name: "Stimulus";
11
- readonly default: any;
12
- };
13
- /**
14
- * Array containing the key(s) the subject is allowed to press to respond to the stimulus.
15
- */
16
- readonly choices: {
17
- readonly type: ParameterType.KEYS;
18
- readonly pretty_name: "Choices";
19
- readonly default: "ALL_KEYS";
20
- };
21
- /**
22
- * Any content here will be displayed below the stimulus.
23
- */
24
- readonly prompt: {
25
- readonly type: ParameterType.HTML_STRING;
26
- readonly pretty_name: "Prompt";
27
- readonly default: any;
28
- };
29
- /**
30
- * How long to show the stimulus.
31
- */
32
- readonly stimulus_duration: {
33
- readonly type: ParameterType.INT;
34
- readonly pretty_name: "Stimulus duration";
35
- readonly default: any;
36
- };
37
- /**
38
- * How long to show trial before it ends.
39
- */
40
- readonly trial_duration: {
41
- readonly type: ParameterType.INT;
42
- readonly pretty_name: "Trial duration";
43
- readonly default: any;
44
- };
45
- /**
46
- * If true, trial will end when subject makes a response.
47
- */
48
- readonly response_ends_trial: {
49
- readonly type: ParameterType.BOOL;
50
- readonly pretty_name: "Response ends trial";
51
- readonly default: true;
52
- };
53
- };
54
- };
55
- declare type Info = typeof info;
56
- /**
57
- * **html-keyboard-response**
58
- *
59
- * jsPsych plugin for displaying a stimulus and getting a keyboard response
60
- *
61
- * @author Josh de Leeuw
62
- * @see {@link https://www.jspsych.org/plugins/jspsych-html-keyboard-response/ html-keyboard-response plugin documentation on jspsych.org}
63
- */
64
- declare class HtmlKeyboardResponsePlugin implements JsPsychPlugin<Info> {
65
- private jsPsych;
66
- static info: {
67
- readonly name: "html-keyboard-response";
68
- readonly parameters: {
69
- /**
70
- * The HTML string to be displayed.
71
- */
72
- readonly stimulus: {
73
- readonly type: ParameterType.HTML_STRING;
74
- readonly pretty_name: "Stimulus";
75
- readonly default: any;
76
- };
77
- /**
78
- * Array containing the key(s) the subject is allowed to press to respond to the stimulus.
79
- */
80
- readonly choices: {
81
- readonly type: ParameterType.KEYS;
82
- readonly pretty_name: "Choices";
83
- readonly default: "ALL_KEYS";
84
- };
85
- /**
86
- * Any content here will be displayed below the stimulus.
87
- */
88
- readonly prompt: {
89
- readonly type: ParameterType.HTML_STRING;
90
- readonly pretty_name: "Prompt";
91
- readonly default: any;
92
- };
93
- /**
94
- * How long to show the stimulus.
95
- */
96
- readonly stimulus_duration: {
97
- readonly type: ParameterType.INT;
98
- readonly pretty_name: "Stimulus duration";
99
- readonly default: any;
100
- };
101
- /**
102
- * How long to show trial before it ends.
103
- */
104
- readonly trial_duration: {
105
- readonly type: ParameterType.INT;
106
- readonly pretty_name: "Trial duration";
107
- readonly default: any;
108
- };
109
- /**
110
- * If true, trial will end when subject makes a response.
111
- */
112
- readonly response_ends_trial: {
113
- readonly type: ParameterType.BOOL;
114
- readonly pretty_name: "Response ends trial";
115
- readonly default: true;
116
- };
117
- };
118
- };
119
- constructor(jsPsych: JsPsych);
120
- trial(display_element: HTMLElement, trial: TrialType<Info>): void;
121
- simulate(trial: TrialType<Info>, simulation_mode: any, simulation_options: any, load_callback: () => void): void;
122
- private create_simulation_data;
123
- private simulate_data_only;
124
- private simulate_visual;
125
- }
126
- export default HtmlKeyboardResponsePlugin;
1
+ import { JsPsych, JsPsychPlugin, ParameterType, TrialType } from "jspsych";
2
+ declare const info: {
3
+ readonly name: "html-keyboard-response";
4
+ readonly parameters: {
5
+ /**
6
+ * The HTML string to be displayed.
7
+ */
8
+ readonly stimulus: {
9
+ readonly type: ParameterType.HTML_STRING;
10
+ readonly pretty_name: "Stimulus";
11
+ readonly default: any;
12
+ };
13
+ /**
14
+ * Array containing the key(s) the subject is allowed to press to respond to the stimulus.
15
+ */
16
+ readonly choices: {
17
+ readonly type: ParameterType.KEYS;
18
+ readonly pretty_name: "Choices";
19
+ readonly default: "ALL_KEYS";
20
+ };
21
+ /**
22
+ * Any content here will be displayed below the stimulus.
23
+ */
24
+ readonly prompt: {
25
+ readonly type: ParameterType.HTML_STRING;
26
+ readonly pretty_name: "Prompt";
27
+ readonly default: any;
28
+ };
29
+ /**
30
+ * How long to show the stimulus.
31
+ */
32
+ readonly stimulus_duration: {
33
+ readonly type: ParameterType.INT;
34
+ readonly pretty_name: "Stimulus duration";
35
+ readonly default: any;
36
+ };
37
+ /**
38
+ * How long to show trial before it ends.
39
+ */
40
+ readonly trial_duration: {
41
+ readonly type: ParameterType.INT;
42
+ readonly pretty_name: "Trial duration";
43
+ readonly default: any;
44
+ };
45
+ /**
46
+ * If true, trial will end when subject makes a response.
47
+ */
48
+ readonly response_ends_trial: {
49
+ readonly type: ParameterType.BOOL;
50
+ readonly pretty_name: "Response ends trial";
51
+ readonly default: true;
52
+ };
53
+ };
54
+ };
55
+ type Info = typeof info;
56
+ /**
57
+ * **html-keyboard-response**
58
+ *
59
+ * jsPsych plugin for displaying a stimulus and getting a keyboard response
60
+ *
61
+ * @author Josh de Leeuw
62
+ * @see {@link https://www.jspsych.org/plugins/jspsych-html-keyboard-response/ html-keyboard-response plugin documentation on jspsych.org}
63
+ */
64
+ declare class HtmlKeyboardResponsePlugin implements JsPsychPlugin<Info> {
65
+ private jsPsych;
66
+ static info: {
67
+ readonly name: "html-keyboard-response";
68
+ readonly parameters: {
69
+ /**
70
+ * The HTML string to be displayed.
71
+ */
72
+ readonly stimulus: {
73
+ readonly type: ParameterType.HTML_STRING;
74
+ readonly pretty_name: "Stimulus";
75
+ readonly default: any;
76
+ };
77
+ /**
78
+ * Array containing the key(s) the subject is allowed to press to respond to the stimulus.
79
+ */
80
+ readonly choices: {
81
+ readonly type: ParameterType.KEYS;
82
+ readonly pretty_name: "Choices";
83
+ readonly default: "ALL_KEYS";
84
+ };
85
+ /**
86
+ * Any content here will be displayed below the stimulus.
87
+ */
88
+ readonly prompt: {
89
+ readonly type: ParameterType.HTML_STRING;
90
+ readonly pretty_name: "Prompt";
91
+ readonly default: any;
92
+ };
93
+ /**
94
+ * How long to show the stimulus.
95
+ */
96
+ readonly stimulus_duration: {
97
+ readonly type: ParameterType.INT;
98
+ readonly pretty_name: "Stimulus duration";
99
+ readonly default: any;
100
+ };
101
+ /**
102
+ * How long to show trial before it ends.
103
+ */
104
+ readonly trial_duration: {
105
+ readonly type: ParameterType.INT;
106
+ readonly pretty_name: "Trial duration";
107
+ readonly default: any;
108
+ };
109
+ /**
110
+ * If true, trial will end when subject makes a response.
111
+ */
112
+ readonly response_ends_trial: {
113
+ readonly type: ParameterType.BOOL;
114
+ readonly pretty_name: "Response ends trial";
115
+ readonly default: true;
116
+ };
117
+ };
118
+ };
119
+ constructor(jsPsych: JsPsych);
120
+ trial(display_element: HTMLElement, trial: TrialType<Info>): void;
121
+ simulate(trial: TrialType<Info>, simulation_mode: any, simulation_options: any, load_callback: () => void): void;
122
+ private create_simulation_data;
123
+ private simulate_data_only;
124
+ private simulate_visual;
125
+ }
126
+ export default HtmlKeyboardResponsePlugin;