@jspsych/plugin-video-keyboard-response 2.1.0 → 2.1.1

package/dist/index.browser.js

@@ -1,7 +1,7 @@
 var jsPsychVideoKeyboardResponse = (function (jspsych) {
   'use strict';
 
-  var version = "2.1.0";
+  var version = "2.1.1";
 
   const info = {
     name: "video-keyboard-response",
@@ -26,13 +26,17 @@ var jsPsychVideoKeyboardResponse = (function (jspsych) {
         pretty_name: "Prompt",
         default: null
       },
-      /** The width of the video in pixels. */
+      /** The width of the video display in pixels. If `null`, the video will take the original video's dimensions, 
+       * or properly scaled with the aspect ratio if the height is also specified.
+       */
       width: {
         type: jspsych.ParameterType.INT,
         pretty_name: "Width",
         default: ""
       },
-      /** The height of the video display in pixels. */
+      /** The height of the video display in pixels. If `null`, the video will take the original video's dimensions,
+       * or properly scaled with the aspect ratio if the width is also specified.
+       */
       height: {
         type: jspsych.ParameterType.INT,
         pretty_name: "Height",
@@ -100,7 +104,7 @@ var jsPsychVideoKeyboardResponse = (function (jspsych) {
       },
       /** The response time in milliseconds for the participant to make a response. The time is measured from when the
        * stimulus first appears on the screen until the participant's response.
-       * */
+       */
       rt: {
         type: jspsych.ParameterType.INT
       },
@@ -124,12 +128,6 @@ var jsPsychVideoKeyboardResponse = (function (jspsych) {
       this.info = info;
     }
     trial(display_element, trial) {
-      if (!Array.isArray(trial.stimulus)) {
-        throw new Error(`
-        The stimulus property for the video-keyboard-response plugin must be an array
-        of files. See https://www.jspsych.org/latest/plugins/video-keyboard-response/#parameters
-      `);
-      }
       var video_html = "<div>";
       video_html += '<video id="jspsych-video-keyboard-response-stimulus"';
       if (trial.width) {
@@ -322,4 +320,4 @@ var jsPsychVideoKeyboardResponse = (function (jspsych) {
   return VideoKeyboardResponsePlugin;
 
 })(jsPsychModule);
-//# sourceMappingURL=https://unpkg.com/@jspsych/plugin-video-keyboard-response@2.1.0/dist/index.browser.js.map
+//# sourceMappingURL=https://unpkg.com/@jspsych/plugin-video-keyboard-response@2.1.1/dist/index.browser.js.map

package/dist/index.browser.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.browser.js","sources":["../package.json","../src/index.ts"],"sourcesContent":["{\n  \"name\": \"@jspsych/plugin-video-keyboard-response\",\n  \"version\": \"2.1.0\",\n  \"description\": \"jsPsych plugin for playing a video file and getting a keyboard response\",\n  \"type\": \"module\",\n  \"main\": \"dist/index.cjs\",\n  \"exports\": {\n    \"import\": \"./dist/index.js\",\n    \"require\": \"./dist/index.cjs\"\n  },\n  \"typings\": \"dist/index.d.ts\",\n  \"unpkg\": \"dist/index.browser.min.js\",\n  \"files\": [\n    \"src\",\n    \"dist\"\n  ],\n  \"source\": \"src/index.ts\",\n  \"scripts\": {\n    \"test\": \"jest --passWithNoTests\",\n    \"test:watch\": \"npm test -- --watch\",\n    \"tsc\": \"tsc\",\n    \"build\": \"rollup --config\",\n    \"build:watch\": \"npm run build -- --watch\"\n  },\n  \"repository\": {\n    \"type\": \"git\",\n    \"url\": \"git+https://github.com/jspsych/jsPsych.git\",\n    \"directory\": \"packages/plugin-video-keyboard-response\"\n  },\n  \"author\": \"Josh de Leeuw\",\n  \"license\": \"MIT\",\n  \"bugs\": {\n    \"url\": \"https://github.com/jspsych/jsPsych/issues\"\n  },\n  \"homepage\": \"https://www.jspsych.org/latest/plugins/video-keyboard-response\",\n  \"peerDependencies\": {\n    \"jspsych\": \">=7.1.0\"\n  },\n  \"devDependencies\": {\n    \"@jspsych/config\": \"^3.2.0\",\n    \"@jspsych/test-utils\": \"^1.2.0\"\n  }\n}\n","import { JsPsych, JsPsychPlugin, ParameterType, TrialType } from \"jspsych\";\n\nimport { version } from \"../package.json\";\n\nconst info = <const>{\n  name: \"video-keyboard-response\",\n  version: version,\n  parameters: {\n    /** Array of the video file(s) to play. Video can be provided in multiple file formats for better cross-browser support. */\n    stimulus: {\n      type: ParameterType.VIDEO,\n      pretty_name: \"Video\",\n      default: undefined,\n      array: true,\n    },\n    /** Array containing the key(s) the subject is allowed to press to respond to the stimulus. */\n    choices: {\n      type: ParameterType.KEYS,\n      pretty_name: \"Choices\",\n      default: \"ALL_KEYS\",\n    },\n    /** Any content here will be displayed below the stimulus. */\n    prompt: {\n      type: ParameterType.HTML_STRING,\n      pretty_name: \"Prompt\",\n      default: null,\n    },\n    /** The width of the video in pixels. */\n    width: {\n      type: ParameterType.INT,\n      pretty_name: \"Width\",\n      default: \"\",\n    },\n    /** The height of the video display in pixels. */\n    height: {\n      type: ParameterType.INT,\n      pretty_name: \"Height\",\n      default: \"\",\n    },\n    /** If true, the video will begin playing as soon as it has loaded. */\n    autoplay: {\n      type: ParameterType.BOOL,\n      pretty_name: \"Autoplay\",\n      default: true,\n    },\n    /** If true, the subject will be able to pause the video or move the playback to any point in the video. */\n    controls: {\n      type: ParameterType.BOOL,\n      pretty_name: \"Controls\",\n      default: false,\n    },\n    /** Time to start the clip. If null (default), video will start at the beginning of the file. */\n    start: {\n      type: ParameterType.FLOAT,\n      pretty_name: \"Start\",\n      default: null,\n    },\n    /** Time to stop the clip. If null (default), video will stop at the end of the file. */\n    stop: {\n      type: ParameterType.FLOAT,\n      pretty_name: \"Stop\",\n      default: null,\n    },\n    /** The playback rate of the video. 1 is normal, <1 is slower, >1 is faster. */\n    rate: {\n      type: ParameterType.FLOAT,\n      pretty_name: \"Rate\",\n      default: 1,\n    },\n    /** If true, the trial will end immediately after the video finishes playing. */\n    trial_ends_after_video: {\n      type: ParameterType.BOOL,\n      pretty_name: \"End trial after video finishes\",\n      default: false,\n    },\n    /** How long to show trial before it ends. */\n    trial_duration: {\n      type: ParameterType.INT,\n      pretty_name: \"Trial duration\",\n      default: null,\n    },\n    /** If true, the trial will end when subject makes a response. */\n    response_ends_trial: {\n      type: ParameterType.BOOL,\n      pretty_name: \"Response ends trial\",\n      default: true,\n    },\n    /** If true, then responses are allowed while the video is playing. If false, then the video must finish playing before a response is accepted. */\n    response_allowed_while_playing: {\n      type: ParameterType.BOOL,\n      pretty_name: \"Response allowed while playing\",\n      default: true,\n    },\n  },\n  data: {\n    /** Indicates which key the participant pressed. */\n    response: {\n      type: ParameterType.STRING,\n    },\n    /** The response time in milliseconds for the participant to make a response. The time is measured from when the\n     * stimulus first appears on the screen until the participant's response.\n     * */\n    rt: {\n      type: ParameterType.INT,\n    },\n    /** The `stimulus` array. This will be encoded as a JSON string when data is saved using the `.json()` or `.csv()` functions. */\n    stimulus: {\n      type: ParameterType.STRING,\n      array: true,\n    },\n  },\n  // prettier-ignore\n  citations: '__CITATIONS__',\n};\n\ntype Info = typeof info;\n\n/**\n * This plugin plays a video file and records a keyboard response. The stimulus can be displayed until a response is\n * given, or for a pre-determined amount of time. The trial can be ended automatically when the participant responds,\n * when the video file has finished playing, or if the participant has failed to respond within a fixed length of time.\n * You can also prevent a keyboard response from being recorded before the video has finished playing.\n *\n * Video files can be automatically preloaded by jsPsych using the [`preload` plugin](preload.md). However, if you are\n * using timeline variables or another dynamic method to specify the video stimulus, you will need to\n * [manually preload](../overview/media-preloading.md#manual-preloading) the videos. Also note that video preloading\n * is disabled when the experiment is running as a file (i.e. opened directly in the browser, rather than through a\n * server), in order to prevent CORS errors - see the section on [Running Experiments](../overview/running-experiments.md)\n * for more information.\n *\n * @author Josh de Leeuw\n * @see {@link https://www.jspsych.org/latest/plugins/video-keyboard-response/ video-keyboard-response plugin documentation on jspsych.org}\n */\nclass VideoKeyboardResponsePlugin implements JsPsychPlugin<Info> {\n  static info = info;\n\n  constructor(private jsPsych: JsPsych) {}\n\n  trial(display_element: HTMLElement, trial: TrialType<Info>) {\n    // catch mistake where stimuli are not an array\n    if (!Array.isArray(trial.stimulus)) {\n      throw new Error(`\n        The stimulus property for the video-keyboard-response plugin must be an array\n        of files. See https://www.jspsych.org/latest/plugins/video-keyboard-response/#parameters\n      `);\n    }\n\n    // setup stimulus\n    var video_html = \"<div>\";\n    video_html += '<video id=\"jspsych-video-keyboard-response-stimulus\"';\n\n    if (trial.width) {\n      video_html += ' width=\"' + trial.width + '\"';\n    }\n    if (trial.height) {\n      video_html += ' height=\"' + trial.height + '\"';\n    }\n    if (trial.autoplay && trial.start == null) {\n      // if autoplay is true and the start time is specified, then the video will start automatically\n      // via the play() method, rather than the autoplay attribute, to prevent showing the first frame\n      video_html += \" autoplay \";\n    }\n    if (trial.controls) {\n      video_html += \" controls \";\n    }\n    if (trial.start !== null) {\n      // hide video element when page loads if the start time is specified,\n      // to prevent the video element from showing the first frame\n      video_html += ' style=\"visibility: hidden;\"';\n    }\n    video_html += \">\";\n\n    var video_preload_blob = this.jsPsych.pluginAPI.getVideoBuffer(trial.stimulus[0]);\n    if (!video_preload_blob) {\n      for (var i = 0; i < trial.stimulus.length; i++) {\n        var file_name = trial.stimulus[i];\n        if (file_name.indexOf(\"?\") > -1) {\n          file_name = file_name.substring(0, file_name.indexOf(\"?\"));\n        }\n        var type = file_name.substr(file_name.lastIndexOf(\".\") + 1);\n        type = type.toLowerCase();\n        if (type == \"mov\") {\n          console.warn(\n            \"Warning: video-keyboard-response plugin does not reliably support .mov files.\"\n          );\n        }\n        video_html += '<source src=\"' + file_name + '\" type=\"video/' + type + '\">';\n      }\n    }\n    video_html += \"</video>\";\n    video_html += \"</div>\";\n\n    // add prompt if there is one\n    if (trial.prompt !== null) {\n      video_html += trial.prompt;\n    }\n\n    display_element.innerHTML = video_html;\n\n    var video_element = display_element.querySelector<HTMLVideoElement>(\n      \"#jspsych-video-keyboard-response-stimulus\"\n    );\n\n    if (video_preload_blob) {\n      video_element.src = video_preload_blob;\n    }\n\n    video_element.onended = () => {\n      if (trial.trial_ends_after_video) {\n        end_trial();\n      }\n      if (trial.response_allowed_while_playing == false && !trial.trial_ends_after_video) {\n        // start keyboard listener\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\n    video_element.playbackRate = trial.rate;\n\n    // if video start time is specified, hide the video and set the starting time\n    // before showing and playing, so that the video doesn't automatically show the first frame\n    if (trial.start !== null) {\n      video_element.pause();\n      video_element.onseeked = () => {\n        video_element.style.visibility = \"visible\";\n        video_element.muted = false;\n        if (trial.autoplay) {\n          video_element.play();\n        } else {\n          video_element.pause();\n        }\n        video_element.onseeked = () => {};\n      };\n      video_element.onplaying = () => {\n        video_element.currentTime = trial.start;\n        video_element.onplaying = () => {};\n      };\n      // fix for iOS/MacOS browsers: videos aren't seekable until they start playing, so need to hide/mute, play,\n      // change current time, then show/unmute\n      video_element.muted = true;\n      video_element.play();\n    }\n\n    let stopped = false;\n    if (trial.stop !== null) {\n      video_element.addEventListener(\"timeupdate\", (e) => {\n        var currenttime = video_element.currentTime;\n        if (currenttime >= trial.stop) {\n          if (!trial.response_allowed_while_playing) {\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          video_element.pause();\n          if (trial.trial_ends_after_video && !stopped) {\n            // this is to prevent end_trial from being called twice, because the timeupdate event\n            // can fire in quick succession\n            stopped = true;\n            end_trial();\n          }\n        }\n      });\n    }\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 keyboard listeners\n      this.jsPsych.pluginAPI.cancelAllKeyboardResponses();\n\n      // stop the video file if it is playing\n      // remove end event listeners if they exist\n      display_element\n        .querySelector<HTMLVideoElement>(\"#jspsych-video-keyboard-response-stimulus\")\n        .pause();\n      display_element.querySelector<HTMLVideoElement>(\n        \"#jspsych-video-keyboard-response-stimulus\"\n      ).onended = () => {};\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      // 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-video-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\" && trial.response_allowed_while_playing) {\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    // end trial if time limit 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 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    const video_element = display_element.querySelector<HTMLVideoElement>(\n      \"#jspsych-video-button-response-stimulus\"\n    );\n\n    const respond = () => {\n      if (data.rt !== null) {\n        this.jsPsych.pluginAPI.pressKey(data.response, data.rt);\n      }\n    };\n\n    if (!trial.response_allowed_while_playing) {\n      video_element.addEventListener(\"ended\", respond);\n    } else {\n      respond();\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\nexport default VideoKeyboardResponsePlugin;\n"],"names":[],"mappings":";;;EAEE,IAAW,OAAA,GAAA,OAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IC8GA,SAAA,EAAA;EAAA;;KAAe;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"index.browser.js","sources":["../package.json","../src/index.ts"],"sourcesContent":["{\n  \"name\": \"@jspsych/plugin-video-keyboard-response\",\n  \"version\": \"2.1.1\",\n  \"description\": \"jsPsych plugin for playing a video file and getting a keyboard response\",\n  \"type\": \"module\",\n  \"main\": \"dist/index.cjs\",\n  \"exports\": {\n    \"import\": \"./dist/index.js\",\n    \"require\": \"./dist/index.cjs\"\n  },\n  \"typings\": \"dist/index.d.ts\",\n  \"unpkg\": \"dist/index.browser.min.js\",\n  \"files\": [\n    \"src\",\n    \"dist\"\n  ],\n  \"source\": \"src/index.ts\",\n  \"scripts\": {\n    \"test\": \"jest --passWithNoTests\",\n    \"test:watch\": \"npm test -- --watch\",\n    \"tsc\": \"tsc\",\n    \"build\": \"rollup --config\",\n    \"build:watch\": \"npm run build -- --watch\"\n  },\n  \"repository\": {\n    \"type\": \"git\",\n    \"url\": \"git+https://github.com/jspsych/jsPsych.git\",\n    \"directory\": \"packages/plugin-video-keyboard-response\"\n  },\n  \"author\": \"Josh de Leeuw\",\n  \"license\": \"MIT\",\n  \"bugs\": {\n    \"url\": \"https://github.com/jspsych/jsPsych/issues\"\n  },\n  \"homepage\": \"https://www.jspsych.org/latest/plugins/video-keyboard-response\",\n  \"peerDependencies\": {\n    \"jspsych\": \">=7.1.0\"\n  },\n  \"devDependencies\": {\n    \"@jspsych/config\": \"^3.3.1\",\n    \"@jspsych/test-utils\": \"^1.2.0\"\n  }\n}\n","import { JsPsych, JsPsychPlugin, ParameterType, TrialType } from \"jspsych\";\n\nimport { version } from \"../package.json\";\n\nconst info = <const>{\n  name: \"video-keyboard-response\",\n  version: version,\n  parameters: {\n    /** Array of the video file(s) to play. Video can be provided in multiple file formats for better cross-browser support. */\n    stimulus: {\n      type: ParameterType.VIDEO,\n      pretty_name: \"Video\",\n      default: undefined,\n      array: true,\n    },\n    /** Array containing the key(s) the subject is allowed to press to respond to the stimulus. */\n    choices: {\n      type: ParameterType.KEYS,\n      pretty_name: \"Choices\",\n      default: \"ALL_KEYS\",\n    },\n    /** Any content here will be displayed below the stimulus. */\n    prompt: {\n      type: ParameterType.HTML_STRING,\n      pretty_name: \"Prompt\",\n      default: null,\n    },\n    /** The width of the video display in pixels. If `null`, the video will take the original video's dimensions, \n     * or properly scaled with the aspect ratio if the height is also specified.\n     */\n    width: {\n      type: ParameterType.INT,\n      pretty_name: \"Width\",\n      default: \"\",\n    },\n    /** The height of the video display in pixels. If `null`, the video will take the original video's dimensions,\n     * or properly scaled with the aspect ratio if the width is also specified.\n     */\n    height: {\n      type: ParameterType.INT,\n      pretty_name: \"Height\",\n      default: \"\",\n    },\n    /** If true, the video will begin playing as soon as it has loaded. */\n    autoplay: {\n      type: ParameterType.BOOL,\n      pretty_name: \"Autoplay\",\n      default: true,\n    },\n    /** If true, the subject will be able to pause the video or move the playback to any point in the video. */\n    controls: {\n      type: ParameterType.BOOL,\n      pretty_name: \"Controls\",\n      default: false,\n    },\n    /** Time to start the clip. If null (default), video will start at the beginning of the file. */\n    start: {\n      type: ParameterType.FLOAT,\n      pretty_name: \"Start\",\n      default: null,\n    },\n    /** Time to stop the clip. If null (default), video will stop at the end of the file. */\n    stop: {\n      type: ParameterType.FLOAT,\n      pretty_name: \"Stop\",\n      default: null,\n    },\n    /** The playback rate of the video. 1 is normal, <1 is slower, >1 is faster. */\n    rate: {\n      type: ParameterType.FLOAT,\n      pretty_name: \"Rate\",\n      default: 1,\n    },\n    /** If true, the trial will end immediately after the video finishes playing. */\n    trial_ends_after_video: {\n      type: ParameterType.BOOL,\n      pretty_name: \"End trial after video finishes\",\n      default: false,\n    },\n    /** How long to show trial before it ends. */\n    trial_duration: {\n      type: ParameterType.INT,\n      pretty_name: \"Trial duration\",\n      default: null,\n    },\n    /** If true, the trial will end when subject makes a response. */\n    response_ends_trial: {\n      type: ParameterType.BOOL,\n      pretty_name: \"Response ends trial\",\n      default: true,\n    },\n    /** If true, then responses are allowed while the video is playing. If false, then the video must finish playing before a response is accepted. */\n    response_allowed_while_playing: {\n      type: ParameterType.BOOL,\n      pretty_name: \"Response allowed while playing\",\n      default: true,\n    },\n  },\n  data: {\n    /** Indicates which key the participant pressed. */\n    response: {\n      type: ParameterType.STRING,\n    },\n    /** The response time in milliseconds for the participant to make a response. The time is measured from when the\n     * stimulus first appears on the screen until the participant's response.\n     */\n    rt: {\n      type: ParameterType.INT,\n    },\n    /** The `stimulus` array. This will be encoded as a JSON string when data is saved using the `.json()` or `.csv()` functions. */\n    stimulus: {\n      type: ParameterType.STRING,\n      array: true,\n    },\n  },\n  // prettier-ignore\n  citations: '__CITATIONS__',\n};\n\ntype Info = typeof info;\n\n/**\n * This plugin plays a video file and records a keyboard response. The stimulus can be displayed until a response is\n * given, or for a pre-determined amount of time. The trial can be ended automatically when the participant responds,\n * when the video file has finished playing, or if the participant has failed to respond within a fixed length of time.\n * You can also prevent a keyboard response from being recorded before the video has finished playing.\n *\n * Video files can be automatically preloaded by jsPsych using the [`preload` plugin](preload.md). However, if you are\n * using timeline variables or another dynamic method to specify the video stimulus, you will need to\n * [manually preload](../overview/media-preloading.md#manual-preloading) the videos. Also note that video preloading\n * is disabled when the experiment is running as a file (i.e. opened directly in the browser, rather than through a\n * server), in order to prevent CORS errors - see the section on [Running Experiments](../overview/running-experiments.md)\n * for more information.\n *\n * @author Josh de Leeuw\n * @see {@link https://www.jspsych.org/latest/plugins/video-keyboard-response/ video-keyboard-response plugin documentation on jspsych.org}\n */\nclass VideoKeyboardResponsePlugin implements JsPsychPlugin<Info> {\n  static info = info;\n\n  constructor(private jsPsych: JsPsych) {}\n\n  trial(display_element: HTMLElement, trial: TrialType<Info>) {\n    // setup stimulus\n    var video_html = \"<div>\";\n    video_html += '<video id=\"jspsych-video-keyboard-response-stimulus\"';\n\n    if (trial.width) {\n      video_html += ' width=\"' + trial.width + '\"';\n    }\n    if (trial.height) {\n      video_html += ' height=\"' + trial.height + '\"';\n    }\n    if (trial.autoplay && trial.start == null) {\n      // if autoplay is true and the start time is specified, then the video will start automatically\n      // via the play() method, rather than the autoplay attribute, to prevent showing the first frame\n      video_html += \" autoplay \";\n    }\n    if (trial.controls) {\n      video_html += \" controls \";\n    }\n    if (trial.start !== null) {\n      // hide video element when page loads if the start time is specified,\n      // to prevent the video element from showing the first frame\n      video_html += ' style=\"visibility: hidden;\"';\n    }\n    video_html += \">\";\n\n    var video_preload_blob = this.jsPsych.pluginAPI.getVideoBuffer(trial.stimulus[0]);\n    if (!video_preload_blob) {\n      for (var i = 0; i < trial.stimulus.length; i++) {\n        var file_name = trial.stimulus[i];\n        if (file_name.indexOf(\"?\") > -1) {\n          file_name = file_name.substring(0, file_name.indexOf(\"?\"));\n        }\n        var type = file_name.substr(file_name.lastIndexOf(\".\") + 1);\n        type = type.toLowerCase();\n        if (type == \"mov\") {\n          console.warn(\n            \"Warning: video-keyboard-response plugin does not reliably support .mov files.\"\n          );\n        }\n        video_html += '<source src=\"' + file_name + '\" type=\"video/' + type + '\">';\n      }\n    }\n    video_html += \"</video>\";\n    video_html += \"</div>\";\n\n    // add prompt if there is one\n    if (trial.prompt !== null) {\n      video_html += trial.prompt;\n    }\n\n    display_element.innerHTML = video_html;\n\n    var video_element = display_element.querySelector<HTMLVideoElement>(\n      \"#jspsych-video-keyboard-response-stimulus\"\n    );\n\n    if (video_preload_blob) {\n      video_element.src = video_preload_blob;\n    }\n\n    video_element.onended = () => {\n      if (trial.trial_ends_after_video) {\n        end_trial();\n      }\n      if (trial.response_allowed_while_playing == false && !trial.trial_ends_after_video) {\n        // start keyboard listener\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\n    video_element.playbackRate = trial.rate;\n\n    // if video start time is specified, hide the video and set the starting time\n    // before showing and playing, so that the video doesn't automatically show the first frame\n    if (trial.start !== null) {\n      video_element.pause();\n      video_element.onseeked = () => {\n        video_element.style.visibility = \"visible\";\n        video_element.muted = false;\n        if (trial.autoplay) {\n          video_element.play();\n        } else {\n          video_element.pause();\n        }\n        video_element.onseeked = () => {};\n      };\n      video_element.onplaying = () => {\n        video_element.currentTime = trial.start;\n        video_element.onplaying = () => {};\n      };\n      // fix for iOS/MacOS browsers: videos aren't seekable until they start playing, so need to hide/mute, play,\n      // change current time, then show/unmute\n      video_element.muted = true;\n      video_element.play();\n    }\n\n    let stopped = false;\n    if (trial.stop !== null) {\n      video_element.addEventListener(\"timeupdate\", (e) => {\n        var currenttime = video_element.currentTime;\n        if (currenttime >= trial.stop) {\n          if (!trial.response_allowed_while_playing) {\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          video_element.pause();\n          if (trial.trial_ends_after_video && !stopped) {\n            // this is to prevent end_trial from being called twice, because the timeupdate event\n            // can fire in quick succession\n            stopped = true;\n            end_trial();\n          }\n        }\n      });\n    }\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 keyboard listeners\n      this.jsPsych.pluginAPI.cancelAllKeyboardResponses();\n\n      // stop the video file if it is playing\n      // remove end event listeners if they exist\n      display_element\n        .querySelector<HTMLVideoElement>(\"#jspsych-video-keyboard-response-stimulus\")\n        .pause();\n      display_element.querySelector<HTMLVideoElement>(\n        \"#jspsych-video-keyboard-response-stimulus\"\n      ).onended = () => {};\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      // 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-video-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\" && trial.response_allowed_while_playing) {\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    // end trial if time limit 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 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    const video_element = display_element.querySelector<HTMLVideoElement>(\n      \"#jspsych-video-button-response-stimulus\"\n    );\n\n    const respond = () => {\n      if (data.rt !== null) {\n        this.jsPsych.pluginAPI.pressKey(data.response, data.rt);\n      }\n    };\n\n    if (!trial.response_allowed_while_playing) {\n      video_element.addEventListener(\"ended\", respond);\n    } else {\n      respond();\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\nexport default VideoKeyboardResponsePlugin;\n"],"names":[],"mappings":";;;EAEE,IAAW,OAAA,GAAA,OAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ICkHA,SAAA,EAAA;EAAA;;KAAe;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/index.browser.min.js

@@ -1,5 +1,2 @@
-var jsPsychVideoKeyboardResponse=function(r){"use strict";var c="2.1.0";const _={name:"video-keyboard-response",version:c,parameters:{stimulus:{type:r.ParameterType.VIDEO,pretty_name:"Video",default:void 0,array:!0},choices:{type:r.ParameterType.KEYS,pretty_name:"Choices",default:"ALL_KEYS"},prompt:{type:r.ParameterType.HTML_STRING,pretty_name:"Prompt",default:null},width:{type:r.ParameterType.INT,pretty_name:"Width",default:""},height:{type:r.ParameterType.INT,pretty_name:"Height",default:""},autoplay:{type:r.ParameterType.BOOL,pretty_name:"Autoplay",default:!0},controls:{type:r.ParameterType.BOOL,pretty_name:"Controls",default:!1},start:{type:r.ParameterType.FLOAT,pretty_name:"Start",default:null},stop:{type:r.ParameterType.FLOAT,pretty_name:"Stop",default:null},rate:{type:r.ParameterType.FLOAT,pretty_name:"Rate",default:1},trial_ends_after_video:{type:r.ParameterType.BOOL,pretty_name:"End trial after video finishes",default:!1},trial_duration:{type:r.ParameterType.INT,pretty_name:"Trial duration",default:null},response_ends_trial:{type:r.ParameterType.BOOL,pretty_name:"Response ends trial",default:!0},response_allowed_while_playing:{type:r.ParameterType.BOOL,pretty_name:"Response allowed while playing",default:!0}},data:{response:{type:r.ParameterType.STRING},rt:{type:r.ParameterType.INT},stimulus:{type:r.ParameterType.STRING,array:!0}},citations:{apa:"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://doi.org/10.21105/joss.05351 ",bibtex:'@article{Leeuw2023jsPsych, 	author = {de Leeuw, Joshua R. and Gilbert, Rebecca A. and Luchterhandt, Bj{\\" o}rn}, 	journal = {Journal of Open Source Software}, 	doi = {10.21105/joss.05351}, 	issn = {2475-9066}, 	number = {85}, 	year = {2023}, 	month = {may 11}, 	pages = {5351}, 	publisher = {Open Journals}, 	title = {jsPsych: Enabling an {Open}-{Source} {Collaborative} {Ecosystem} of {Behavioral} {Experiments}}, 	url = {https://joss.theoj.org/papers/10.21105/joss.05351}, 	volume = {8}, }  '}};class m{constructor(s){this.jsPsych=s}trial(s,e){if(!Array.isArray(e.stimulus))throw new Error(`
-        The stimulus property for the video-keyboard-response plugin must be an array
-        of files. See https://www.jspsych.org/latest/plugins/video-keyboard-response/#parameters
-      `);var t="<div>";t+='<video id="jspsych-video-keyboard-response-stimulus"',e.width&&(t+=' width="'+e.width+'"'),e.height&&(t+=' height="'+e.height+'"'),e.autoplay&&e.start==null&&(t+=" autoplay "),e.controls&&(t+=" controls "),e.start!==null&&(t+=' style="visibility: hidden;"'),t+=">";var i=this.jsPsych.pluginAPI.getVideoBuffer(e.stimulus[0]);if(!i)for(var n=0;n<e.stimulus.length;n++){var o=e.stimulus[n];o.indexOf("?")>-1&&(o=o.substring(0,o.indexOf("?")));var l=o.substr(o.lastIndexOf(".")+1);l=l.toLowerCase(),l=="mov"&&console.warn("Warning: video-keyboard-response plugin does not reliably support .mov files."),t+='<source src="'+o+'" type="video/'+l+'">'}t+="</video>",t+="</div>",e.prompt!==null&&(t+=e.prompt),s.innerHTML=t;var a=s.querySelector("#jspsych-video-keyboard-response-stimulus");i&&(a.src=i),a.onended=()=>{if(e.trial_ends_after_video&&d(),e.response_allowed_while_playing==!1&&!e.trial_ends_after_video)var p=this.jsPsych.pluginAPI.getKeyboardResponse({callback_function:y,valid_responses:e.choices,rt_method:"performance",persist:!1,allow_held_key:!1})},a.playbackRate=e.rate,e.start!==null&&(a.pause(),a.onseeked=()=>{a.style.visibility="visible",a.muted=!1,e.autoplay?a.play():a.pause(),a.onseeked=()=>{}},a.onplaying=()=>{a.currentTime=e.start,a.onplaying=()=>{}},a.muted=!0,a.play());let h=!1;e.stop!==null&&a.addEventListener("timeupdate",p=>{var v=a.currentTime;if(v>=e.stop){if(!e.response_allowed_while_playing)var g=this.jsPsych.pluginAPI.getKeyboardResponse({callback_function:y,valid_responses:e.choices,rt_method:"performance",persist:!1,allow_held_key:!1});a.pause(),e.trial_ends_after_video&&!h&&(h=!0,d())}});var u={rt:null,key:null};const d=()=>{this.jsPsych.pluginAPI.cancelAllKeyboardResponses(),s.querySelector("#jspsych-video-keyboard-response-stimulus").pause(),s.querySelector("#jspsych-video-keyboard-response-stimulus").onended=()=>{};var p={rt:u.rt,stimulus:e.stimulus,response:u.key};this.jsPsych.finishTrial(p)};var y=p=>{s.querySelector("#jspsych-video-keyboard-response-stimulus").className+=" responded",u.key==null&&(u=p),e.response_ends_trial&&d()};if(e.choices!="NO_KEYS"&&e.response_allowed_while_playing)var P=this.jsPsych.pluginAPI.getKeyboardResponse({callback_function:y,valid_responses:e.choices,rt_method:"performance",persist:!1,allow_held_key:!1});e.trial_duration!==null&&this.jsPsych.pluginAPI.setTimeout(d,e.trial_duration)}simulate(s,e,t,i){e=="data-only"&&(i(),this.simulate_data_only(s,t)),e=="visual"&&this.simulate_visual(s,t,i)}simulate_data_only(s,e){const t=this.create_simulation_data(s,e);this.jsPsych.finishTrial(t)}simulate_visual(s,e,t){const i=this.create_simulation_data(s,e),n=this.jsPsych.getDisplayElement();this.trial(n,s),t();const o=n.querySelector("#jspsych-video-button-response-stimulus"),l=()=>{i.rt!==null&&this.jsPsych.pluginAPI.pressKey(i.response,i.rt)};s.response_allowed_while_playing?l():o.addEventListener("ended",l)}create_simulation_data(s,e){const t={stimulus:s.stimulus,rt:this.jsPsych.randomization.sampleExGaussian(500,50,.006666666666666667,!0),response:this.jsPsych.pluginAPI.getValidKey(s.choices)},i=this.jsPsych.pluginAPI.mergeSimulationData(t,e);return this.jsPsych.pluginAPI.ensureSimulationDataConsistency(s,i),i}}return m.info=_,m}(jsPsychModule);
-//# sourceMappingURL=https://unpkg.com/@jspsych/plugin-video-keyboard-response@2.1.0/dist/index.browser.min.js.map
+var jsPsychVideoKeyboardResponse=function(r){"use strict";var c="2.1.1";const _={name:"video-keyboard-response",version:c,parameters:{stimulus:{type:r.ParameterType.VIDEO,pretty_name:"Video",default:void 0,array:!0},choices:{type:r.ParameterType.KEYS,pretty_name:"Choices",default:"ALL_KEYS"},prompt:{type:r.ParameterType.HTML_STRING,pretty_name:"Prompt",default:null},width:{type:r.ParameterType.INT,pretty_name:"Width",default:""},height:{type:r.ParameterType.INT,pretty_name:"Height",default:""},autoplay:{type:r.ParameterType.BOOL,pretty_name:"Autoplay",default:!0},controls:{type:r.ParameterType.BOOL,pretty_name:"Controls",default:!1},start:{type:r.ParameterType.FLOAT,pretty_name:"Start",default:null},stop:{type:r.ParameterType.FLOAT,pretty_name:"Stop",default:null},rate:{type:r.ParameterType.FLOAT,pretty_name:"Rate",default:1},trial_ends_after_video:{type:r.ParameterType.BOOL,pretty_name:"End trial after video finishes",default:!1},trial_duration:{type:r.ParameterType.INT,pretty_name:"Trial duration",default:null},response_ends_trial:{type:r.ParameterType.BOOL,pretty_name:"Response ends trial",default:!0},response_allowed_while_playing:{type:r.ParameterType.BOOL,pretty_name:"Response allowed while playing",default:!0}},data:{response:{type:r.ParameterType.STRING},rt:{type:r.ParameterType.INT},stimulus:{type:r.ParameterType.STRING,array:!0}},citations:{apa:"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://doi.org/10.21105/joss.05351 ",bibtex:'@article{Leeuw2023jsPsych, 	author = {de Leeuw, Joshua R. and Gilbert, Rebecca A. and Luchterhandt, Bj{\\" o}rn}, 	journal = {Journal of Open Source Software}, 	doi = {10.21105/joss.05351}, 	issn = {2475-9066}, 	number = {85}, 	year = {2023}, 	month = {may 11}, 	pages = {5351}, 	publisher = {Open Journals}, 	title = {jsPsych: Enabling an {Open}-{Source} {Collaborative} {Ecosystem} of {Behavioral} {Experiments}}, 	url = {https://joss.theoj.org/papers/10.21105/joss.05351}, 	volume = {8}, }  '}};class m{constructor(a){this.jsPsych=a}trial(a,e){var t="<div>";t+='<video id="jspsych-video-keyboard-response-stimulus"',e.width&&(t+=' width="'+e.width+'"'),e.height&&(t+=' height="'+e.height+'"'),e.autoplay&&e.start==null&&(t+=" autoplay "),e.controls&&(t+=" controls "),e.start!==null&&(t+=' style="visibility: hidden;"'),t+=">";var i=this.jsPsych.pluginAPI.getVideoBuffer(e.stimulus[0]);if(!i)for(var n=0;n<e.stimulus.length;n++){var l=e.stimulus[n];l.indexOf("?")>-1&&(l=l.substring(0,l.indexOf("?")));var o=l.substr(l.lastIndexOf(".")+1);o=o.toLowerCase(),o=="mov"&&console.warn("Warning: video-keyboard-response plugin does not reliably support .mov files."),t+='<source src="'+l+'" type="video/'+o+'">'}t+="</video>",t+="</div>",e.prompt!==null&&(t+=e.prompt),a.innerHTML=t;var s=a.querySelector("#jspsych-video-keyboard-response-stimulus");i&&(s.src=i),s.onended=()=>{if(e.trial_ends_after_video&&d(),e.response_allowed_while_playing==!1&&!e.trial_ends_after_video)var u=this.jsPsych.pluginAPI.getKeyboardResponse({callback_function:y,valid_responses:e.choices,rt_method:"performance",persist:!1,allow_held_key:!1})},s.playbackRate=e.rate,e.start!==null&&(s.pause(),s.onseeked=()=>{s.style.visibility="visible",s.muted=!1,e.autoplay?s.play():s.pause(),s.onseeked=()=>{}},s.onplaying=()=>{s.currentTime=e.start,s.onplaying=()=>{}},s.muted=!0,s.play());let h=!1;e.stop!==null&&s.addEventListener("timeupdate",u=>{var v=s.currentTime;if(v>=e.stop){if(!e.response_allowed_while_playing)var g=this.jsPsych.pluginAPI.getKeyboardResponse({callback_function:y,valid_responses:e.choices,rt_method:"performance",persist:!1,allow_held_key:!1});s.pause(),e.trial_ends_after_video&&!h&&(h=!0,d())}});var p={rt:null,key:null};const d=()=>{this.jsPsych.pluginAPI.cancelAllKeyboardResponses(),a.querySelector("#jspsych-video-keyboard-response-stimulus").pause(),a.querySelector("#jspsych-video-keyboard-response-stimulus").onended=()=>{};var u={rt:p.rt,stimulus:e.stimulus,response:p.key};this.jsPsych.finishTrial(u)};var y=u=>{a.querySelector("#jspsych-video-keyboard-response-stimulus").className+=" responded",p.key==null&&(p=u),e.response_ends_trial&&d()};if(e.choices!="NO_KEYS"&&e.response_allowed_while_playing)var P=this.jsPsych.pluginAPI.getKeyboardResponse({callback_function:y,valid_responses:e.choices,rt_method:"performance",persist:!1,allow_held_key:!1});e.trial_duration!==null&&this.jsPsych.pluginAPI.setTimeout(d,e.trial_duration)}simulate(a,e,t,i){e=="data-only"&&(i(),this.simulate_data_only(a,t)),e=="visual"&&this.simulate_visual(a,t,i)}simulate_data_only(a,e){const t=this.create_simulation_data(a,e);this.jsPsych.finishTrial(t)}simulate_visual(a,e,t){const i=this.create_simulation_data(a,e),n=this.jsPsych.getDisplayElement();this.trial(n,a),t();const l=n.querySelector("#jspsych-video-button-response-stimulus"),o=()=>{i.rt!==null&&this.jsPsych.pluginAPI.pressKey(i.response,i.rt)};a.response_allowed_while_playing?o():l.addEventListener("ended",o)}create_simulation_data(a,e){const t={stimulus:a.stimulus,rt:this.jsPsych.randomization.sampleExGaussian(500,50,.006666666666666667,!0),response:this.jsPsych.pluginAPI.getValidKey(a.choices)},i=this.jsPsych.pluginAPI.mergeSimulationData(t,e);return this.jsPsych.pluginAPI.ensureSimulationDataConsistency(a,i),i}}return m.info=_,m}(jsPsychModule);
+//# sourceMappingURL=https://unpkg.com/@jspsych/plugin-video-keyboard-response@2.1.1/dist/index.browser.min.js.map

package/dist/index.browser.min.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.browser.min.js","sources":["../package.json","../src/index.ts"],"sourcesContent":["{\n  \"name\": \"@jspsych/plugin-video-keyboard-response\",\n  \"version\": \"2.1.0\",\n  \"description\": \"jsPsych plugin for playing a video file and getting a keyboard response\",\n  \"type\": \"module\",\n  \"main\": \"dist/index.cjs\",\n  \"exports\": {\n    \"import\": \"./dist/index.js\",\n    \"require\": \"./dist/index.cjs\"\n  },\n  \"typings\": \"dist/index.d.ts\",\n  \"unpkg\": \"dist/index.browser.min.js\",\n  \"files\": [\n    \"src\",\n    \"dist\"\n  ],\n  \"source\": \"src/index.ts\",\n  \"scripts\": {\n    \"test\": \"jest --passWithNoTests\",\n    \"test:watch\": \"npm test -- --watch\",\n    \"tsc\": \"tsc\",\n    \"build\": \"rollup --config\",\n    \"build:watch\": \"npm run build -- --watch\"\n  },\n  \"repository\": {\n    \"type\": \"git\",\n    \"url\": \"git+https://github.com/jspsych/jsPsych.git\",\n    \"directory\": \"packages/plugin-video-keyboard-response\"\n  },\n  \"author\": \"Josh de Leeuw\",\n  \"license\": \"MIT\",\n  \"bugs\": {\n    \"url\": \"https://github.com/jspsych/jsPsych/issues\"\n  },\n  \"homepage\": \"https://www.jspsych.org/latest/plugins/video-keyboard-response\",\n  \"peerDependencies\": {\n    \"jspsych\": \">=7.1.0\"\n  },\n  \"devDependencies\": {\n    \"@jspsych/config\": \"^3.2.0\",\n    \"@jspsych/test-utils\": \"^1.2.0\"\n  }\n}\n","import { JsPsych, JsPsychPlugin, ParameterType, TrialType } from \"jspsych\";\n\nimport { version } from \"../package.json\";\n\nconst info = <const>{\n  name: \"video-keyboard-response\",\n  version: version,\n  parameters: {\n    /** Array of the video file(s) to play. Video can be provided in multiple file formats for better cross-browser support. */\n    stimulus: {\n      type: ParameterType.VIDEO,\n      pretty_name: \"Video\",\n      default: undefined,\n      array: true,\n    },\n    /** Array containing the key(s) the subject is allowed to press to respond to the stimulus. */\n    choices: {\n      type: ParameterType.KEYS,\n      pretty_name: \"Choices\",\n      default: \"ALL_KEYS\",\n    },\n    /** Any content here will be displayed below the stimulus. */\n    prompt: {\n      type: ParameterType.HTML_STRING,\n      pretty_name: \"Prompt\",\n      default: null,\n    },\n    /** The width of the video in pixels. */\n    width: {\n      type: ParameterType.INT,\n      pretty_name: \"Width\",\n      default: \"\",\n    },\n    /** The height of the video display in pixels. */\n    height: {\n      type: ParameterType.INT,\n      pretty_name: \"Height\",\n      default: \"\",\n    },\n    /** If true, the video will begin playing as soon as it has loaded. */\n    autoplay: {\n      type: ParameterType.BOOL,\n      pretty_name: \"Autoplay\",\n      default: true,\n    },\n    /** If true, the subject will be able to pause the video or move the playback to any point in the video. */\n    controls: {\n      type: ParameterType.BOOL,\n      pretty_name: \"Controls\",\n      default: false,\n    },\n    /** Time to start the clip. If null (default), video will start at the beginning of the file. */\n    start: {\n      type: ParameterType.FLOAT,\n      pretty_name: \"Start\",\n      default: null,\n    },\n    /** Time to stop the clip. If null (default), video will stop at the end of the file. */\n    stop: {\n      type: ParameterType.FLOAT,\n      pretty_name: \"Stop\",\n      default: null,\n    },\n    /** The playback rate of the video. 1 is normal, <1 is slower, >1 is faster. */\n    rate: {\n      type: ParameterType.FLOAT,\n      pretty_name: \"Rate\",\n      default: 1,\n    },\n    /** If true, the trial will end immediately after the video finishes playing. */\n    trial_ends_after_video: {\n      type: ParameterType.BOOL,\n      pretty_name: \"End trial after video finishes\",\n      default: false,\n    },\n    /** How long to show trial before it ends. */\n    trial_duration: {\n      type: ParameterType.INT,\n      pretty_name: \"Trial duration\",\n      default: null,\n    },\n    /** If true, the trial will end when subject makes a response. */\n    response_ends_trial: {\n      type: ParameterType.BOOL,\n      pretty_name: \"Response ends trial\",\n      default: true,\n    },\n    /** If true, then responses are allowed while the video is playing. If false, then the video must finish playing before a response is accepted. */\n    response_allowed_while_playing: {\n      type: ParameterType.BOOL,\n      pretty_name: \"Response allowed while playing\",\n      default: true,\n    },\n  },\n  data: {\n    /** Indicates which key the participant pressed. */\n    response: {\n      type: ParameterType.STRING,\n    },\n    /** The response time in milliseconds for the participant to make a response. The time is measured from when the\n     * stimulus first appears on the screen until the participant's response.\n     * */\n    rt: {\n      type: ParameterType.INT,\n    },\n    /** The `stimulus` array. This will be encoded as a JSON string when data is saved using the `.json()` or `.csv()` functions. */\n    stimulus: {\n      type: ParameterType.STRING,\n      array: true,\n    },\n  },\n  // prettier-ignore\n  citations: '__CITATIONS__',\n};\n\ntype Info = typeof info;\n\n/**\n * This plugin plays a video file and records a keyboard response. The stimulus can be displayed until a response is\n * given, or for a pre-determined amount of time. The trial can be ended automatically when the participant responds,\n * when the video file has finished playing, or if the participant has failed to respond within a fixed length of time.\n * You can also prevent a keyboard response from being recorded before the video has finished playing.\n *\n * Video files can be automatically preloaded by jsPsych using the [`preload` plugin](preload.md). However, if you are\n * using timeline variables or another dynamic method to specify the video stimulus, you will need to\n * [manually preload](../overview/media-preloading.md#manual-preloading) the videos. Also note that video preloading\n * is disabled when the experiment is running as a file (i.e. opened directly in the browser, rather than through a\n * server), in order to prevent CORS errors - see the section on [Running Experiments](../overview/running-experiments.md)\n * for more information.\n *\n * @author Josh de Leeuw\n * @see {@link https://www.jspsych.org/latest/plugins/video-keyboard-response/ video-keyboard-response plugin documentation on jspsych.org}\n */\nclass VideoKeyboardResponsePlugin implements JsPsychPlugin<Info> {\n  static info = info;\n\n  constructor(private jsPsych: JsPsych) {}\n\n  trial(display_element: HTMLElement, trial: TrialType<Info>) {\n    // catch mistake where stimuli are not an array\n    if (!Array.isArray(trial.stimulus)) {\n      throw new Error(`\n        The stimulus property for the video-keyboard-response plugin must be an array\n        of files. See https://www.jspsych.org/latest/plugins/video-keyboard-response/#parameters\n      `);\n    }\n\n    // setup stimulus\n    var video_html = \"<div>\";\n    video_html += '<video id=\"jspsych-video-keyboard-response-stimulus\"';\n\n    if (trial.width) {\n      video_html += ' width=\"' + trial.width + '\"';\n    }\n    if (trial.height) {\n      video_html += ' height=\"' + trial.height + '\"';\n    }\n    if (trial.autoplay && trial.start == null) {\n      // if autoplay is true and the start time is specified, then the video will start automatically\n      // via the play() method, rather than the autoplay attribute, to prevent showing the first frame\n      video_html += \" autoplay \";\n    }\n    if (trial.controls) {\n      video_html += \" controls \";\n    }\n    if (trial.start !== null) {\n      // hide video element when page loads if the start time is specified,\n      // to prevent the video element from showing the first frame\n      video_html += ' style=\"visibility: hidden;\"';\n    }\n    video_html += \">\";\n\n    var video_preload_blob = this.jsPsych.pluginAPI.getVideoBuffer(trial.stimulus[0]);\n    if (!video_preload_blob) {\n      for (var i = 0; i < trial.stimulus.length; i++) {\n        var file_name = trial.stimulus[i];\n        if (file_name.indexOf(\"?\") > -1) {\n          file_name = file_name.substring(0, file_name.indexOf(\"?\"));\n        }\n        var type = file_name.substr(file_name.lastIndexOf(\".\") + 1);\n        type = type.toLowerCase();\n        if (type == \"mov\") {\n          console.warn(\n            \"Warning: video-keyboard-response plugin does not reliably support .mov files.\"\n          );\n        }\n        video_html += '<source src=\"' + file_name + '\" type=\"video/' + type + '\">';\n      }\n    }\n    video_html += \"</video>\";\n    video_html += \"</div>\";\n\n    // add prompt if there is one\n    if (trial.prompt !== null) {\n      video_html += trial.prompt;\n    }\n\n    display_element.innerHTML = video_html;\n\n    var video_element = display_element.querySelector<HTMLVideoElement>(\n      \"#jspsych-video-keyboard-response-stimulus\"\n    );\n\n    if (video_preload_blob) {\n      video_element.src = video_preload_blob;\n    }\n\n    video_element.onended = () => {\n      if (trial.trial_ends_after_video) {\n        end_trial();\n      }\n      if (trial.response_allowed_while_playing == false && !trial.trial_ends_after_video) {\n        // start keyboard listener\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\n    video_element.playbackRate = trial.rate;\n\n    // if video start time is specified, hide the video and set the starting time\n    // before showing and playing, so that the video doesn't automatically show the first frame\n    if (trial.start !== null) {\n      video_element.pause();\n      video_element.onseeked = () => {\n        video_element.style.visibility = \"visible\";\n        video_element.muted = false;\n        if (trial.autoplay) {\n          video_element.play();\n        } else {\n          video_element.pause();\n        }\n        video_element.onseeked = () => {};\n      };\n      video_element.onplaying = () => {\n        video_element.currentTime = trial.start;\n        video_element.onplaying = () => {};\n      };\n      // fix for iOS/MacOS browsers: videos aren't seekable until they start playing, so need to hide/mute, play,\n      // change current time, then show/unmute\n      video_element.muted = true;\n      video_element.play();\n    }\n\n    let stopped = false;\n    if (trial.stop !== null) {\n      video_element.addEventListener(\"timeupdate\", (e) => {\n        var currenttime = video_element.currentTime;\n        if (currenttime >= trial.stop) {\n          if (!trial.response_allowed_while_playing) {\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          video_element.pause();\n          if (trial.trial_ends_after_video && !stopped) {\n            // this is to prevent end_trial from being called twice, because the timeupdate event\n            // can fire in quick succession\n            stopped = true;\n            end_trial();\n          }\n        }\n      });\n    }\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 keyboard listeners\n      this.jsPsych.pluginAPI.cancelAllKeyboardResponses();\n\n      // stop the video file if it is playing\n      // remove end event listeners if they exist\n      display_element\n        .querySelector<HTMLVideoElement>(\"#jspsych-video-keyboard-response-stimulus\")\n        .pause();\n      display_element.querySelector<HTMLVideoElement>(\n        \"#jspsych-video-keyboard-response-stimulus\"\n      ).onended = () => {};\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      // 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-video-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\" && trial.response_allowed_while_playing) {\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    // end trial if time limit 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 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    const video_element = display_element.querySelector<HTMLVideoElement>(\n      \"#jspsych-video-button-response-stimulus\"\n    );\n\n    const respond = () => {\n      if (data.rt !== null) {\n        this.jsPsych.pluginAPI.pressKey(data.response, data.rt);\n      }\n    };\n\n    if (!trial.response_allowed_while_playing) {\n      video_element.addEventListener(\"ended\", respond);\n    } else {\n      respond();\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\nexport default VideoKeyboardResponsePlugin;\n"],"names":["version"],"mappings":"0DAEEA,IAAAA,EAAW,kxCC8GA,UAAA,iuBAAe;;;"}
+{"version":3,"file":"index.browser.min.js","sources":["../package.json","../src/index.ts"],"sourcesContent":["{\n  \"name\": \"@jspsych/plugin-video-keyboard-response\",\n  \"version\": \"2.1.1\",\n  \"description\": \"jsPsych plugin for playing a video file and getting a keyboard response\",\n  \"type\": \"module\",\n  \"main\": \"dist/index.cjs\",\n  \"exports\": {\n    \"import\": \"./dist/index.js\",\n    \"require\": \"./dist/index.cjs\"\n  },\n  \"typings\": \"dist/index.d.ts\",\n  \"unpkg\": \"dist/index.browser.min.js\",\n  \"files\": [\n    \"src\",\n    \"dist\"\n  ],\n  \"source\": \"src/index.ts\",\n  \"scripts\": {\n    \"test\": \"jest --passWithNoTests\",\n    \"test:watch\": \"npm test -- --watch\",\n    \"tsc\": \"tsc\",\n    \"build\": \"rollup --config\",\n    \"build:watch\": \"npm run build -- --watch\"\n  },\n  \"repository\": {\n    \"type\": \"git\",\n    \"url\": \"git+https://github.com/jspsych/jsPsych.git\",\n    \"directory\": \"packages/plugin-video-keyboard-response\"\n  },\n  \"author\": \"Josh de Leeuw\",\n  \"license\": \"MIT\",\n  \"bugs\": {\n    \"url\": \"https://github.com/jspsych/jsPsych/issues\"\n  },\n  \"homepage\": \"https://www.jspsych.org/latest/plugins/video-keyboard-response\",\n  \"peerDependencies\": {\n    \"jspsych\": \">=7.1.0\"\n  },\n  \"devDependencies\": {\n    \"@jspsych/config\": \"^3.3.1\",\n    \"@jspsych/test-utils\": \"^1.2.0\"\n  }\n}\n","import { JsPsych, JsPsychPlugin, ParameterType, TrialType } from \"jspsych\";\n\nimport { version } from \"../package.json\";\n\nconst info = <const>{\n  name: \"video-keyboard-response\",\n  version: version,\n  parameters: {\n    /** Array of the video file(s) to play. Video can be provided in multiple file formats for better cross-browser support. */\n    stimulus: {\n      type: ParameterType.VIDEO,\n      pretty_name: \"Video\",\n      default: undefined,\n      array: true,\n    },\n    /** Array containing the key(s) the subject is allowed to press to respond to the stimulus. */\n    choices: {\n      type: ParameterType.KEYS,\n      pretty_name: \"Choices\",\n      default: \"ALL_KEYS\",\n    },\n    /** Any content here will be displayed below the stimulus. */\n    prompt: {\n      type: ParameterType.HTML_STRING,\n      pretty_name: \"Prompt\",\n      default: null,\n    },\n    /** The width of the video display in pixels. If `null`, the video will take the original video's dimensions, \n     * or properly scaled with the aspect ratio if the height is also specified.\n     */\n    width: {\n      type: ParameterType.INT,\n      pretty_name: \"Width\",\n      default: \"\",\n    },\n    /** The height of the video display in pixels. If `null`, the video will take the original video's dimensions,\n     * or properly scaled with the aspect ratio if the width is also specified.\n     */\n    height: {\n      type: ParameterType.INT,\n      pretty_name: \"Height\",\n      default: \"\",\n    },\n    /** If true, the video will begin playing as soon as it has loaded. */\n    autoplay: {\n      type: ParameterType.BOOL,\n      pretty_name: \"Autoplay\",\n      default: true,\n    },\n    /** If true, the subject will be able to pause the video or move the playback to any point in the video. */\n    controls: {\n      type: ParameterType.BOOL,\n      pretty_name: \"Controls\",\n      default: false,\n    },\n    /** Time to start the clip. If null (default), video will start at the beginning of the file. */\n    start: {\n      type: ParameterType.FLOAT,\n      pretty_name: \"Start\",\n      default: null,\n    },\n    /** Time to stop the clip. If null (default), video will stop at the end of the file. */\n    stop: {\n      type: ParameterType.FLOAT,\n      pretty_name: \"Stop\",\n      default: null,\n    },\n    /** The playback rate of the video. 1 is normal, <1 is slower, >1 is faster. */\n    rate: {\n      type: ParameterType.FLOAT,\n      pretty_name: \"Rate\",\n      default: 1,\n    },\n    /** If true, the trial will end immediately after the video finishes playing. */\n    trial_ends_after_video: {\n      type: ParameterType.BOOL,\n      pretty_name: \"End trial after video finishes\",\n      default: false,\n    },\n    /** How long to show trial before it ends. */\n    trial_duration: {\n      type: ParameterType.INT,\n      pretty_name: \"Trial duration\",\n      default: null,\n    },\n    /** If true, the trial will end when subject makes a response. */\n    response_ends_trial: {\n      type: ParameterType.BOOL,\n      pretty_name: \"Response ends trial\",\n      default: true,\n    },\n    /** If true, then responses are allowed while the video is playing. If false, then the video must finish playing before a response is accepted. */\n    response_allowed_while_playing: {\n      type: ParameterType.BOOL,\n      pretty_name: \"Response allowed while playing\",\n      default: true,\n    },\n  },\n  data: {\n    /** Indicates which key the participant pressed. */\n    response: {\n      type: ParameterType.STRING,\n    },\n    /** The response time in milliseconds for the participant to make a response. The time is measured from when the\n     * stimulus first appears on the screen until the participant's response.\n     */\n    rt: {\n      type: ParameterType.INT,\n    },\n    /** The `stimulus` array. This will be encoded as a JSON string when data is saved using the `.json()` or `.csv()` functions. */\n    stimulus: {\n      type: ParameterType.STRING,\n      array: true,\n    },\n  },\n  // prettier-ignore\n  citations: '__CITATIONS__',\n};\n\ntype Info = typeof info;\n\n/**\n * This plugin plays a video file and records a keyboard response. The stimulus can be displayed until a response is\n * given, or for a pre-determined amount of time. The trial can be ended automatically when the participant responds,\n * when the video file has finished playing, or if the participant has failed to respond within a fixed length of time.\n * You can also prevent a keyboard response from being recorded before the video has finished playing.\n *\n * Video files can be automatically preloaded by jsPsych using the [`preload` plugin](preload.md). However, if you are\n * using timeline variables or another dynamic method to specify the video stimulus, you will need to\n * [manually preload](../overview/media-preloading.md#manual-preloading) the videos. Also note that video preloading\n * is disabled when the experiment is running as a file (i.e. opened directly in the browser, rather than through a\n * server), in order to prevent CORS errors - see the section on [Running Experiments](../overview/running-experiments.md)\n * for more information.\n *\n * @author Josh de Leeuw\n * @see {@link https://www.jspsych.org/latest/plugins/video-keyboard-response/ video-keyboard-response plugin documentation on jspsych.org}\n */\nclass VideoKeyboardResponsePlugin implements JsPsychPlugin<Info> {\n  static info = info;\n\n  constructor(private jsPsych: JsPsych) {}\n\n  trial(display_element: HTMLElement, trial: TrialType<Info>) {\n    // setup stimulus\n    var video_html = \"<div>\";\n    video_html += '<video id=\"jspsych-video-keyboard-response-stimulus\"';\n\n    if (trial.width) {\n      video_html += ' width=\"' + trial.width + '\"';\n    }\n    if (trial.height) {\n      video_html += ' height=\"' + trial.height + '\"';\n    }\n    if (trial.autoplay && trial.start == null) {\n      // if autoplay is true and the start time is specified, then the video will start automatically\n      // via the play() method, rather than the autoplay attribute, to prevent showing the first frame\n      video_html += \" autoplay \";\n    }\n    if (trial.controls) {\n      video_html += \" controls \";\n    }\n    if (trial.start !== null) {\n      // hide video element when page loads if the start time is specified,\n      // to prevent the video element from showing the first frame\n      video_html += ' style=\"visibility: hidden;\"';\n    }\n    video_html += \">\";\n\n    var video_preload_blob = this.jsPsych.pluginAPI.getVideoBuffer(trial.stimulus[0]);\n    if (!video_preload_blob) {\n      for (var i = 0; i < trial.stimulus.length; i++) {\n        var file_name = trial.stimulus[i];\n        if (file_name.indexOf(\"?\") > -1) {\n          file_name = file_name.substring(0, file_name.indexOf(\"?\"));\n        }\n        var type = file_name.substr(file_name.lastIndexOf(\".\") + 1);\n        type = type.toLowerCase();\n        if (type == \"mov\") {\n          console.warn(\n            \"Warning: video-keyboard-response plugin does not reliably support .mov files.\"\n          );\n        }\n        video_html += '<source src=\"' + file_name + '\" type=\"video/' + type + '\">';\n      }\n    }\n    video_html += \"</video>\";\n    video_html += \"</div>\";\n\n    // add prompt if there is one\n    if (trial.prompt !== null) {\n      video_html += trial.prompt;\n    }\n\n    display_element.innerHTML = video_html;\n\n    var video_element = display_element.querySelector<HTMLVideoElement>(\n      \"#jspsych-video-keyboard-response-stimulus\"\n    );\n\n    if (video_preload_blob) {\n      video_element.src = video_preload_blob;\n    }\n\n    video_element.onended = () => {\n      if (trial.trial_ends_after_video) {\n        end_trial();\n      }\n      if (trial.response_allowed_while_playing == false && !trial.trial_ends_after_video) {\n        // start keyboard listener\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\n    video_element.playbackRate = trial.rate;\n\n    // if video start time is specified, hide the video and set the starting time\n    // before showing and playing, so that the video doesn't automatically show the first frame\n    if (trial.start !== null) {\n      video_element.pause();\n      video_element.onseeked = () => {\n        video_element.style.visibility = \"visible\";\n        video_element.muted = false;\n        if (trial.autoplay) {\n          video_element.play();\n        } else {\n          video_element.pause();\n        }\n        video_element.onseeked = () => {};\n      };\n      video_element.onplaying = () => {\n        video_element.currentTime = trial.start;\n        video_element.onplaying = () => {};\n      };\n      // fix for iOS/MacOS browsers: videos aren't seekable until they start playing, so need to hide/mute, play,\n      // change current time, then show/unmute\n      video_element.muted = true;\n      video_element.play();\n    }\n\n    let stopped = false;\n    if (trial.stop !== null) {\n      video_element.addEventListener(\"timeupdate\", (e) => {\n        var currenttime = video_element.currentTime;\n        if (currenttime >= trial.stop) {\n          if (!trial.response_allowed_while_playing) {\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          video_element.pause();\n          if (trial.trial_ends_after_video && !stopped) {\n            // this is to prevent end_trial from being called twice, because the timeupdate event\n            // can fire in quick succession\n            stopped = true;\n            end_trial();\n          }\n        }\n      });\n    }\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 keyboard listeners\n      this.jsPsych.pluginAPI.cancelAllKeyboardResponses();\n\n      // stop the video file if it is playing\n      // remove end event listeners if they exist\n      display_element\n        .querySelector<HTMLVideoElement>(\"#jspsych-video-keyboard-response-stimulus\")\n        .pause();\n      display_element.querySelector<HTMLVideoElement>(\n        \"#jspsych-video-keyboard-response-stimulus\"\n      ).onended = () => {};\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      // 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-video-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\" && trial.response_allowed_while_playing) {\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    // end trial if time limit 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 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    const video_element = display_element.querySelector<HTMLVideoElement>(\n      \"#jspsych-video-button-response-stimulus\"\n    );\n\n    const respond = () => {\n      if (data.rt !== null) {\n        this.jsPsych.pluginAPI.pressKey(data.response, data.rt);\n      }\n    };\n\n    if (!trial.response_allowed_while_playing) {\n      video_element.addEventListener(\"ended\", respond);\n    } else {\n      respond();\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\nexport default VideoKeyboardResponsePlugin;\n"],"names":["version"],"mappings":"0DAEEA,IAAAA,EAAW,kxCCkHA,UAAA,iuBAAe"}

package/dist/index.cjs

@@ -2,7 +2,7 @@
 
 var jspsych = require('jspsych');
 
-var version = "2.1.0";
+var version = "2.1.1";
 
 const info = {
   name: "video-keyboard-response",
@@ -27,13 +27,17 @@ const info = {
       pretty_name: "Prompt",
       default: null
     },
-    /** The width of the video in pixels. */
+    /** The width of the video display in pixels. If `null`, the video will take the original video's dimensions, 
+     * or properly scaled with the aspect ratio if the height is also specified.
+     */
     width: {
       type: jspsych.ParameterType.INT,
       pretty_name: "Width",
       default: ""
     },
-    /** The height of the video display in pixels. */
+    /** The height of the video display in pixels. If `null`, the video will take the original video's dimensions,
+     * or properly scaled with the aspect ratio if the width is also specified.
+     */
     height: {
       type: jspsych.ParameterType.INT,
       pretty_name: "Height",
@@ -101,7 +105,7 @@ const info = {
     },
     /** The response time in milliseconds for the participant to make a response. The time is measured from when the
      * stimulus first appears on the screen until the participant's response.
-     * */
+     */
     rt: {
       type: jspsych.ParameterType.INT
     },
@@ -125,12 +129,6 @@ class VideoKeyboardResponsePlugin {
     this.info = info;
   }
   trial(display_element, trial) {
-    if (!Array.isArray(trial.stimulus)) {
-      throw new Error(`
-        The stimulus property for the video-keyboard-response plugin must be an array
-        of files. See https://www.jspsych.org/latest/plugins/video-keyboard-response/#parameters
-      `);
-    }
     var video_html = "<div>";
     video_html += '<video id="jspsych-video-keyboard-response-stimulus"';
     if (trial.width) {

package/dist/index.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.cjs","sources":["../package.json","../src/index.ts"],"sourcesContent":["{\n  \"name\": \"@jspsych/plugin-video-keyboard-response\",\n  \"version\": \"2.1.0\",\n  \"description\": \"jsPsych plugin for playing a video file and getting a keyboard response\",\n  \"type\": \"module\",\n  \"main\": \"dist/index.cjs\",\n  \"exports\": {\n    \"import\": \"./dist/index.js\",\n    \"require\": \"./dist/index.cjs\"\n  },\n  \"typings\": \"dist/index.d.ts\",\n  \"unpkg\": \"dist/index.browser.min.js\",\n  \"files\": [\n    \"src\",\n    \"dist\"\n  ],\n  \"source\": \"src/index.ts\",\n  \"scripts\": {\n    \"test\": \"jest --passWithNoTests\",\n    \"test:watch\": \"npm test -- --watch\",\n    \"tsc\": \"tsc\",\n    \"build\": \"rollup --config\",\n    \"build:watch\": \"npm run build -- --watch\"\n  },\n  \"repository\": {\n    \"type\": \"git\",\n    \"url\": \"git+https://github.com/jspsych/jsPsych.git\",\n    \"directory\": \"packages/plugin-video-keyboard-response\"\n  },\n  \"author\": \"Josh de Leeuw\",\n  \"license\": \"MIT\",\n  \"bugs\": {\n    \"url\": \"https://github.com/jspsych/jsPsych/issues\"\n  },\n  \"homepage\": \"https://www.jspsych.org/latest/plugins/video-keyboard-response\",\n  \"peerDependencies\": {\n    \"jspsych\": \">=7.1.0\"\n  },\n  \"devDependencies\": {\n    \"@jspsych/config\": \"^3.2.0\",\n    \"@jspsych/test-utils\": \"^1.2.0\"\n  }\n}\n","import { JsPsych, JsPsychPlugin, ParameterType, TrialType } from \"jspsych\";\n\nimport { version } from \"../package.json\";\n\nconst info = <const>{\n  name: \"video-keyboard-response\",\n  version: version,\n  parameters: {\n    /** Array of the video file(s) to play. Video can be provided in multiple file formats for better cross-browser support. */\n    stimulus: {\n      type: ParameterType.VIDEO,\n      pretty_name: \"Video\",\n      default: undefined,\n      array: true,\n    },\n    /** Array containing the key(s) the subject is allowed to press to respond to the stimulus. */\n    choices: {\n      type: ParameterType.KEYS,\n      pretty_name: \"Choices\",\n      default: \"ALL_KEYS\",\n    },\n    /** Any content here will be displayed below the stimulus. */\n    prompt: {\n      type: ParameterType.HTML_STRING,\n      pretty_name: \"Prompt\",\n      default: null,\n    },\n    /** The width of the video in pixels. */\n    width: {\n      type: ParameterType.INT,\n      pretty_name: \"Width\",\n      default: \"\",\n    },\n    /** The height of the video display in pixels. */\n    height: {\n      type: ParameterType.INT,\n      pretty_name: \"Height\",\n      default: \"\",\n    },\n    /** If true, the video will begin playing as soon as it has loaded. */\n    autoplay: {\n      type: ParameterType.BOOL,\n      pretty_name: \"Autoplay\",\n      default: true,\n    },\n    /** If true, the subject will be able to pause the video or move the playback to any point in the video. */\n    controls: {\n      type: ParameterType.BOOL,\n      pretty_name: \"Controls\",\n      default: false,\n    },\n    /** Time to start the clip. If null (default), video will start at the beginning of the file. */\n    start: {\n      type: ParameterType.FLOAT,\n      pretty_name: \"Start\",\n      default: null,\n    },\n    /** Time to stop the clip. If null (default), video will stop at the end of the file. */\n    stop: {\n      type: ParameterType.FLOAT,\n      pretty_name: \"Stop\",\n      default: null,\n    },\n    /** The playback rate of the video. 1 is normal, <1 is slower, >1 is faster. */\n    rate: {\n      type: ParameterType.FLOAT,\n      pretty_name: \"Rate\",\n      default: 1,\n    },\n    /** If true, the trial will end immediately after the video finishes playing. */\n    trial_ends_after_video: {\n      type: ParameterType.BOOL,\n      pretty_name: \"End trial after video finishes\",\n      default: false,\n    },\n    /** How long to show trial before it ends. */\n    trial_duration: {\n      type: ParameterType.INT,\n      pretty_name: \"Trial duration\",\n      default: null,\n    },\n    /** If true, the trial will end when subject makes a response. */\n    response_ends_trial: {\n      type: ParameterType.BOOL,\n      pretty_name: \"Response ends trial\",\n      default: true,\n    },\n    /** If true, then responses are allowed while the video is playing. If false, then the video must finish playing before a response is accepted. */\n    response_allowed_while_playing: {\n      type: ParameterType.BOOL,\n      pretty_name: \"Response allowed while playing\",\n      default: true,\n    },\n  },\n  data: {\n    /** Indicates which key the participant pressed. */\n    response: {\n      type: ParameterType.STRING,\n    },\n    /** The response time in milliseconds for the participant to make a response. The time is measured from when the\n     * stimulus first appears on the screen until the participant's response.\n     * */\n    rt: {\n      type: ParameterType.INT,\n    },\n    /** The `stimulus` array. This will be encoded as a JSON string when data is saved using the `.json()` or `.csv()` functions. */\n    stimulus: {\n      type: ParameterType.STRING,\n      array: true,\n    },\n  },\n  // prettier-ignore\n  citations: '__CITATIONS__',\n};\n\ntype Info = typeof info;\n\n/**\n * This plugin plays a video file and records a keyboard response. The stimulus can be displayed until a response is\n * given, or for a pre-determined amount of time. The trial can be ended automatically when the participant responds,\n * when the video file has finished playing, or if the participant has failed to respond within a fixed length of time.\n * You can also prevent a keyboard response from being recorded before the video has finished playing.\n *\n * Video files can be automatically preloaded by jsPsych using the [`preload` plugin](preload.md). However, if you are\n * using timeline variables or another dynamic method to specify the video stimulus, you will need to\n * [manually preload](../overview/media-preloading.md#manual-preloading) the videos. Also note that video preloading\n * is disabled when the experiment is running as a file (i.e. opened directly in the browser, rather than through a\n * server), in order to prevent CORS errors - see the section on [Running Experiments](../overview/running-experiments.md)\n * for more information.\n *\n * @author Josh de Leeuw\n * @see {@link https://www.jspsych.org/latest/plugins/video-keyboard-response/ video-keyboard-response plugin documentation on jspsych.org}\n */\nclass VideoKeyboardResponsePlugin implements JsPsychPlugin<Info> {\n  static info = info;\n\n  constructor(private jsPsych: JsPsych) {}\n\n  trial(display_element: HTMLElement, trial: TrialType<Info>) {\n    // catch mistake where stimuli are not an array\n    if (!Array.isArray(trial.stimulus)) {\n      throw new Error(`\n        The stimulus property for the video-keyboard-response plugin must be an array\n        of files. See https://www.jspsych.org/latest/plugins/video-keyboard-response/#parameters\n      `);\n    }\n\n    // setup stimulus\n    var video_html = \"<div>\";\n    video_html += '<video id=\"jspsych-video-keyboard-response-stimulus\"';\n\n    if (trial.width) {\n      video_html += ' width=\"' + trial.width + '\"';\n    }\n    if (trial.height) {\n      video_html += ' height=\"' + trial.height + '\"';\n    }\n    if (trial.autoplay && trial.start == null) {\n      // if autoplay is true and the start time is specified, then the video will start automatically\n      // via the play() method, rather than the autoplay attribute, to prevent showing the first frame\n      video_html += \" autoplay \";\n    }\n    if (trial.controls) {\n      video_html += \" controls \";\n    }\n    if (trial.start !== null) {\n      // hide video element when page loads if the start time is specified,\n      // to prevent the video element from showing the first frame\n      video_html += ' style=\"visibility: hidden;\"';\n    }\n    video_html += \">\";\n\n    var video_preload_blob = this.jsPsych.pluginAPI.getVideoBuffer(trial.stimulus[0]);\n    if (!video_preload_blob) {\n      for (var i = 0; i < trial.stimulus.length; i++) {\n        var file_name = trial.stimulus[i];\n        if (file_name.indexOf(\"?\") > -1) {\n          file_name = file_name.substring(0, file_name.indexOf(\"?\"));\n        }\n        var type = file_name.substr(file_name.lastIndexOf(\".\") + 1);\n        type = type.toLowerCase();\n        if (type == \"mov\") {\n          console.warn(\n            \"Warning: video-keyboard-response plugin does not reliably support .mov files.\"\n          );\n        }\n        video_html += '<source src=\"' + file_name + '\" type=\"video/' + type + '\">';\n      }\n    }\n    video_html += \"</video>\";\n    video_html += \"</div>\";\n\n    // add prompt if there is one\n    if (trial.prompt !== null) {\n      video_html += trial.prompt;\n    }\n\n    display_element.innerHTML = video_html;\n\n    var video_element = display_element.querySelector<HTMLVideoElement>(\n      \"#jspsych-video-keyboard-response-stimulus\"\n    );\n\n    if (video_preload_blob) {\n      video_element.src = video_preload_blob;\n    }\n\n    video_element.onended = () => {\n      if (trial.trial_ends_after_video) {\n        end_trial();\n      }\n      if (trial.response_allowed_while_playing == false && !trial.trial_ends_after_video) {\n        // start keyboard listener\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\n    video_element.playbackRate = trial.rate;\n\n    // if video start time is specified, hide the video and set the starting time\n    // before showing and playing, so that the video doesn't automatically show the first frame\n    if (trial.start !== null) {\n      video_element.pause();\n      video_element.onseeked = () => {\n        video_element.style.visibility = \"visible\";\n        video_element.muted = false;\n        if (trial.autoplay) {\n          video_element.play();\n        } else {\n          video_element.pause();\n        }\n        video_element.onseeked = () => {};\n      };\n      video_element.onplaying = () => {\n        video_element.currentTime = trial.start;\n        video_element.onplaying = () => {};\n      };\n      // fix for iOS/MacOS browsers: videos aren't seekable until they start playing, so need to hide/mute, play,\n      // change current time, then show/unmute\n      video_element.muted = true;\n      video_element.play();\n    }\n\n    let stopped = false;\n    if (trial.stop !== null) {\n      video_element.addEventListener(\"timeupdate\", (e) => {\n        var currenttime = video_element.currentTime;\n        if (currenttime >= trial.stop) {\n          if (!trial.response_allowed_while_playing) {\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          video_element.pause();\n          if (trial.trial_ends_after_video && !stopped) {\n            // this is to prevent end_trial from being called twice, because the timeupdate event\n            // can fire in quick succession\n            stopped = true;\n            end_trial();\n          }\n        }\n      });\n    }\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 keyboard listeners\n      this.jsPsych.pluginAPI.cancelAllKeyboardResponses();\n\n      // stop the video file if it is playing\n      // remove end event listeners if they exist\n      display_element\n        .querySelector<HTMLVideoElement>(\"#jspsych-video-keyboard-response-stimulus\")\n        .pause();\n      display_element.querySelector<HTMLVideoElement>(\n        \"#jspsych-video-keyboard-response-stimulus\"\n      ).onended = () => {};\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      // 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-video-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\" && trial.response_allowed_while_playing) {\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    // end trial if time limit 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 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    const video_element = display_element.querySelector<HTMLVideoElement>(\n      \"#jspsych-video-button-response-stimulus\"\n    );\n\n    const respond = () => {\n      if (data.rt !== null) {\n        this.jsPsych.pluginAPI.pressKey(data.response, data.rt);\n      }\n    };\n\n    if (!trial.response_allowed_while_playing) {\n      video_element.addEventListener(\"ended\", respond);\n    } else {\n      respond();\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\nexport default VideoKeyboardResponsePlugin;\n"],"names":[],"mappings":";;;;AAEE,IAAW,OAAA,GAAA,OAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EC8GA,SAAA,EAAA;AAAA;;GAAe;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"index.cjs","sources":["../package.json","../src/index.ts"],"sourcesContent":["{\n  \"name\": \"@jspsych/plugin-video-keyboard-response\",\n  \"version\": \"2.1.1\",\n  \"description\": \"jsPsych plugin for playing a video file and getting a keyboard response\",\n  \"type\": \"module\",\n  \"main\": \"dist/index.cjs\",\n  \"exports\": {\n    \"import\": \"./dist/index.js\",\n    \"require\": \"./dist/index.cjs\"\n  },\n  \"typings\": \"dist/index.d.ts\",\n  \"unpkg\": \"dist/index.browser.min.js\",\n  \"files\": [\n    \"src\",\n    \"dist\"\n  ],\n  \"source\": \"src/index.ts\",\n  \"scripts\": {\n    \"test\": \"jest --passWithNoTests\",\n    \"test:watch\": \"npm test -- --watch\",\n    \"tsc\": \"tsc\",\n    \"build\": \"rollup --config\",\n    \"build:watch\": \"npm run build -- --watch\"\n  },\n  \"repository\": {\n    \"type\": \"git\",\n    \"url\": \"git+https://github.com/jspsych/jsPsych.git\",\n    \"directory\": \"packages/plugin-video-keyboard-response\"\n  },\n  \"author\": \"Josh de Leeuw\",\n  \"license\": \"MIT\",\n  \"bugs\": {\n    \"url\": \"https://github.com/jspsych/jsPsych/issues\"\n  },\n  \"homepage\": \"https://www.jspsych.org/latest/plugins/video-keyboard-response\",\n  \"peerDependencies\": {\n    \"jspsych\": \">=7.1.0\"\n  },\n  \"devDependencies\": {\n    \"@jspsych/config\": \"^3.3.1\",\n    \"@jspsych/test-utils\": \"^1.2.0\"\n  }\n}\n","import { JsPsych, JsPsychPlugin, ParameterType, TrialType } from \"jspsych\";\n\nimport { version } from \"../package.json\";\n\nconst info = <const>{\n  name: \"video-keyboard-response\",\n  version: version,\n  parameters: {\n    /** Array of the video file(s) to play. Video can be provided in multiple file formats for better cross-browser support. */\n    stimulus: {\n      type: ParameterType.VIDEO,\n      pretty_name: \"Video\",\n      default: undefined,\n      array: true,\n    },\n    /** Array containing the key(s) the subject is allowed to press to respond to the stimulus. */\n    choices: {\n      type: ParameterType.KEYS,\n      pretty_name: \"Choices\",\n      default: \"ALL_KEYS\",\n    },\n    /** Any content here will be displayed below the stimulus. */\n    prompt: {\n      type: ParameterType.HTML_STRING,\n      pretty_name: \"Prompt\",\n      default: null,\n    },\n    /** The width of the video display in pixels. If `null`, the video will take the original video's dimensions, \n     * or properly scaled with the aspect ratio if the height is also specified.\n     */\n    width: {\n      type: ParameterType.INT,\n      pretty_name: \"Width\",\n      default: \"\",\n    },\n    /** The height of the video display in pixels. If `null`, the video will take the original video's dimensions,\n     * or properly scaled with the aspect ratio if the width is also specified.\n     */\n    height: {\n      type: ParameterType.INT,\n      pretty_name: \"Height\",\n      default: \"\",\n    },\n    /** If true, the video will begin playing as soon as it has loaded. */\n    autoplay: {\n      type: ParameterType.BOOL,\n      pretty_name: \"Autoplay\",\n      default: true,\n    },\n    /** If true, the subject will be able to pause the video or move the playback to any point in the video. */\n    controls: {\n      type: ParameterType.BOOL,\n      pretty_name: \"Controls\",\n      default: false,\n    },\n    /** Time to start the clip. If null (default), video will start at the beginning of the file. */\n    start: {\n      type: ParameterType.FLOAT,\n      pretty_name: \"Start\",\n      default: null,\n    },\n    /** Time to stop the clip. If null (default), video will stop at the end of the file. */\n    stop: {\n      type: ParameterType.FLOAT,\n      pretty_name: \"Stop\",\n      default: null,\n    },\n    /** The playback rate of the video. 1 is normal, <1 is slower, >1 is faster. */\n    rate: {\n      type: ParameterType.FLOAT,\n      pretty_name: \"Rate\",\n      default: 1,\n    },\n    /** If true, the trial will end immediately after the video finishes playing. */\n    trial_ends_after_video: {\n      type: ParameterType.BOOL,\n      pretty_name: \"End trial after video finishes\",\n      default: false,\n    },\n    /** How long to show trial before it ends. */\n    trial_duration: {\n      type: ParameterType.INT,\n      pretty_name: \"Trial duration\",\n      default: null,\n    },\n    /** If true, the trial will end when subject makes a response. */\n    response_ends_trial: {\n      type: ParameterType.BOOL,\n      pretty_name: \"Response ends trial\",\n      default: true,\n    },\n    /** If true, then responses are allowed while the video is playing. If false, then the video must finish playing before a response is accepted. */\n    response_allowed_while_playing: {\n      type: ParameterType.BOOL,\n      pretty_name: \"Response allowed while playing\",\n      default: true,\n    },\n  },\n  data: {\n    /** Indicates which key the participant pressed. */\n    response: {\n      type: ParameterType.STRING,\n    },\n    /** The response time in milliseconds for the participant to make a response. The time is measured from when the\n     * stimulus first appears on the screen until the participant's response.\n     */\n    rt: {\n      type: ParameterType.INT,\n    },\n    /** The `stimulus` array. This will be encoded as a JSON string when data is saved using the `.json()` or `.csv()` functions. */\n    stimulus: {\n      type: ParameterType.STRING,\n      array: true,\n    },\n  },\n  // prettier-ignore\n  citations: '__CITATIONS__',\n};\n\ntype Info = typeof info;\n\n/**\n * This plugin plays a video file and records a keyboard response. The stimulus can be displayed until a response is\n * given, or for a pre-determined amount of time. The trial can be ended automatically when the participant responds,\n * when the video file has finished playing, or if the participant has failed to respond within a fixed length of time.\n * You can also prevent a keyboard response from being recorded before the video has finished playing.\n *\n * Video files can be automatically preloaded by jsPsych using the [`preload` plugin](preload.md). However, if you are\n * using timeline variables or another dynamic method to specify the video stimulus, you will need to\n * [manually preload](../overview/media-preloading.md#manual-preloading) the videos. Also note that video preloading\n * is disabled when the experiment is running as a file (i.e. opened directly in the browser, rather than through a\n * server), in order to prevent CORS errors - see the section on [Running Experiments](../overview/running-experiments.md)\n * for more information.\n *\n * @author Josh de Leeuw\n * @see {@link https://www.jspsych.org/latest/plugins/video-keyboard-response/ video-keyboard-response plugin documentation on jspsych.org}\n */\nclass VideoKeyboardResponsePlugin implements JsPsychPlugin<Info> {\n  static info = info;\n\n  constructor(private jsPsych: JsPsych) {}\n\n  trial(display_element: HTMLElement, trial: TrialType<Info>) {\n    // setup stimulus\n    var video_html = \"<div>\";\n    video_html += '<video id=\"jspsych-video-keyboard-response-stimulus\"';\n\n    if (trial.width) {\n      video_html += ' width=\"' + trial.width + '\"';\n    }\n    if (trial.height) {\n      video_html += ' height=\"' + trial.height + '\"';\n    }\n    if (trial.autoplay && trial.start == null) {\n      // if autoplay is true and the start time is specified, then the video will start automatically\n      // via the play() method, rather than the autoplay attribute, to prevent showing the first frame\n      video_html += \" autoplay \";\n    }\n    if (trial.controls) {\n      video_html += \" controls \";\n    }\n    if (trial.start !== null) {\n      // hide video element when page loads if the start time is specified,\n      // to prevent the video element from showing the first frame\n      video_html += ' style=\"visibility: hidden;\"';\n    }\n    video_html += \">\";\n\n    var video_preload_blob = this.jsPsych.pluginAPI.getVideoBuffer(trial.stimulus[0]);\n    if (!video_preload_blob) {\n      for (var i = 0; i < trial.stimulus.length; i++) {\n        var file_name = trial.stimulus[i];\n        if (file_name.indexOf(\"?\") > -1) {\n          file_name = file_name.substring(0, file_name.indexOf(\"?\"));\n        }\n        var type = file_name.substr(file_name.lastIndexOf(\".\") + 1);\n        type = type.toLowerCase();\n        if (type == \"mov\") {\n          console.warn(\n            \"Warning: video-keyboard-response plugin does not reliably support .mov files.\"\n          );\n        }\n        video_html += '<source src=\"' + file_name + '\" type=\"video/' + type + '\">';\n      }\n    }\n    video_html += \"</video>\";\n    video_html += \"</div>\";\n\n    // add prompt if there is one\n    if (trial.prompt !== null) {\n      video_html += trial.prompt;\n    }\n\n    display_element.innerHTML = video_html;\n\n    var video_element = display_element.querySelector<HTMLVideoElement>(\n      \"#jspsych-video-keyboard-response-stimulus\"\n    );\n\n    if (video_preload_blob) {\n      video_element.src = video_preload_blob;\n    }\n\n    video_element.onended = () => {\n      if (trial.trial_ends_after_video) {\n        end_trial();\n      }\n      if (trial.response_allowed_while_playing == false && !trial.trial_ends_after_video) {\n        // start keyboard listener\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\n    video_element.playbackRate = trial.rate;\n\n    // if video start time is specified, hide the video and set the starting time\n    // before showing and playing, so that the video doesn't automatically show the first frame\n    if (trial.start !== null) {\n      video_element.pause();\n      video_element.onseeked = () => {\n        video_element.style.visibility = \"visible\";\n        video_element.muted = false;\n        if (trial.autoplay) {\n          video_element.play();\n        } else {\n          video_element.pause();\n        }\n        video_element.onseeked = () => {};\n      };\n      video_element.onplaying = () => {\n        video_element.currentTime = trial.start;\n        video_element.onplaying = () => {};\n      };\n      // fix for iOS/MacOS browsers: videos aren't seekable until they start playing, so need to hide/mute, play,\n      // change current time, then show/unmute\n      video_element.muted = true;\n      video_element.play();\n    }\n\n    let stopped = false;\n    if (trial.stop !== null) {\n      video_element.addEventListener(\"timeupdate\", (e) => {\n        var currenttime = video_element.currentTime;\n        if (currenttime >= trial.stop) {\n          if (!trial.response_allowed_while_playing) {\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          video_element.pause();\n          if (trial.trial_ends_after_video && !stopped) {\n            // this is to prevent end_trial from being called twice, because the timeupdate event\n            // can fire in quick succession\n            stopped = true;\n            end_trial();\n          }\n        }\n      });\n    }\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 keyboard listeners\n      this.jsPsych.pluginAPI.cancelAllKeyboardResponses();\n\n      // stop the video file if it is playing\n      // remove end event listeners if they exist\n      display_element\n        .querySelector<HTMLVideoElement>(\"#jspsych-video-keyboard-response-stimulus\")\n        .pause();\n      display_element.querySelector<HTMLVideoElement>(\n        \"#jspsych-video-keyboard-response-stimulus\"\n      ).onended = () => {};\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      // 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-video-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\" && trial.response_allowed_while_playing) {\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    // end trial if time limit 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 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    const video_element = display_element.querySelector<HTMLVideoElement>(\n      \"#jspsych-video-button-response-stimulus\"\n    );\n\n    const respond = () => {\n      if (data.rt !== null) {\n        this.jsPsych.pluginAPI.pressKey(data.response, data.rt);\n      }\n    };\n\n    if (!trial.response_allowed_while_playing) {\n      video_element.addEventListener(\"ended\", respond);\n    } else {\n      respond();\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\nexport default VideoKeyboardResponsePlugin;\n"],"names":[],"mappings":";;;;AAEE,IAAW,OAAA,GAAA,OAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ECkHA,SAAA,EAAA;AAAA;;GAAe;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/index.d.ts

@@ -23,13 +23,17 @@ declare const info: {
             readonly pretty_name: "Prompt";
             readonly default: any;
         };
-        /** The width of the video in pixels. */
+        /** The width of the video display in pixels. If `null`, the video will take the original video's dimensions,
+         * or properly scaled with the aspect ratio if the height is also specified.
+         */
         readonly width: {
             readonly type: ParameterType.INT;
             readonly pretty_name: "Width";
             readonly default: "";
         };
-        /** The height of the video display in pixels. */
+        /** The height of the video display in pixels. If `null`, the video will take the original video's dimensions,
+         * or properly scaled with the aspect ratio if the width is also specified.
+         */
         readonly height: {
             readonly type: ParameterType.INT;
             readonly pretty_name: "Height";
@@ -97,7 +101,7 @@ declare const info: {
         };
         /** The response time in milliseconds for the participant to make a response. The time is measured from when the
          * stimulus first appears on the screen until the participant's response.
-         * */
+         */
         readonly rt: {
             readonly type: ParameterType.INT;
         };
@@ -151,13 +155,17 @@ declare class VideoKeyboardResponsePlugin implements JsPsychPlugin<Info> {
                 readonly pretty_name: "Prompt";
                 readonly default: any;
             };
-            /** The width of the video in pixels. */
+            /** The width of the video display in pixels. If `null`, the video will take the original video's dimensions,
+             * or properly scaled with the aspect ratio if the height is also specified.
+             */
             readonly width: {
                 readonly type: ParameterType.INT;
                 readonly pretty_name: "Width";
                 readonly default: "";
             };
-            /** The height of the video display in pixels. */
+            /** The height of the video display in pixels. If `null`, the video will take the original video's dimensions,
+             * or properly scaled with the aspect ratio if the width is also specified.
+             */
             readonly height: {
                 readonly type: ParameterType.INT;
                 readonly pretty_name: "Height";
@@ -225,7 +233,7 @@ declare class VideoKeyboardResponsePlugin implements JsPsychPlugin<Info> {
             };
             /** The response time in milliseconds for the participant to make a response. The time is measured from when the
              * stimulus first appears on the screen until the participant's response.
-             * */
+             */
             readonly rt: {
                 readonly type: ParameterType.INT;
             };

package/dist/index.js

@@ -1,6 +1,6 @@
 import { ParameterType } from 'jspsych';
 
-var version = "2.1.0";
+var version = "2.1.1";
 
 const info = {
   name: "video-keyboard-response",
@@ -25,13 +25,17 @@ const info = {
       pretty_name: "Prompt",
       default: null
     },
-    /** The width of the video in pixels. */
+    /** The width of the video display in pixels. If `null`, the video will take the original video's dimensions, 
+     * or properly scaled with the aspect ratio if the height is also specified.
+     */
     width: {
       type: ParameterType.INT,
       pretty_name: "Width",
       default: ""
     },
-    /** The height of the video display in pixels. */
+    /** The height of the video display in pixels. If `null`, the video will take the original video's dimensions,
+     * or properly scaled with the aspect ratio if the width is also specified.
+     */
     height: {
       type: ParameterType.INT,
       pretty_name: "Height",
@@ -99,7 +103,7 @@ const info = {
     },
     /** The response time in milliseconds for the participant to make a response. The time is measured from when the
      * stimulus first appears on the screen until the participant's response.
-     * */
+     */
     rt: {
       type: ParameterType.INT
     },
@@ -123,12 +127,6 @@ class VideoKeyboardResponsePlugin {
     this.info = info;
   }
   trial(display_element, trial) {
-    if (!Array.isArray(trial.stimulus)) {
-      throw new Error(`
-        The stimulus property for the video-keyboard-response plugin must be an array
-        of files. See https://www.jspsych.org/latest/plugins/video-keyboard-response/#parameters
-      `);
-    }
     var video_html = "<div>";
     video_html += '<video id="jspsych-video-keyboard-response-stimulus"';
     if (trial.width) {

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../package.json","../src/index.ts"],"sourcesContent":["{\n  \"name\": \"@jspsych/plugin-video-keyboard-response\",\n  \"version\": \"2.1.0\",\n  \"description\": \"jsPsych plugin for playing a video file and getting a keyboard response\",\n  \"type\": \"module\",\n  \"main\": \"dist/index.cjs\",\n  \"exports\": {\n    \"import\": \"./dist/index.js\",\n    \"require\": \"./dist/index.cjs\"\n  },\n  \"typings\": \"dist/index.d.ts\",\n  \"unpkg\": \"dist/index.browser.min.js\",\n  \"files\": [\n    \"src\",\n    \"dist\"\n  ],\n  \"source\": \"src/index.ts\",\n  \"scripts\": {\n    \"test\": \"jest --passWithNoTests\",\n    \"test:watch\": \"npm test -- --watch\",\n    \"tsc\": \"tsc\",\n    \"build\": \"rollup --config\",\n    \"build:watch\": \"npm run build -- --watch\"\n  },\n  \"repository\": {\n    \"type\": \"git\",\n    \"url\": \"git+https://github.com/jspsych/jsPsych.git\",\n    \"directory\": \"packages/plugin-video-keyboard-response\"\n  },\n  \"author\": \"Josh de Leeuw\",\n  \"license\": \"MIT\",\n  \"bugs\": {\n    \"url\": \"https://github.com/jspsych/jsPsych/issues\"\n  },\n  \"homepage\": \"https://www.jspsych.org/latest/plugins/video-keyboard-response\",\n  \"peerDependencies\": {\n    \"jspsych\": \">=7.1.0\"\n  },\n  \"devDependencies\": {\n    \"@jspsych/config\": \"^3.2.0\",\n    \"@jspsych/test-utils\": \"^1.2.0\"\n  }\n}\n","import { JsPsych, JsPsychPlugin, ParameterType, TrialType } from \"jspsych\";\n\nimport { version } from \"../package.json\";\n\nconst info = <const>{\n  name: \"video-keyboard-response\",\n  version: version,\n  parameters: {\n    /** Array of the video file(s) to play. Video can be provided in multiple file formats for better cross-browser support. */\n    stimulus: {\n      type: ParameterType.VIDEO,\n      pretty_name: \"Video\",\n      default: undefined,\n      array: true,\n    },\n    /** Array containing the key(s) the subject is allowed to press to respond to the stimulus. */\n    choices: {\n      type: ParameterType.KEYS,\n      pretty_name: \"Choices\",\n      default: \"ALL_KEYS\",\n    },\n    /** Any content here will be displayed below the stimulus. */\n    prompt: {\n      type: ParameterType.HTML_STRING,\n      pretty_name: \"Prompt\",\n      default: null,\n    },\n    /** The width of the video in pixels. */\n    width: {\n      type: ParameterType.INT,\n      pretty_name: \"Width\",\n      default: \"\",\n    },\n    /** The height of the video display in pixels. */\n    height: {\n      type: ParameterType.INT,\n      pretty_name: \"Height\",\n      default: \"\",\n    },\n    /** If true, the video will begin playing as soon as it has loaded. */\n    autoplay: {\n      type: ParameterType.BOOL,\n      pretty_name: \"Autoplay\",\n      default: true,\n    },\n    /** If true, the subject will be able to pause the video or move the playback to any point in the video. */\n    controls: {\n      type: ParameterType.BOOL,\n      pretty_name: \"Controls\",\n      default: false,\n    },\n    /** Time to start the clip. If null (default), video will start at the beginning of the file. */\n    start: {\n      type: ParameterType.FLOAT,\n      pretty_name: \"Start\",\n      default: null,\n    },\n    /** Time to stop the clip. If null (default), video will stop at the end of the file. */\n    stop: {\n      type: ParameterType.FLOAT,\n      pretty_name: \"Stop\",\n      default: null,\n    },\n    /** The playback rate of the video. 1 is normal, <1 is slower, >1 is faster. */\n    rate: {\n      type: ParameterType.FLOAT,\n      pretty_name: \"Rate\",\n      default: 1,\n    },\n    /** If true, the trial will end immediately after the video finishes playing. */\n    trial_ends_after_video: {\n      type: ParameterType.BOOL,\n      pretty_name: \"End trial after video finishes\",\n      default: false,\n    },\n    /** How long to show trial before it ends. */\n    trial_duration: {\n      type: ParameterType.INT,\n      pretty_name: \"Trial duration\",\n      default: null,\n    },\n    /** If true, the trial will end when subject makes a response. */\n    response_ends_trial: {\n      type: ParameterType.BOOL,\n      pretty_name: \"Response ends trial\",\n      default: true,\n    },\n    /** If true, then responses are allowed while the video is playing. If false, then the video must finish playing before a response is accepted. */\n    response_allowed_while_playing: {\n      type: ParameterType.BOOL,\n      pretty_name: \"Response allowed while playing\",\n      default: true,\n    },\n  },\n  data: {\n    /** Indicates which key the participant pressed. */\n    response: {\n      type: ParameterType.STRING,\n    },\n    /** The response time in milliseconds for the participant to make a response. The time is measured from when the\n     * stimulus first appears on the screen until the participant's response.\n     * */\n    rt: {\n      type: ParameterType.INT,\n    },\n    /** The `stimulus` array. This will be encoded as a JSON string when data is saved using the `.json()` or `.csv()` functions. */\n    stimulus: {\n      type: ParameterType.STRING,\n      array: true,\n    },\n  },\n  // prettier-ignore\n  citations: '__CITATIONS__',\n};\n\ntype Info = typeof info;\n\n/**\n * This plugin plays a video file and records a keyboard response. The stimulus can be displayed until a response is\n * given, or for a pre-determined amount of time. The trial can be ended automatically when the participant responds,\n * when the video file has finished playing, or if the participant has failed to respond within a fixed length of time.\n * You can also prevent a keyboard response from being recorded before the video has finished playing.\n *\n * Video files can be automatically preloaded by jsPsych using the [`preload` plugin](preload.md). However, if you are\n * using timeline variables or another dynamic method to specify the video stimulus, you will need to\n * [manually preload](../overview/media-preloading.md#manual-preloading) the videos. Also note that video preloading\n * is disabled when the experiment is running as a file (i.e. opened directly in the browser, rather than through a\n * server), in order to prevent CORS errors - see the section on [Running Experiments](../overview/running-experiments.md)\n * for more information.\n *\n * @author Josh de Leeuw\n * @see {@link https://www.jspsych.org/latest/plugins/video-keyboard-response/ video-keyboard-response plugin documentation on jspsych.org}\n */\nclass VideoKeyboardResponsePlugin implements JsPsychPlugin<Info> {\n  static info = info;\n\n  constructor(private jsPsych: JsPsych) {}\n\n  trial(display_element: HTMLElement, trial: TrialType<Info>) {\n    // catch mistake where stimuli are not an array\n    if (!Array.isArray(trial.stimulus)) {\n      throw new Error(`\n        The stimulus property for the video-keyboard-response plugin must be an array\n        of files. See https://www.jspsych.org/latest/plugins/video-keyboard-response/#parameters\n      `);\n    }\n\n    // setup stimulus\n    var video_html = \"<div>\";\n    video_html += '<video id=\"jspsych-video-keyboard-response-stimulus\"';\n\n    if (trial.width) {\n      video_html += ' width=\"' + trial.width + '\"';\n    }\n    if (trial.height) {\n      video_html += ' height=\"' + trial.height + '\"';\n    }\n    if (trial.autoplay && trial.start == null) {\n      // if autoplay is true and the start time is specified, then the video will start automatically\n      // via the play() method, rather than the autoplay attribute, to prevent showing the first frame\n      video_html += \" autoplay \";\n    }\n    if (trial.controls) {\n      video_html += \" controls \";\n    }\n    if (trial.start !== null) {\n      // hide video element when page loads if the start time is specified,\n      // to prevent the video element from showing the first frame\n      video_html += ' style=\"visibility: hidden;\"';\n    }\n    video_html += \">\";\n\n    var video_preload_blob = this.jsPsych.pluginAPI.getVideoBuffer(trial.stimulus[0]);\n    if (!video_preload_blob) {\n      for (var i = 0; i < trial.stimulus.length; i++) {\n        var file_name = trial.stimulus[i];\n        if (file_name.indexOf(\"?\") > -1) {\n          file_name = file_name.substring(0, file_name.indexOf(\"?\"));\n        }\n        var type = file_name.substr(file_name.lastIndexOf(\".\") + 1);\n        type = type.toLowerCase();\n        if (type == \"mov\") {\n          console.warn(\n            \"Warning: video-keyboard-response plugin does not reliably support .mov files.\"\n          );\n        }\n        video_html += '<source src=\"' + file_name + '\" type=\"video/' + type + '\">';\n      }\n    }\n    video_html += \"</video>\";\n    video_html += \"</div>\";\n\n    // add prompt if there is one\n    if (trial.prompt !== null) {\n      video_html += trial.prompt;\n    }\n\n    display_element.innerHTML = video_html;\n\n    var video_element = display_element.querySelector<HTMLVideoElement>(\n      \"#jspsych-video-keyboard-response-stimulus\"\n    );\n\n    if (video_preload_blob) {\n      video_element.src = video_preload_blob;\n    }\n\n    video_element.onended = () => {\n      if (trial.trial_ends_after_video) {\n        end_trial();\n      }\n      if (trial.response_allowed_while_playing == false && !trial.trial_ends_after_video) {\n        // start keyboard listener\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\n    video_element.playbackRate = trial.rate;\n\n    // if video start time is specified, hide the video and set the starting time\n    // before showing and playing, so that the video doesn't automatically show the first frame\n    if (trial.start !== null) {\n      video_element.pause();\n      video_element.onseeked = () => {\n        video_element.style.visibility = \"visible\";\n        video_element.muted = false;\n        if (trial.autoplay) {\n          video_element.play();\n        } else {\n          video_element.pause();\n        }\n        video_element.onseeked = () => {};\n      };\n      video_element.onplaying = () => {\n        video_element.currentTime = trial.start;\n        video_element.onplaying = () => {};\n      };\n      // fix for iOS/MacOS browsers: videos aren't seekable until they start playing, so need to hide/mute, play,\n      // change current time, then show/unmute\n      video_element.muted = true;\n      video_element.play();\n    }\n\n    let stopped = false;\n    if (trial.stop !== null) {\n      video_element.addEventListener(\"timeupdate\", (e) => {\n        var currenttime = video_element.currentTime;\n        if (currenttime >= trial.stop) {\n          if (!trial.response_allowed_while_playing) {\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          video_element.pause();\n          if (trial.trial_ends_after_video && !stopped) {\n            // this is to prevent end_trial from being called twice, because the timeupdate event\n            // can fire in quick succession\n            stopped = true;\n            end_trial();\n          }\n        }\n      });\n    }\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 keyboard listeners\n      this.jsPsych.pluginAPI.cancelAllKeyboardResponses();\n\n      // stop the video file if it is playing\n      // remove end event listeners if they exist\n      display_element\n        .querySelector<HTMLVideoElement>(\"#jspsych-video-keyboard-response-stimulus\")\n        .pause();\n      display_element.querySelector<HTMLVideoElement>(\n        \"#jspsych-video-keyboard-response-stimulus\"\n      ).onended = () => {};\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      // 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-video-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\" && trial.response_allowed_while_playing) {\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    // end trial if time limit 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 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    const video_element = display_element.querySelector<HTMLVideoElement>(\n      \"#jspsych-video-button-response-stimulus\"\n    );\n\n    const respond = () => {\n      if (data.rt !== null) {\n        this.jsPsych.pluginAPI.pressKey(data.response, data.rt);\n      }\n    };\n\n    if (!trial.response_allowed_while_playing) {\n      video_element.addEventListener(\"ended\", respond);\n    } else {\n      respond();\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\nexport default VideoKeyboardResponsePlugin;\n"],"names":[],"mappings":";;AAEE,IAAW,OAAA,GAAA,OAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EC8GA,SAAA,EAAA;AAAA;;GAAe;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"index.js","sources":["../package.json","../src/index.ts"],"sourcesContent":["{\n  \"name\": \"@jspsych/plugin-video-keyboard-response\",\n  \"version\": \"2.1.1\",\n  \"description\": \"jsPsych plugin for playing a video file and getting a keyboard response\",\n  \"type\": \"module\",\n  \"main\": \"dist/index.cjs\",\n  \"exports\": {\n    \"import\": \"./dist/index.js\",\n    \"require\": \"./dist/index.cjs\"\n  },\n  \"typings\": \"dist/index.d.ts\",\n  \"unpkg\": \"dist/index.browser.min.js\",\n  \"files\": [\n    \"src\",\n    \"dist\"\n  ],\n  \"source\": \"src/index.ts\",\n  \"scripts\": {\n    \"test\": \"jest --passWithNoTests\",\n    \"test:watch\": \"npm test -- --watch\",\n    \"tsc\": \"tsc\",\n    \"build\": \"rollup --config\",\n    \"build:watch\": \"npm run build -- --watch\"\n  },\n  \"repository\": {\n    \"type\": \"git\",\n    \"url\": \"git+https://github.com/jspsych/jsPsych.git\",\n    \"directory\": \"packages/plugin-video-keyboard-response\"\n  },\n  \"author\": \"Josh de Leeuw\",\n  \"license\": \"MIT\",\n  \"bugs\": {\n    \"url\": \"https://github.com/jspsych/jsPsych/issues\"\n  },\n  \"homepage\": \"https://www.jspsych.org/latest/plugins/video-keyboard-response\",\n  \"peerDependencies\": {\n    \"jspsych\": \">=7.1.0\"\n  },\n  \"devDependencies\": {\n    \"@jspsych/config\": \"^3.3.1\",\n    \"@jspsych/test-utils\": \"^1.2.0\"\n  }\n}\n","import { JsPsych, JsPsychPlugin, ParameterType, TrialType } from \"jspsych\";\n\nimport { version } from \"../package.json\";\n\nconst info = <const>{\n  name: \"video-keyboard-response\",\n  version: version,\n  parameters: {\n    /** Array of the video file(s) to play. Video can be provided in multiple file formats for better cross-browser support. */\n    stimulus: {\n      type: ParameterType.VIDEO,\n      pretty_name: \"Video\",\n      default: undefined,\n      array: true,\n    },\n    /** Array containing the key(s) the subject is allowed to press to respond to the stimulus. */\n    choices: {\n      type: ParameterType.KEYS,\n      pretty_name: \"Choices\",\n      default: \"ALL_KEYS\",\n    },\n    /** Any content here will be displayed below the stimulus. */\n    prompt: {\n      type: ParameterType.HTML_STRING,\n      pretty_name: \"Prompt\",\n      default: null,\n    },\n    /** The width of the video display in pixels. If `null`, the video will take the original video's dimensions, \n     * or properly scaled with the aspect ratio if the height is also specified.\n     */\n    width: {\n      type: ParameterType.INT,\n      pretty_name: \"Width\",\n      default: \"\",\n    },\n    /** The height of the video display in pixels. If `null`, the video will take the original video's dimensions,\n     * or properly scaled with the aspect ratio if the width is also specified.\n     */\n    height: {\n      type: ParameterType.INT,\n      pretty_name: \"Height\",\n      default: \"\",\n    },\n    /** If true, the video will begin playing as soon as it has loaded. */\n    autoplay: {\n      type: ParameterType.BOOL,\n      pretty_name: \"Autoplay\",\n      default: true,\n    },\n    /** If true, the subject will be able to pause the video or move the playback to any point in the video. */\n    controls: {\n      type: ParameterType.BOOL,\n      pretty_name: \"Controls\",\n      default: false,\n    },\n    /** Time to start the clip. If null (default), video will start at the beginning of the file. */\n    start: {\n      type: ParameterType.FLOAT,\n      pretty_name: \"Start\",\n      default: null,\n    },\n    /** Time to stop the clip. If null (default), video will stop at the end of the file. */\n    stop: {\n      type: ParameterType.FLOAT,\n      pretty_name: \"Stop\",\n      default: null,\n    },\n    /** The playback rate of the video. 1 is normal, <1 is slower, >1 is faster. */\n    rate: {\n      type: ParameterType.FLOAT,\n      pretty_name: \"Rate\",\n      default: 1,\n    },\n    /** If true, the trial will end immediately after the video finishes playing. */\n    trial_ends_after_video: {\n      type: ParameterType.BOOL,\n      pretty_name: \"End trial after video finishes\",\n      default: false,\n    },\n    /** How long to show trial before it ends. */\n    trial_duration: {\n      type: ParameterType.INT,\n      pretty_name: \"Trial duration\",\n      default: null,\n    },\n    /** If true, the trial will end when subject makes a response. */\n    response_ends_trial: {\n      type: ParameterType.BOOL,\n      pretty_name: \"Response ends trial\",\n      default: true,\n    },\n    /** If true, then responses are allowed while the video is playing. If false, then the video must finish playing before a response is accepted. */\n    response_allowed_while_playing: {\n      type: ParameterType.BOOL,\n      pretty_name: \"Response allowed while playing\",\n      default: true,\n    },\n  },\n  data: {\n    /** Indicates which key the participant pressed. */\n    response: {\n      type: ParameterType.STRING,\n    },\n    /** The response time in milliseconds for the participant to make a response. The time is measured from when the\n     * stimulus first appears on the screen until the participant's response.\n     */\n    rt: {\n      type: ParameterType.INT,\n    },\n    /** The `stimulus` array. This will be encoded as a JSON string when data is saved using the `.json()` or `.csv()` functions. */\n    stimulus: {\n      type: ParameterType.STRING,\n      array: true,\n    },\n  },\n  // prettier-ignore\n  citations: '__CITATIONS__',\n};\n\ntype Info = typeof info;\n\n/**\n * This plugin plays a video file and records a keyboard response. The stimulus can be displayed until a response is\n * given, or for a pre-determined amount of time. The trial can be ended automatically when the participant responds,\n * when the video file has finished playing, or if the participant has failed to respond within a fixed length of time.\n * You can also prevent a keyboard response from being recorded before the video has finished playing.\n *\n * Video files can be automatically preloaded by jsPsych using the [`preload` plugin](preload.md). However, if you are\n * using timeline variables or another dynamic method to specify the video stimulus, you will need to\n * [manually preload](../overview/media-preloading.md#manual-preloading) the videos. Also note that video preloading\n * is disabled when the experiment is running as a file (i.e. opened directly in the browser, rather than through a\n * server), in order to prevent CORS errors - see the section on [Running Experiments](../overview/running-experiments.md)\n * for more information.\n *\n * @author Josh de Leeuw\n * @see {@link https://www.jspsych.org/latest/plugins/video-keyboard-response/ video-keyboard-response plugin documentation on jspsych.org}\n */\nclass VideoKeyboardResponsePlugin implements JsPsychPlugin<Info> {\n  static info = info;\n\n  constructor(private jsPsych: JsPsych) {}\n\n  trial(display_element: HTMLElement, trial: TrialType<Info>) {\n    // setup stimulus\n    var video_html = \"<div>\";\n    video_html += '<video id=\"jspsych-video-keyboard-response-stimulus\"';\n\n    if (trial.width) {\n      video_html += ' width=\"' + trial.width + '\"';\n    }\n    if (trial.height) {\n      video_html += ' height=\"' + trial.height + '\"';\n    }\n    if (trial.autoplay && trial.start == null) {\n      // if autoplay is true and the start time is specified, then the video will start automatically\n      // via the play() method, rather than the autoplay attribute, to prevent showing the first frame\n      video_html += \" autoplay \";\n    }\n    if (trial.controls) {\n      video_html += \" controls \";\n    }\n    if (trial.start !== null) {\n      // hide video element when page loads if the start time is specified,\n      // to prevent the video element from showing the first frame\n      video_html += ' style=\"visibility: hidden;\"';\n    }\n    video_html += \">\";\n\n    var video_preload_blob = this.jsPsych.pluginAPI.getVideoBuffer(trial.stimulus[0]);\n    if (!video_preload_blob) {\n      for (var i = 0; i < trial.stimulus.length; i++) {\n        var file_name = trial.stimulus[i];\n        if (file_name.indexOf(\"?\") > -1) {\n          file_name = file_name.substring(0, file_name.indexOf(\"?\"));\n        }\n        var type = file_name.substr(file_name.lastIndexOf(\".\") + 1);\n        type = type.toLowerCase();\n        if (type == \"mov\") {\n          console.warn(\n            \"Warning: video-keyboard-response plugin does not reliably support .mov files.\"\n          );\n        }\n        video_html += '<source src=\"' + file_name + '\" type=\"video/' + type + '\">';\n      }\n    }\n    video_html += \"</video>\";\n    video_html += \"</div>\";\n\n    // add prompt if there is one\n    if (trial.prompt !== null) {\n      video_html += trial.prompt;\n    }\n\n    display_element.innerHTML = video_html;\n\n    var video_element = display_element.querySelector<HTMLVideoElement>(\n      \"#jspsych-video-keyboard-response-stimulus\"\n    );\n\n    if (video_preload_blob) {\n      video_element.src = video_preload_blob;\n    }\n\n    video_element.onended = () => {\n      if (trial.trial_ends_after_video) {\n        end_trial();\n      }\n      if (trial.response_allowed_while_playing == false && !trial.trial_ends_after_video) {\n        // start keyboard listener\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\n    video_element.playbackRate = trial.rate;\n\n    // if video start time is specified, hide the video and set the starting time\n    // before showing and playing, so that the video doesn't automatically show the first frame\n    if (trial.start !== null) {\n      video_element.pause();\n      video_element.onseeked = () => {\n        video_element.style.visibility = \"visible\";\n        video_element.muted = false;\n        if (trial.autoplay) {\n          video_element.play();\n        } else {\n          video_element.pause();\n        }\n        video_element.onseeked = () => {};\n      };\n      video_element.onplaying = () => {\n        video_element.currentTime = trial.start;\n        video_element.onplaying = () => {};\n      };\n      // fix for iOS/MacOS browsers: videos aren't seekable until they start playing, so need to hide/mute, play,\n      // change current time, then show/unmute\n      video_element.muted = true;\n      video_element.play();\n    }\n\n    let stopped = false;\n    if (trial.stop !== null) {\n      video_element.addEventListener(\"timeupdate\", (e) => {\n        var currenttime = video_element.currentTime;\n        if (currenttime >= trial.stop) {\n          if (!trial.response_allowed_while_playing) {\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          video_element.pause();\n          if (trial.trial_ends_after_video && !stopped) {\n            // this is to prevent end_trial from being called twice, because the timeupdate event\n            // can fire in quick succession\n            stopped = true;\n            end_trial();\n          }\n        }\n      });\n    }\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 keyboard listeners\n      this.jsPsych.pluginAPI.cancelAllKeyboardResponses();\n\n      // stop the video file if it is playing\n      // remove end event listeners if they exist\n      display_element\n        .querySelector<HTMLVideoElement>(\"#jspsych-video-keyboard-response-stimulus\")\n        .pause();\n      display_element.querySelector<HTMLVideoElement>(\n        \"#jspsych-video-keyboard-response-stimulus\"\n      ).onended = () => {};\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      // 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-video-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\" && trial.response_allowed_while_playing) {\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    // end trial if time limit 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 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    const video_element = display_element.querySelector<HTMLVideoElement>(\n      \"#jspsych-video-button-response-stimulus\"\n    );\n\n    const respond = () => {\n      if (data.rt !== null) {\n        this.jsPsych.pluginAPI.pressKey(data.response, data.rt);\n      }\n    };\n\n    if (!trial.response_allowed_while_playing) {\n      video_element.addEventListener(\"ended\", respond);\n    } else {\n      respond();\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\nexport default VideoKeyboardResponsePlugin;\n"],"names":[],"mappings":";;AAEE,IAAW,OAAA,GAAA,OAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ECkHA,SAAA,EAAA;AAAA;;GAAe;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@jspsych/plugin-video-keyboard-response",
-  "version": "2.1.0",
+  "version": "2.1.1",
   "description": "jsPsych plugin for playing a video file and getting a keyboard response",
   "type": "module",
   "main": "dist/index.cjs",
@@ -37,7 +37,7 @@
     "jspsych": ">=7.1.0"
   },
   "devDependencies": {
-    "@jspsych/config": "^3.2.0",
+    "@jspsych/config": "^3.3.1",
     "@jspsych/test-utils": "^1.2.0"
   }
 }

package/src/index.spec.ts

@@ -23,7 +23,7 @@ describe("video-keyboard-response", () => {
 
     await expect(async () => {
       await jsPsych.run(timeline);
-    }).rejects.toThrowError();
+    }).rejects.toThrow();
   });
 });
 

package/src/index.ts

@@ -25,13 +25,17 @@ const info = <const>{
       pretty_name: "Prompt",
       default: null,
     },
-    /** The width of the video in pixels. */
+    /** The width of the video display in pixels. If `null`, the video will take the original video's dimensions, 
+     * or properly scaled with the aspect ratio if the height is also specified.
+     */
     width: {
       type: ParameterType.INT,
       pretty_name: "Width",
       default: "",
     },
-    /** The height of the video display in pixels. */
+    /** The height of the video display in pixels. If `null`, the video will take the original video's dimensions,
+     * or properly scaled with the aspect ratio if the width is also specified.
+     */
     height: {
       type: ParameterType.INT,
       pretty_name: "Height",
@@ -99,7 +103,7 @@ const info = <const>{
     },
     /** The response time in milliseconds for the participant to make a response. The time is measured from when the
      * stimulus first appears on the screen until the participant's response.
-     * */
+     */
     rt: {
       type: ParameterType.INT,
     },
@@ -137,14 +141,6 @@ class VideoKeyboardResponsePlugin implements JsPsychPlugin<Info> {
   constructor(private jsPsych: JsPsych) {}
 
   trial(display_element: HTMLElement, trial: TrialType<Info>) {
-    // catch mistake where stimuli are not an array
-    if (!Array.isArray(trial.stimulus)) {
-      throw new Error(`
-        The stimulus property for the video-keyboard-response plugin must be an array
-        of files. See https://www.jspsych.org/latest/plugins/video-keyboard-response/#parameters
-      `);
-    }
-
     // setup stimulus
     var video_html = "<div>";
     video_html += '<video id="jspsych-video-keyboard-response-stimulus"';