Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Adds case-sensitivty to ClozePlugin #2550

Draft
wants to merge 1 commit into
base: main
Choose a base branch
from
Draft

Adds case-sensitivty to ClozePlugin #2550

Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
39 changes: 24 additions & 15 deletions packages/plugin-cloze/src/index.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -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;
Expand All @@ -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++) {
Expand All @@ -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]) {
Expand All @@ -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 = "";
Expand All @@ -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());
}
}

Expand Down Expand Up @@ -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);
Expand All @@ -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);
Expand Down