npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2025 – Pkg Stats / Ryan Hefner

@lookit/record

v4.1.0

Published

Recording extensions and plugins for CHS studies.

Readme

Record

This package contains the plugins and extensions to record audio and/or video of either a single trial or multiple trials.

Parameters available in all plugins

locale [String | "en-us"]

Optional parameter to set a two-letter language code for translation. In some cases, a regional code will have to be provided as well. For example, we currently support English only from the US region. Therefore, to get the US English translation you would put "en-US" for the locale. We support the following language codes:

| Language | Region | Code | | -------------- | ------ | ----- | | Basque | | eu | | Dutch, Flemish | | nl | | English | U.S.A. | en-US | | French | | fr | | Hungarian | | hu | | Italian | | it | | Japanese | | ja | | Portuguese | Brazil | pt-BR | | Portuguese | | pt |

Video Configuration Plugin

To record any video during an experiment, including a consent video, you must add a video configuration trial. This trial allows the user to give permissions and select the correct camera and microphone. This trial also does some basic checks on the webcam and mic inputs, so that the participant can fix common problems before the experiment starts.

Create a video configuration trial and put it in your experiment timeline prior to any other trials that use the participant's webcam/microphone. The trial type is chsRecord.VideoConfigPlugin.

const videoConfig = { type: chsRecord.VideoConfigPlugin };

Parameters

Optional

troubleshooting_intro [HTML String]

Optional text to add at the start of the "Setup tips and troubleshooting" section. This string allows HTML formatting (e.g. <strong></strong> for bold, <em></em> for italics).

Examples

const videoConfig = {
  type: chsRecord.VideoConfigPlugin,
  troubleshooting_intro:
    "If you're having any trouble getting your webcam set up, please feel free to call the XYZ lab at (123) 456-7890 and we'd be glad to help you out!",
};

Video Consent Plugin

Users will need to record themselves accepting the consent document for your study. This trial will allow the user to read the consent document and record a video accepting it.

!!! caution "Don't forget a video config trial!"

You MUST have a video config trial in your experiment timeline before the video consent trial.

To create the video consent trial:

const videoConsent = { type: chsRecord.VideoConsentPlugin, ...parameters };

Parameters

Parameter names are shown below, along with their type and default value. If the default value is undefined, then a value is required for that parameter.

Required

PIName [String | undefined]

Name of PI running this study.

institution [String | undefined]

Name of institution running this study (if ambiguous, list institution whose IRB approved the study).

PIContact [String | undefined]

Contact information for PI or lab in case of participant questions or concerns. This will directly follow the phrase “please contact”, so format accordingly: e.g., “the XYZ lab at [email protected]” or “Mary Smith at 123 456 7890”.

payment [String | undefined]

Statement about payment/compensation for participation, including a statement that there are no additional benefits anticipated to the participant. E.g., “After you finish the study, we will email you a $5 BabyStore gift card within approximately three days. To be eligible for the gift card your child must be in the age range for this study, you need to submit a valid consent statement, and we need to see that there is a child with you. But we will send a gift card even if you do not finish the whole study or we are not able to use your child’s data! There are no other direct benefits to you or your child from participating, but we hope you will enjoy the experience.”

This section is by default titled “Are there any benefits to your family?”; it should only include information about benefits and compensation. If your IRB prefers to combine risk/benefit information, you can change this to something like “What are the risks and benefits if you participate?” and include both here, then omit the risk_statement.

procedures [String | undefined]

Brief description of study procedures. For consent templates 001 and 002, this should include any risks or a statement that there are no anticipated risks. (For consent template 003, that is included in payment). We add a statement about the duration (from your study definition) to the start (e.g., “This study takes about 10 minutes to complete”), so you don’t need to include that. It can be in third person or addressed to the parent. E.g., “Your child will be shown pictures of lots of different cats, along with noises that cats make like meowing and purring. We are interested in which pictures and sounds make your child smile. We will ask you (the parent) to turn around to avoid influencing your child’s responses. There are no anticipated risks associated with participating.”

purpose [String | undefined]

Brief description of purpose of study - 1-2 sentences that describe what you are trying to find out. Language should be as straightforward and accessible as possible! E.g., “Why do babies love cats? This study will help us find out whether babies love cats because of their soft fur or their twitchy tails.”

Optional

template [String | "consent-template-5"]

Which consent document template to use. If you are setting up a new study, we recommend using the most recent (highest number) of these options. Options: consent-template-5, consent-garden.

additional_video_privacy_statement [String | ""]

Optional additional text for under header “Who can see our webcam recordings”. For cases where researchers ask for other specific permission to share videos, separate from the exit survey, or want to provide more detail or different language about Databrary sharing.

datause [String | ""]

Optional study-specific data use statement. This will follow more general text like: “The research group led by [PIName] at [institution] will have access to video and other data collected during this session. We will also have access to your account profile, demographic survey, and the child profile for the child who is participating, including changes you make in the future to any of this information. We may study your child’s responses in connection with his or her previous responses to this or other studies run by our group, siblings’ responses to this or other studies run by our group, or demographic survey responses.” (For exact text, please see specific template.)

You may want to note what measures you will actually be coding for (looking time, facial expressions, parent-child interaction, etc.) and other more specific information about your use of data from this study here. For instance, you would note if you were building a corpus of naturalistic data that may be used to answer a variety of questions (rather than just collecting data for a single planned study).

gdpr [Boolean | false]

Whether to include a section on GDPR.

gdpr_personal_data [String | ""]

List of types of personal information collected, for GDPR section only. Do not include special category information, which is listed separately.

gdpr_sensitive_data [String | ""]

List of types of special category information collected, for GDPR section only. Include all that apply: racial or ethnic origin; political opinions; religious or philosophical beliefs; trade union membership; processing of genetic data; biometric data; health data; and/or sex life or sexual orientation information.

include_databrary [Boolean | false]

Whether to include a paragraph about Databrary under “Who can see our webcam recordings?”.

private_level_only [Boolean | false]

Whether to describe only the “private” video privacy level under the heading “Who will be able to see your webcam recordings?” Only use this option if your IRB has a hard restriction against even offering participants the option to share their videos more broadly, and in conjunction with the corresponding restriction of options in the exit survey!

research_rights_statement [String | ""]

Statement about rights of research subjects and how to contact IRB. For instance, MIT’s standard language is: You are not waiving any legal claims, rights or remedies because of your participation in this research study. If you feel you have been treated unfairly, or you have questions regarding your rights as a research subject, you may contact [CONTACT INFO].

risk_statement [String | ""]

Optional statement; if provided, it is displayed under a header “Are there any risks if you participate?”.

voluntary_participation [String | ""]

Optional additional text for under header “Participation is voluntary”. E.g., “There are two sessions in this study; you will be invited to complete another session next month. It is okay not to do both sessions!”

Additional customization available if REQUIRED by your IRB

To accommodate a variety of idiosyncratic IRB requirements, various other fields are technically customizable. Please start by trying to get approval for a standard Lookit consent form, because it helps participants for the forms to have common structure and language. If your IRB says no, you need to use their usual form that’s 14 pages long, please explain that Lookit requires you to use of one of our standard forms to ensure a smooth participant experience; this is in the Terms of Use! If it really won’t be possible to use Lookit without making more changes, please let us know before using the following fields to further customize the consent form:

purpose_header [String | ""]

Custom alternate header for the section on study purpose.

procedures_header [String | ""]

Custom alternate header for the section on study procedures.

participation_header [String | ""]

Custom alternate header for the section on participation being voluntary.

benefits_header [String | ""]

Custom alternate header for the section on benefits/compensation.

risk_header [String | ""]

Custom alternate header for risks section.

summary_statement [String | ""]

Statement inserted at the beginning of the consent form, right after “Researchers led by … are running this study … on Lookit.” Please only use this if your IRB requires particular information to be included at the beginning of the form; information is usually easier for participants to find under the appropriate header rather than inserted here!

additional_segments [Array]

List of additional custom sections of the consent form, e.g. US Patriot Act Disclosure or child abuse reporting obligation disclosure. These are subject to Lookit approval and in general can only add information that was true anyway but that your IRB needs explicitly listed.

Each section can have fields:

{
  title: "title of section",
  text: "content of section"
}

prompt_all_adults [Boolean | false]

Whether to include an addition step #4 prompting any other adults present to read a statement of consent (I have read and understand the consent document. I also agree to participate in this study.)

prompt_only_adults [Boolean | false]

Whether to prompt only the adult for consent for themselves to participate, rather than also referencing a child. This is for occasional studies running an adult comparison group.

consent_statement_text [String | ""]

Replace the default spoken consent statement with your custom text.

omit_injury_phrase [Boolean | false]

Whether to omit the phrase “or in the very unlikely event of a research-related injury” from the contact section. (This was required by the Northwestern IRB.)

Example

const videoConsent = {
  type: chsRecord.VideoConsentPlugin,
  PIName: "Jane Smith",
  institution: "Science University",
  PIContact: "Jane Smith at 123 456 7890",
  purpose:
    "Why do babies love cats? This study will help us find out whether babies love cats because of their soft fur or their twitchy tails.",
  procedures:
    "Your child will be shown pictures of lots of different cats, along with noises that cats make like meowing and purring. We are interested in which pictures and sounds make your child smile. We will ask you (the parent) to turn around to avoid influencing your child's responses.",
  risk_statement:
    "There are no expected risks if you participate in the study. (This is optional, but should typically be included. If you leave it out there's no 'risks' section and you should include risk information elsewhere.)",
  voluntary_participation:
    "There are two sessions in this study; you will be invited to complete another session next month. It is okay not to do both sessions! (This is optional; leave it out if you don't need to say anything besides participation in this session being voluntary.)",
  payment:
    "After you finish the study, we will email you a $5 BabyStore gift card within approximately three days. To be eligible for the gift card your child must be in the age range for this study, you need to submit a valid consent statement, and we need to see that there is a child with you. But we will send a gift card even if you do not finish the whole study or we are not able to use your child's data! There are no other direct benefits to you or your child from participating, but we hope you will enjoy the experience.",
  datause:
    "We are primarily interested in your child's emotional reactions to the images and sounds. A research assistant will watch your video to measure the precise amount of delight in your child's face as he or she sees each cat picture.",
  include_databrary: true,
  additional_video_privacy_statement:
    "We will also ask your permission to use your videos as stimuli for other parents. (This is optional; leave it out if there aren't additional ways you'll share video beyond as described in the participant's video privacy level and Databrary selections.)",
  gdpr: false,
  research_rights_statement:
    "You are not waiving any legal claims, rights or remedies because of your participation in this research study.  If you feel you have been treated unfairly, or you have questions regarding your rights as a research subject, you may contact the [IRB NAME], [INSTITUTION], [ADDRESS/CONTACT]",
  additional_segments: [
    {
      title: "US Patriot Act Disclosure",
      text: "[EXAMPLE ONLY, PLEASE REMOVE ADDITIONAL_SEGMENTS UNLESS YOU NEED THEM.] Lookit is a U.S. organization and all information gathered from the website is stored on servers based in the U.S. Therefore, your video recordings are subject to U.S. laws, such as the US Patriot Act. This act allows authorities access to the records of internet service providers. If you choose to participate in this study, you understand that your video recording will be stored and accessed in the USA. The security and privacy policy for Lookit can be found at the following link: <a href='https://lookit.mit.edu/privacy/' target='_blank' rel='noopener'>https://lookit.mit.edu/privacy/</a>.",
    },
  ],
};

Trial Recording Extension

Trial recording can be added to most jsPsych trials. This is a jsPsych extension that allows you to add video recording to the trial. The trial will start once the video recording has been set up, and the video recording will finish as soon as the trial has ended.

!!! important "When to use trial recording"

Trial recording should NOT occur simultaneously with session recording, or with any plugins that already use the webcam (e.g. video config, video consent).

To use the CHS trial recording extension, you need to:

  1. Add it to the experiment settings, which is an optional object passed to initjsPsych.
  2. Add it to the extensions parameter for any trial(s) that you want to be recorded.

!!! caution "Don't forget a video config trial!"

You MUST have a video config trial in your experiment timeline before doing any trial recording.

Parameters

wait_for_upload_message [null or HTML string | null ]

This parameter determines what content should be displayed while the trial recording is uploading. If null (the default), then the message 'uploading video, please wait...' (or appropriate translation based on locale) will be displayed. Otherwise this parameter can be set to a custom string and can contain HTML markup. If you want to embed images/video/audio in this HTML string, be sure to preload the media files with the preload plugin and manual preloading. Use a blank string ("") for no message/content. If a value is provided then the locale parameter will be ignored.

Examples

Basic usage

To record a single trial, you will have to first load the extension in initJsPsych.

const jsPsych = initJsPsych({
  extensions: [{ type: chsRecord.TrialRecordExtension }],
});

Next, create a video configuration trial as described above. Then, add the trial recoding extension parameter to your trial. By adding this extension, you can record any trial you design.

const trialRec = {
  // ... Other trial parameters ...
  extensions: [{ type: chsRecord.TrialRecordExtension }],
};

Finally, insert the trials into the timeline.

jsPsych.run([videoConfig, trialRec]);

Setting parameters

You can set the trial extension parameters when you load the extension with initJsPsych.

In the example below, the default "uploading video, please wait..." message will be displayed in French while a trial recording is uploading at the end of the trial.

const jsPsych = initJsPsych({
  extensions: [
    {
      type: chsRecord.TrialRecordExtension,
      params: { locale: "fr" },
    },
  ],
});

And in this example, the custom message "Please wait!" will be displayed while the trial recording is uploading. You can include any HTML-formatted content in this string, which means you can display images, videos, animations etc.

const jsPsych = initJsPsych({
  extensions: [
    {
      type: chsRecord.TrialRecordExtension,
      params: { wait_for_upload_message: "<div>Please wait!</div>" },
    },
  ],
});

You can also set the parameters within individual trials. This will override any parameters set during the extension initialization (in initJsPsych), which can be useful if you want to change the parameter values during the experiment. In this example, the wait_for_upload_message is set to an empty string, which will prevent the default "uploading video, please wait..." message from appearing after the trial finishes.

const trialRec = {
  // ... Other trial parameters ...
  extensions: [
    {
      type: chsRecord.TrialRecordExtension,
      params: { wait_for_upload_message: "" },
    },
  ],
};

Session Recording

You might prefer to record across multiple trials in a study session. This can be done by using trials created with the start and stop recording plugins. This gives a bit of flexibility over which of the study trials are recorded.

!!! important "When to use session recording"

Sesssion recording should NOT occur simultaneously with trial recording, or with any plugins that already use the webcam (e.g. video config, video consent).

To record a set of trials, add a 'start' trial in your jsPsych experiment timeline right before you'd like to start recording, and add a 'stop' trial at the point in your timeline when you'd like to stop recording.

!!! caution "Don't forget a video config trial!"

You MUST have a video config trial in your experiment timeline before doing any session recording.

Start Recording Plugin

The plugin to start session recording is called chsRecord.StartRecordPlugin.

const startRec = { type: chsRecord.StartRecordPlugin };

Parameters

This plugin does not accept any parameters, other those available in all plugins.

Stop Recording Plugin

The plugin to stop session recording is called chsRecord.StopRecordPlugin.

const stopRec = { type: chsRecord.StopRecordPlugin };

When the trial starts, by default, this plugin will display "uploading video, please wait...", or the appropriate translation based on the locale parameter. This message can be customized using the wait_for_upload_message parameter, which is the HTML-formatted string to be displayed while the session recording is uploading.

const stopRec = {
  type: chsRecord.StopRecordPlugin,
  wait_for_upload_message:
    "<p style='color:red;'>Please wait while we upload your video.</p>",
};

Parameters

wait_for_upload_message [null or HTML string | null ]

This parameter determines what content should be displayed while the session recording is uploading. If null (the default), then the message 'uploading video, please wait...' (or appropriate translation based on locale) will be displayed. Otherwise this parameter can be set to a custom string and can contain HTML markup. If you want to embed images/video/audio in this HTML string, be sure to preload the media files with the preload plugin and manual preloading. Use a blank string ("") for no message/content. If a value is provided then the locale parameter will be ignored.

Examples

Basic usage

First, make sure that you've added a video config trial to your experiment timeline. Then, create your start and stop recording trials:

const startRec = { type: chsRecord.StartRecordPlugin };
const stopRec = { type: chsRecord.StopRecordPlugin };

Next, create the trials that you would like to be recorded.

const morning = { type: jsPsychHtmlKeyboardResponse, stimulus: "Good morning!" };
const evening = { type: jsPsychHtmlKeyboardResponse stimulus: "Good evening!" };
const night = { type: jsPsychHtmlKeyboardResponse, stimulus: "Good night!" };

Lastly, add these trials to the timeline. Again, the video configuration trial must come before any other recording trials.

jsPsych.run([videoConfig, startRec, morning, evening, night, stopRec]);

It's possible to record only some of the trials. This can be done by moving the stop or start recording trials within the timeline.

jsPsych.run([videoConfig, startRec, morning, evening, stopRec, night]);

You can also create more than one session recording:

jsPsych.run([
  videoConfig,
  startRec,
  morning,
  stopRec,
  evening,
  startRec,
  night,
  stopRec,
]);

Setting parameters

By default, the stop session recording plugin will display "uploading video, please wait..." while the session recording is uploading. You can set the locale parameter value to translate this message to another language. For example, the trial below will display the Brazilian Portuguese translation of this message. If the locale string does not match any of the translation codes that we support, then the message will be displayed in English.

const stopRec = {
  type: chsRecord.StopRecordPlugin,
  locale: "pt-br",
};

You can also set custom content to be displayed while the session recording file is uploading. The value must be a string. It can include HTML-formatted content, which means that you can embed audio, video, images etc. (be sure to preload any media files!).

const stopRec = {
  type: chsRecord.StopRecordPlugin,
  wait_for_upload_message: "<p style='color:red;'>Hang on a sec!</p>",
};