@jspsych/plugin-image-keyboard-response 1.1.3 → 2.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.
- package/dist/index.browser.js +248 -262
- package/dist/index.browser.js.map +1 -1
- package/dist/index.browser.min.js +2 -2
- package/dist/index.browser.min.js.map +1 -1
- package/dist/index.cjs +247 -261
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.ts +93 -47
- package/dist/index.js +247 -261
- package/dist/index.js.map +1 -1
- package/package.json +3 -3
- package/src/index.spec.ts +5 -5
- package/src/index.ts +51 -30
package/dist/index.d.ts
CHANGED
|
@@ -1,150 +1,195 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { JsPsychPlugin, ParameterType, JsPsych, TrialType } from 'jspsych';
|
|
2
|
+
|
|
2
3
|
declare const info: {
|
|
3
4
|
readonly name: "image-keyboard-response";
|
|
5
|
+
readonly version: string;
|
|
4
6
|
readonly parameters: {
|
|
5
|
-
/** The image to be displayed */
|
|
7
|
+
/** The path of the image file to be displayed. */
|
|
6
8
|
readonly stimulus: {
|
|
7
9
|
readonly type: ParameterType.IMAGE;
|
|
8
|
-
readonly pretty_name: "Stimulus";
|
|
9
10
|
readonly default: any;
|
|
10
11
|
};
|
|
11
|
-
/** Set the image
|
|
12
|
+
/** Set the height of the image in pixels. If left null (no value specified), then the image will display at its natural height. */
|
|
12
13
|
readonly stimulus_height: {
|
|
13
14
|
readonly type: ParameterType.INT;
|
|
14
|
-
readonly pretty_name: "Image height";
|
|
15
15
|
readonly default: any;
|
|
16
16
|
};
|
|
17
|
-
/** Set the image
|
|
17
|
+
/** Set the width of the image in pixels. If left null (no value specified), then the image will display at its natural width. */
|
|
18
18
|
readonly stimulus_width: {
|
|
19
19
|
readonly type: ParameterType.INT;
|
|
20
|
-
readonly pretty_name: "Image width";
|
|
21
20
|
readonly default: any;
|
|
22
21
|
};
|
|
23
|
-
/**
|
|
22
|
+
/** If setting *only* the width or *only* the height and this parameter is true, then the other dimension will be scaled
|
|
23
|
+
* to maintain the image's aspect ratio. */
|
|
24
24
|
readonly maintain_aspect_ratio: {
|
|
25
25
|
readonly type: ParameterType.BOOL;
|
|
26
|
-
readonly pretty_name: "Maintain aspect ratio";
|
|
27
26
|
readonly default: true;
|
|
28
27
|
};
|
|
29
|
-
/**
|
|
28
|
+
/**his array contains the key(s) that the participant is allowed to press in order to respond to the stimulus. Keys should
|
|
29
|
+
* be specified as characters (e.g., `'a'`, `'q'`, `' '`, `'Enter'`, `'ArrowDown'`) - see
|
|
30
|
+
* [this page](https://developer.mozilla.org/en-US/docs/Web/API/KeyboardEvent/key/Key_Values) and
|
|
31
|
+
* [this page (event.key column)](https://www.freecodecamp.org/news/javascript-keycode-list-keypress-event-key-codes/)
|
|
32
|
+
* for more examples. Any key presses that are not listed in the array will be ignored. The default value of `"ALL_KEYS"`
|
|
33
|
+
* means that all keys will be accepted as valid responses. Specifying `"NO_KEYS"` will mean that no responses are allowed. */
|
|
30
34
|
readonly choices: {
|
|
31
35
|
readonly type: ParameterType.KEYS;
|
|
32
|
-
readonly pretty_name: "Choices";
|
|
33
36
|
readonly default: "ALL_KEYS";
|
|
34
37
|
};
|
|
35
|
-
/** Any content here will be displayed below the stimulus.
|
|
38
|
+
/**This string can contain HTML markup. Any content here will be displayed below the stimulus. The intention is that it can
|
|
39
|
+
* be used to provide a reminder about the action the participant is supposed to take (e.g., which key to press). */
|
|
36
40
|
readonly prompt: {
|
|
37
41
|
readonly type: ParameterType.HTML_STRING;
|
|
38
|
-
readonly pretty_name: "Prompt";
|
|
39
42
|
readonly default: any;
|
|
40
43
|
};
|
|
41
|
-
/** How long to show the stimulus.
|
|
44
|
+
/** How long to show the stimulus for in milliseconds. If the value is `null`, then the stimulus will be shown until the
|
|
45
|
+
* participant makes a response. */
|
|
42
46
|
readonly stimulus_duration: {
|
|
43
47
|
readonly type: ParameterType.INT;
|
|
44
|
-
readonly pretty_name: "Stimulus duration";
|
|
45
48
|
readonly default: any;
|
|
46
49
|
};
|
|
47
|
-
/** How long to
|
|
50
|
+
/** How long to wait for the participant to make a response before ending the trial in milliseconds. If the participant
|
|
51
|
+
* fails to make a response before this timer is reached, the participant's response will be recorded as null for the
|
|
52
|
+
* trial and the trial will end. If the value of this parameter is `null`, then the trial will wait for a response indefinitely. */
|
|
48
53
|
readonly trial_duration: {
|
|
49
54
|
readonly type: ParameterType.INT;
|
|
50
|
-
readonly pretty_name: "Trial duration";
|
|
51
55
|
readonly default: any;
|
|
52
56
|
};
|
|
53
|
-
/** If true, trial will end
|
|
57
|
+
/** If true, then the trial will end whenever the participant makes a response (assuming they make their response before
|
|
58
|
+
* the cutoff specified by the `trial_duration` parameter). If false, then the trial will continue until the value for
|
|
59
|
+
* `trial_duration` is reached. You can set this parameter to `false` to force the participant to view a stimulus for a
|
|
60
|
+
* fixed amount of time, even if they respond before the time is complete. */
|
|
54
61
|
readonly response_ends_trial: {
|
|
55
62
|
readonly type: ParameterType.BOOL;
|
|
56
|
-
readonly pretty_name: "Response ends trial";
|
|
57
63
|
readonly default: true;
|
|
58
64
|
};
|
|
59
65
|
/**
|
|
60
|
-
* If true
|
|
61
|
-
* If false
|
|
66
|
+
* If `true`, the image will be drawn onto a canvas element. This prevents a blank screen (white flash) between consecutive image trials in some browsers, like Firefox and Edge.
|
|
67
|
+
* If `false`, the image will be shown via an img element, as in previous versions of jsPsych. If the stimulus is an **animated gif**, you must set this parameter to false, because the canvas rendering method will only present static images.
|
|
62
68
|
*/
|
|
63
69
|
readonly render_on_canvas: {
|
|
64
70
|
readonly type: ParameterType.BOOL;
|
|
65
|
-
readonly pretty_name: "Render on canvas";
|
|
66
71
|
readonly default: true;
|
|
67
72
|
};
|
|
68
73
|
};
|
|
74
|
+
readonly data: {
|
|
75
|
+
/** The path of the image that was displayed. */
|
|
76
|
+
readonly stimulus: {
|
|
77
|
+
readonly type: ParameterType.STRING;
|
|
78
|
+
};
|
|
79
|
+
/** Indicates which key the participant pressed. */
|
|
80
|
+
readonly response: {
|
|
81
|
+
readonly type: ParameterType.STRING;
|
|
82
|
+
};
|
|
83
|
+
/** The response time in milliseconds for the participant to make a response. The time is measured from when the stimulus
|
|
84
|
+
* first appears on the screen until the participant's response. */
|
|
85
|
+
readonly rt: {
|
|
86
|
+
readonly type: ParameterType.INT;
|
|
87
|
+
};
|
|
88
|
+
};
|
|
89
|
+
readonly citations: "__CITATIONS__";
|
|
69
90
|
};
|
|
70
91
|
type Info = typeof info;
|
|
71
92
|
/**
|
|
72
|
-
*
|
|
93
|
+
* This plugin displays an image and records responses generated with the keyboard. The stimulus can be displayed until a
|
|
94
|
+
* response is given, or for a pre-determined amount of time. The trial can be ended automatically if the participant has
|
|
95
|
+
* failed to respond within a fixed length of time.
|
|
73
96
|
*
|
|
74
|
-
*
|
|
97
|
+
* Image files can be automatically preloaded by jsPsych using the [`preload` plugin](preload.md). However, if you are using
|
|
98
|
+
* timeline variables or another dynamic method to specify the image stimulus, you will need to
|
|
99
|
+
* [manually preload](../overview/media-preloading.md#manual-preloading) the images.
|
|
75
100
|
*
|
|
76
101
|
* @author Josh de Leeuw
|
|
77
|
-
* @see {@link https://www.jspsych.org/plugins/
|
|
102
|
+
* @see {@link https://www.jspsych.org/latest/plugins/image-keyboard-response/ image-keyboard-response plugin documentation on jspsych.org}
|
|
78
103
|
*/
|
|
79
104
|
declare class ImageKeyboardResponsePlugin implements JsPsychPlugin<Info> {
|
|
80
105
|
private jsPsych;
|
|
81
106
|
static info: {
|
|
82
107
|
readonly name: "image-keyboard-response";
|
|
108
|
+
readonly version: string;
|
|
83
109
|
readonly parameters: {
|
|
84
|
-
/** The image to be displayed */
|
|
110
|
+
/** The path of the image file to be displayed. */
|
|
85
111
|
readonly stimulus: {
|
|
86
112
|
readonly type: ParameterType.IMAGE;
|
|
87
|
-
readonly pretty_name: "Stimulus";
|
|
88
113
|
readonly default: any;
|
|
89
114
|
};
|
|
90
|
-
/** Set the image
|
|
115
|
+
/** Set the height of the image in pixels. If left null (no value specified), then the image will display at its natural height. */
|
|
91
116
|
readonly stimulus_height: {
|
|
92
117
|
readonly type: ParameterType.INT;
|
|
93
|
-
readonly pretty_name: "Image height";
|
|
94
118
|
readonly default: any;
|
|
95
119
|
};
|
|
96
|
-
/** Set the image
|
|
120
|
+
/** Set the width of the image in pixels. If left null (no value specified), then the image will display at its natural width. */
|
|
97
121
|
readonly stimulus_width: {
|
|
98
122
|
readonly type: ParameterType.INT;
|
|
99
|
-
readonly pretty_name: "Image width";
|
|
100
123
|
readonly default: any;
|
|
101
124
|
};
|
|
102
|
-
/**
|
|
125
|
+
/** If setting *only* the width or *only* the height and this parameter is true, then the other dimension will be scaled
|
|
126
|
+
* to maintain the image's aspect ratio. */
|
|
103
127
|
readonly maintain_aspect_ratio: {
|
|
104
128
|
readonly type: ParameterType.BOOL;
|
|
105
|
-
readonly pretty_name: "Maintain aspect ratio";
|
|
106
129
|
readonly default: true;
|
|
107
130
|
};
|
|
108
|
-
/**
|
|
131
|
+
/**his array contains the key(s) that the participant is allowed to press in order to respond to the stimulus. Keys should
|
|
132
|
+
* be specified as characters (e.g., `'a'`, `'q'`, `' '`, `'Enter'`, `'ArrowDown'`) - see
|
|
133
|
+
* [this page](https://developer.mozilla.org/en-US/docs/Web/API/KeyboardEvent/key/Key_Values) and
|
|
134
|
+
* [this page (event.key column)](https://www.freecodecamp.org/news/javascript-keycode-list-keypress-event-key-codes/)
|
|
135
|
+
* for more examples. Any key presses that are not listed in the array will be ignored. The default value of `"ALL_KEYS"`
|
|
136
|
+
* means that all keys will be accepted as valid responses. Specifying `"NO_KEYS"` will mean that no responses are allowed. */
|
|
109
137
|
readonly choices: {
|
|
110
138
|
readonly type: ParameterType.KEYS;
|
|
111
|
-
readonly pretty_name: "Choices";
|
|
112
139
|
readonly default: "ALL_KEYS";
|
|
113
140
|
};
|
|
114
|
-
/** Any content here will be displayed below the stimulus.
|
|
141
|
+
/**This string can contain HTML markup. Any content here will be displayed below the stimulus. The intention is that it can
|
|
142
|
+
* be used to provide a reminder about the action the participant is supposed to take (e.g., which key to press). */
|
|
115
143
|
readonly prompt: {
|
|
116
144
|
readonly type: ParameterType.HTML_STRING;
|
|
117
|
-
readonly pretty_name: "Prompt";
|
|
118
145
|
readonly default: any;
|
|
119
146
|
};
|
|
120
|
-
/** How long to show the stimulus.
|
|
147
|
+
/** How long to show the stimulus for in milliseconds. If the value is `null`, then the stimulus will be shown until the
|
|
148
|
+
* participant makes a response. */
|
|
121
149
|
readonly stimulus_duration: {
|
|
122
150
|
readonly type: ParameterType.INT;
|
|
123
|
-
readonly pretty_name: "Stimulus duration";
|
|
124
151
|
readonly default: any;
|
|
125
152
|
};
|
|
126
|
-
/** How long to
|
|
153
|
+
/** How long to wait for the participant to make a response before ending the trial in milliseconds. If the participant
|
|
154
|
+
* fails to make a response before this timer is reached, the participant's response will be recorded as null for the
|
|
155
|
+
* trial and the trial will end. If the value of this parameter is `null`, then the trial will wait for a response indefinitely. */
|
|
127
156
|
readonly trial_duration: {
|
|
128
157
|
readonly type: ParameterType.INT;
|
|
129
|
-
readonly pretty_name: "Trial duration";
|
|
130
158
|
readonly default: any;
|
|
131
159
|
};
|
|
132
|
-
/** If true, trial will end
|
|
160
|
+
/** If true, then the trial will end whenever the participant makes a response (assuming they make their response before
|
|
161
|
+
* the cutoff specified by the `trial_duration` parameter). If false, then the trial will continue until the value for
|
|
162
|
+
* `trial_duration` is reached. You can set this parameter to `false` to force the participant to view a stimulus for a
|
|
163
|
+
* fixed amount of time, even if they respond before the time is complete. */
|
|
133
164
|
readonly response_ends_trial: {
|
|
134
165
|
readonly type: ParameterType.BOOL;
|
|
135
|
-
readonly pretty_name: "Response ends trial";
|
|
136
166
|
readonly default: true;
|
|
137
167
|
};
|
|
138
168
|
/**
|
|
139
|
-
* If true
|
|
140
|
-
* If false
|
|
169
|
+
* If `true`, the image will be drawn onto a canvas element. This prevents a blank screen (white flash) between consecutive image trials in some browsers, like Firefox and Edge.
|
|
170
|
+
* If `false`, the image will be shown via an img element, as in previous versions of jsPsych. If the stimulus is an **animated gif**, you must set this parameter to false, because the canvas rendering method will only present static images.
|
|
141
171
|
*/
|
|
142
172
|
readonly render_on_canvas: {
|
|
143
173
|
readonly type: ParameterType.BOOL;
|
|
144
|
-
readonly pretty_name: "Render on canvas";
|
|
145
174
|
readonly default: true;
|
|
146
175
|
};
|
|
147
176
|
};
|
|
177
|
+
readonly data: {
|
|
178
|
+
/** The path of the image that was displayed. */
|
|
179
|
+
readonly stimulus: {
|
|
180
|
+
readonly type: ParameterType.STRING;
|
|
181
|
+
};
|
|
182
|
+
/** Indicates which key the participant pressed. */
|
|
183
|
+
readonly response: {
|
|
184
|
+
readonly type: ParameterType.STRING;
|
|
185
|
+
};
|
|
186
|
+
/** The response time in milliseconds for the participant to make a response. The time is measured from when the stimulus
|
|
187
|
+
* first appears on the screen until the participant's response. */
|
|
188
|
+
readonly rt: {
|
|
189
|
+
readonly type: ParameterType.INT;
|
|
190
|
+
};
|
|
191
|
+
};
|
|
192
|
+
readonly citations: "__CITATIONS__";
|
|
148
193
|
};
|
|
149
194
|
constructor(jsPsych: JsPsych);
|
|
150
195
|
trial(display_element: HTMLElement, trial: TrialType<Info>): void;
|
|
@@ -153,4 +198,5 @@ declare class ImageKeyboardResponsePlugin implements JsPsychPlugin<Info> {
|
|
|
153
198
|
private simulate_visual;
|
|
154
199
|
private create_simulation_data;
|
|
155
200
|
}
|
|
156
|
-
|
|
201
|
+
|
|
202
|
+
export { ImageKeyboardResponsePlugin as default };
|