feature: text to speech with button response and keboard response

.changeset/orange-books-rush.md

@@ -0,0 +1,6 @@
+---
+"@jspsych-contrib/plugin-text-to-speech-button-reponse": major
+"@jspsych-contrib/plugin-text-to-speech-keyboard-response": major
+---
+
+adding text to speech with a button response and keyboard response

packages/plugin-text-to-speech-button-response/README.md

@@ -0,0 +1,35 @@
+# text-to-speech-button-response
+
+## Overview
+
+Displays text, reasd to participant using SpeechSynthesis, has buttons for responses
+
+## Loading
+
+### In browser
+
+```js
+<script src="https://unpkg.com/@jspsych-contrib/[email protected]"></script>
+```
+
+### Via NPM
+
+```
+npm install @jspsych-contrib/plugin-text-to-speech-button-response
+```
+
+```js
+import jsPsychTextToSpeechButtonResponse from '@jspsych-contrib/plugin-text-to-speech-button-response';
+```
+
+## Compatibility
+
+jsPsych 7.0.0
+
+## Documentation
+
+See [documentation](https://github.com/jspsych/jspsych-contrib/blob/main/packages/plugin-text-to-speech-button/docs/jspsych-text-to-speech-button-response.md)
+
+## Author / Citation
+
+[Cian Monnin](https://github.com/CMonnin)

packages/plugin-text-to-speech-button-response/docs/text-to-speech-button-reponse.md

@@ -0,0 +1,69 @@
+# text-to-speech-button-response
+
+Displays text, reads to participant using SpeechSynthesis, has buttons for responses
+
+## Parameters
+
+In addition to the [parameters available in all plugins](https://jspsych.org/latest/overview/plugins.md#parameters-available-in-all-plugins), this plugin accepts the following parameters. Parameters with a default value of undefined must be specified. Other parameters can be left unspecified if the default value is acceptable.
+
+| Parameter           | Type           | Default Value                                                 | Description                                                                                                               |
+| ------------------- | -------------- | ------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------- |
+| stimulus            | STRING         | undefined                                                     | The text to be displayed and converted into speech.                                                                       |
+| choices             | STRING (array) | undefined                                                     | Labels for the buttons. Each string in the array generates a different button.                                            |
+| lang                | STRING         | "en-US"                                                       | The language of the voice for the speechSynthesis API. Falls back to 'en-US'. Depends on available system/browser voices. |
+| button_html         | FUNCTION       | (choice)=>{}`<button class="jspsych-btn">${choice}</button>`} | Function that generates HTML for each button.                                                                             |
+| prompt              | HTML_STRING    | null                                                          | HTML content displayed below the stimulus, typically a reminder of the action to take.                                    |
+| stimulus_duration   | INT            | null                                                          | Time in milliseconds to display the stimulus. If null, the stimulus remains visible until the trial ends.                 |
+| trial_duration      | INT            | null                                                          | Time limit in milliseconds for the participant to respond. If null, the trial waits indefinitely for a response.          |
+| button_layout       | STRING         | "grid"                                                        | Layout for buttons. 'grid' makes the container a grid, 'flex' makes it a flexbox.                                         |
+| grid_rows           | INT            | 1                                                             | Number of rows in the button grid. Applicable when `button_layout` is set to 'grid'.                                      |
+| grid_columns        | INT            | null                                                          | Number of columns in the button grid. Applicable when `button_layout` is set to 'grid'.                                   |
+| response_ends_trial | BOOL           | true                                                          | If true, the trial ends when the participant responds. If false, the trial continues until trial_duration is reached.     |
+| enable_button_after | INT            | 0                                                             | Delay in milliseconds before enabling the buttons.                                                                        |
+
+## Data Generated
+
+In addition to the [default data collected by all plugins](https://jspsych.org/latest/overview/plugins.md#data-collected-by-all-plugins), this plugin collects the following data for each trial.
+
+| Name     | Type   | Value                                                                                          |
+| -------- | ------ | ---------------------------------------------------------------------------------------------- |
+| rt       | INT    | The response time in milliseconds.                                                             |
+| response | INT    | Indicates which button the participant pressed. 0 for the first button, 1 for the second, etc. |
+| stimulus | STRING | The string content that was displayed on the screen.                                           |
+
+## Install
+
+Using the CDN-hosted JavaScript file:
+
+```js
+<script src="https://unpkg.com/@jspsych-contrib/plugin-text-to-speech-button-response"></script>
+```
+
+Using the JavaScript file downloaded from a GitHub release dist archive:
+
+```js
+<script src="jspsych/plugin-text-to-speech-button-response.js"></script>
+```
+
+Using NPM:
+
+```
+npm install @jspsych-contrib/plugin-text-to-speech-button
+```
+
+```js
+import TextToSpeechButtonResponse from '@jspsych-contrib/plugin-text-to-speech-button-response';
+```
+
+## Examples
+
+### Setting SpeechSynthesis voice to french
+
+```javascript
+    const trial= {
+      lang: 'fr-Fr',
+      stimulus: 'This is a string',
+      choices: ['Button A', 'Button B'],
+      type: TextToSpeechButtonResponse,
+    };
+```

packages/plugin-text-to-speech-button-response/examples/index.html

@@ -0,0 +1,22 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <script src="https://unpkg.com/jspsych"></script>
+    <!-- The plugin is loaded here -->
+    <script src="https://unpkg.com/@jspsych/plugin-text-to-speech-button-response"></script>
+    <script src="../dist/index.global.js"></script>
+    <link rel="stylesheet" href="https://unpkg.com/jspsych/css/jspsych.css" />
+  </head>
+
+  <body></body>
+  <script>
+    const jsPsych = initJsPsych();
+
+    const trial = {
+      type: jsPsychTextToSpeechButtonResponse
+    };
+
+    jsPsych.run([trial])
+  </script>
+</html>
+

packages/plugin-text-to-speech-button-response/jest.config.cjs

@@ -0,0 +1 @@
+module.exports = require("@jspsych/config/jest").makePackageConfig(__dirname);

packages/plugin-text-to-speech-button-response/package.json

@@ -0,0 +1,47 @@
+{
+  "name": "@jspsych-contrib/plugin-text-to-speech-button-reponse",
+  "version": "0.0.1",
+  "description": "Displays text, reasd to participant using SpeechSynthesis, has buttons for responses",
+  "type": "module",
+  "main": "dist/index.cjs",
+  "exports": {
+    "import": "./dist/index.js",
+    "require": "./dist/index.cjs"
+  },
+  "typings": "dist/index.d.ts",
+  "unpkg": "dist/index.browser.min.js",
+  "files": [
+    "src",
+    "dist"
+  ],
+  "source": "src/index.ts",
+  "scripts": {
+    "test": "jest",
+    "test:watch": "npm test -- --watch",
+    "tsc": "tsc",
+    "build": "rollup --config",
+    "build:watch": "npm run build -- --watch"
+  },
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/jspsych/jspsych-contrib.git",
+    "directory": "packages/plugin-text-to-speech-button-reponse"
+  },
+  "author": {
+    "name": "Cian Monnin",
+    "url": "https://github.com/CMonnin"
+  },
+  "license": "MIT",
+  "bugs": {
+    "url": "https://github.com/jspsych/jspsych-contrib/issues"
+  },
+  "homepage": "https://github.com/jspsych/jspsych-contrib/tree/main/packages/plugin-text-to-speech-button-reponse",
+  "peerDependencies": {
+    "jspsych": ">=7.0.0"
+  },
+  "devDependencies": {
+    "@jspsych/config": "^2.0.0",
+    "@jspsych/test-utils": "^1.0.0",
+    "jspsych": "^7.0.0"
+  }
+}

packages/plugin-text-to-speech-button-response/rollup.config.mjs

@@ -0,0 +1,3 @@
+import { makeRollupConfig } from "@jspsych/config/rollup";
+
+export default makeRollupConfig("jsPsychTextToSpeechButtonResponse");