@adp-psych/jspsych-plugin-html

1.1.3 • Public • Published

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

Copyright © 2020, 2021, 2022 Anthony Di Pietro

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/.

Readme

Keywords

Package Sidebar

Install

npm i @adp-psych/jspsych-plugin-html

Weekly Downloads

1

Version

1.1.3

License

AGPL-3.0-or-later

Unpacked Size

44.4 kB

Total Files

4

Last publish

Collaborators

  • adp-psych