README

jsPsych HTML Plugin

A jsPsych plugin to display HTML.

Usage

Installation

Install the package from npm (requires Node.js):

npm install --save @adp-psych/jspsych-plugin-html

Example

import jspsychPluginHtml from '@adp-psych/jspsych-plugin-html';
import {initJsPsych} from 'jspsych';

const consentFormHtml = `
    <article id="pcf" class="instructions">
        <h1>Participant Consent Form</h1>
        <p>
            I, the participant, have read the information provided
            and any questions I have asked have been answered to my
            satisfaction.  I agree to participate in this research
            project but withdrawal is not possible once data are
            submitted.
        </p>
        <form id="consent-form">
            <label>
                <input type="checkbox" id="consent" />
                I agree to the above declaration of consent.
            </label>
            <p id="consent-error" class="error"></p>
            <button type="button" class="jspsych-btn" id="begin">
                Begin Experiment
            </button>
        </form>
    </article>
`;

const isNil = (x) => typeof x === 'undefined' || x === null;

const consentErrorMessage =
    'You must agree to the consent declaration before you may begin.';

const checkConsent = () => {
    if (document?.querySelector('#consent')?.checked) {
        return true;
    }
    const consentError = document?.querySelector('#consent-error');
    if (!isNil(consentError)) {
        consentError.textContent = consentErrorMessage;
    }
    return false;
};

const idTimelineNode = {
    'check_fn': checkConsent,
    'cont_btn': 'begin',
    'html': consentFormHtml,
    'type': jspsychPluginHtml,
};

initJsPsych().run([idTimelineNode]);

Development

Cleaning

Remove generated files:

npm run clean

Documentation

Generate documentation into the doc directory with JSDoc:

npm run doc

Linting

Lint the project with ESLint and npm-package-json-lint:

npm run lint

Testing

Run unit tests:

npm run test

Dependencies

Check for new dependencies with npm-check:

npm run npm-check

Release

Publish a release with np:

npm run release

Legal Information

Copyright

License

This program is free software: you can redistribute it and/or modify it under the terms of the GNU Affero General Public License as published by the Free Software Foundation, either version 3 of the License, or (at your option) any later version.

This program is distributed in the hope that it will be useful, but WITHOUT ANY WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU Affero General Public License for more details.

You should have received a copy of the GNU Affero General Public License along with this program. If not, see https://www.gnu.org/licenses/.

Usage no npm install needed!