From fed41a5ed50489cc03563e90255632c8b89a4244 Mon Sep 17 00:00:00 2001
From: J Muchovej <jmuchovej@users.noreply.github.com>
Date: Fri, 18 Mar 2022 16:05:38 -0400
Subject: [PATCH] Adds case-sensitivty to ClozePlugin

---
 packages/plugin-cloze/src/index.ts | 39 ++++++++++++++++++------------
 1 file changed, 24 insertions(+), 15 deletions(-)

diff --git a/packages/plugin-cloze/src/index.ts b/packages/plugin-cloze/src/index.ts
index 71ae791e90..a404be900c 100644
--- a/packages/plugin-cloze/src/index.ts
+++ b/packages/plugin-cloze/src/index.ts
@@ -7,27 +7,33 @@ const info = <const>{
     text: {
       type: ParameterType.HTML_STRING,
       pretty_name: "Cloze text",
-      default: undefined,
+      default: undefined
     },
     /** Text of the button participants have to press for finishing the cloze test. */
     button_text: {
       type: ParameterType.STRING,
       pretty_name: "Button text",
-      default: "OK",
+      default: "OK"
     },
     /** Boolean value indicating if the answers given by participants should be compared against a correct solution given in the text (between % signs) after the button was clicked. */
     check_answers: {
       type: ParameterType.BOOL,
       pretty_name: "Check answers",
-      default: false,
+      default: false
     },
     /** Function called if check_answers is set to TRUE and there is a difference between the participants answers and the correct solution provided in the text. */
     mistake_fn: {
       type: ParameterType.FUNCTION,
       pretty_name: "Mistake function",
-      default: () => {},
+      default: () => {
+      }
     },
-  },
+    case_sensitive: {
+      type: ParameterType.BOOL,
+      default: false,
+      pretty_name: "Case Sensitive"
+    }
+  }
 };
 
 type Info = typeof info;
@@ -43,12 +49,13 @@ type Info = typeof info;
 class ClozePlugin implements JsPsychPlugin<Info> {
   static info = info;
 
-  constructor(private jsPsych: JsPsych) {}
+  constructor(private jsPsych: JsPsych) {
+  }
 
   trial(display_element: HTMLElement, trial: TrialType<Info>) {
-    var html = '<div class="cloze">';
+    var html = "<div class=\"cloze\">";
     var elements = trial.text.split("%");
-    const solutions = this.getSolutions(trial.text);
+    const solutions = this.getSolutions(trial.text, trial.case_sensitive);
 
     let solution_counter = 0;
     for (var i = 0; i < elements.length; i++) {
@@ -69,7 +76,8 @@ class ClozePlugin implements JsPsychPlugin<Info> {
 
       for (var i = 0; i < solutions.length; i++) {
         var field = document.getElementById("input" + i) as HTMLInputElement;
-        answers.push(field.value.trim());
+        var answer = trial.case_sensitive ? field.value.toLowerCase() : field.value;
+        answers.push(answer.trim());
 
         if (trial.check_answers) {
           if (answers[i] !== solutions[i]) {
@@ -83,7 +91,7 @@ class ClozePlugin implements JsPsychPlugin<Info> {
 
       if (!trial.check_answers || (trial.check_answers && answers_correct)) {
         var trial_data = {
-          response: answers,
+          response: answers
         };
 
         display_element.innerHTML = "";
@@ -94,18 +102,19 @@ class ClozePlugin implements JsPsychPlugin<Info> {
     };
 
     display_element.innerHTML +=
-      '<br><button class="jspsych-html-button-response-button" type="button" id="finish_cloze_button">' +
+      "<br><button class=\"jspsych-html-button-response-button\" type=\"button\" id=\"finish_cloze_button\">" +
       trial.button_text +
       "</button>";
     display_element.querySelector("#finish_cloze_button").addEventListener("click", check);
   }
 
-  private getSolutions(text: string) {
+  private getSolutions(text: string, case_sensitive: boolean) {
     const solutions = [];
     const elements = text.split("%");
     for (let i = 0; i < elements.length; i++) {
       if (i % 2 == 1) {
-        solutions.push(elements[i].trim());
+        const solution = case_sensitive ? elements[i].toLowerCase() : elements[i];
+        solutions.push(solution.trim());
       }
     }
 
@@ -139,7 +148,7 @@ class ClozePlugin implements JsPsychPlugin<Info> {
     }
 
     const default_data = {
-      response: responses,
+      response: responses
     };
 
     const data = this.jsPsych.pluginAPI.mergeSimulationData(default_data, simulation_options);
@@ -163,7 +172,7 @@ class ClozePlugin implements JsPsychPlugin<Info> {
     this.trial(display_element, trial);
     load_callback();
 
-    const inputs = display_element.querySelectorAll('input[type="text"]');
+    const inputs = display_element.querySelectorAll("input[type=\"text\"]");
     let rt = this.jsPsych.randomization.sampleExGaussian(750, 200, 0.01, true);
     for (let i = 0; i < data.response.length; i++) {
       this.jsPsych.pluginAPI.fillTextInput(inputs[i] as HTMLInputElement, data.response[i], rt);