Commit 1fdbfaa0 authored by Peiling Jiang's avatar Peiling Jiang

merge valid-ans

parents d5e93e48 5920a717
export function getAlphabetShowPos(showWhere) {
function getAlphabetShowPos(ele, showWhere) {
switch (showWhere) {
case "bottom":
return [0, -window.innerHeight * 0.3];
ele.style.marginTop = "40%";
break;
default:
return [0, -window.innerHeight * 0.3];
ele.style.marginTop = "40%";
break;
}
}
export function getAlphabetShowText(valid) {
return valid.join(" ");
}
export function setupClickableAlphabet(ans, font, where, responseRegister) {
const alphabetHolder = document.createElement("div");
alphabetHolder.id = "alphabet-holder";
alphabetHolder.className = "alphabet-holder";
alphabetHolder.style.fontFamily = font;
getAlphabetShowPos(alphabetHolder, where);
for (let a of ans) {
let alphabet = document.createElement("span");
alphabet.className = "alphabet";
alphabet.innerText = a;
alphabet.onclick = () => {
responseRegister.clickTime = performance.now();
responseRegister.current = a;
};
alphabetHolder.appendChild(alphabet);
}
document.body.appendChild(alphabetHolder);
return alphabetHolder;
}
export function removeClickableAlphabet() {
const ele = document.querySelectorAll(".alphabet-holder");
ele.forEach((e) => {
document.body.removeChild(e);
});
}
#alphabet-holder {
z-index: 999999;
font-size: 3rem;
max-width: 100%;
}
#alphabet-holder .alphabet {
padding: 0.5rem 1rem;
border-radius: 5px;
box-sizing: border-box;
border: 2px solid rgba(0, 0, 0, 0);
}
#alphabet-holder .alphabet:hover {
border-color: black;
cursor: pointer;
}
......@@ -10,7 +10,8 @@
href="https://cdn.jsdelivr.net/npm/jquery-ui-dist@1.12.1/jquery-ui.min.css"
/>
<link rel="stylesheet" href="./lib/psychojs-2021.3.0.css" />
<link rel="stylesheet" href="./lib/custom.css" />
<link rel="stylesheet" href="./css/custom.css" />
<link rel="stylesheet" href="./css/showAlphabet.css" />
<!-- Remote Calibrator -->
<script src="https://cdn.jsdelivr.net/npm/remote-calibrator@0.2.1/lib/RemoteCalibrator.min.js"></script>
</head>
......
......@@ -21,7 +21,7 @@ import * as jsQUEST from "./lib/jsQUEST.module.js";
import { shuffle } from "./components/utils.js";
import { playCorrectSynth, playPurrSynth } from "./components/sound.js";
import { getAlphabetShowPos, getAlphabetShowText } from "./components/showAlphabet.js";
import { removeClickableAlphabet, setupClickableAlphabet } from "./components/showAlphabet.js";
/* -------------------------------------------------------------------------- */
......@@ -645,7 +645,9 @@ const experiment = (blockCount) => {
var targetFont;
var targetAlphabet;
var validAns;
var showAlphabetWhere
var showAlphabetWhere;
var showAlphabetElement;
const showAlphabetResponse = { current: null, onsetTime: 0, clickTime: 0 }
var targetDurationSec;
var fixationSizeNow;
var targetMinimumPix;
......@@ -827,10 +829,9 @@ const experiment = (blockCount) => {
flanker2.setFont(targetFont);
flanker2.setHeight(heightPx);
showAlphabet.setPos(getAlphabetShowPos(showAlphabetWhere))
showAlphabet.setText(getAlphabetShowText(validAns))
showAlphabet.setFont(targetFont)
showAlphabet.setHeight(50)
showAlphabet.setPos([0, 0])
showAlphabet.setText('')
// showAlphabet.setText(getAlphabetShowText(validAns))
// keep track of which components have finished
trialComponents = [];
......@@ -879,6 +880,9 @@ const experiment = (blockCount) => {
// keep track of start time/frame for later
key_resp.tStart = t; // (not accounting for frame time here)
key_resp.frameNStart = frameN; // exact frame index
// TODO Use PsychoJS clock if possible
// Reset together with PsychoJS
showAlphabetResponse.onsetTime = performance.now()
// keyboard checking is just starting
psychoJS.window.callOnFlip(function () {
......@@ -915,6 +919,23 @@ const experiment = (blockCount) => {
}
}
// *showAlphabetResponse* updates
if (showAlphabetResponse.current) {
key_resp.keys = showAlphabetResponse.current
key_resp.rt = (showAlphabetResponse.clickTime - showAlphabetResponse.onsetTime) / 1000
if (showAlphabetResponse.current == correctAns) {
// Play correct audio
correctAudio.play()
key_resp.corr = 1;
} else {
// Play wrong audio
key_resp.corr = 0;
}
showAlphabetResponse.current = null
removeClickableAlphabet()
continueRoutine = false;
}
// *fixation* updates
if (t >= 0.0 && fixation.status === PsychoJS.Status.NOT_STARTED) {
// keep track of start time/frame for later
......@@ -989,12 +1010,14 @@ const experiment = (blockCount) => {
showAlphabet.frameNStart = frameN; // exact frame index
showAlphabet.setAutoDraw(true);
showAlphabetElement = setupClickableAlphabet(validAns, targetFont, showAlphabetWhere, showAlphabetResponse)
}
/* -------------------------------------------------------------------------- */
// check if the Routine should terminate
if (!continueRoutine) {
// a component has requested a forced-end of Routine
removeClickableAlphabet()
return Scheduler.Event.NEXT;
}
......@@ -1027,14 +1050,7 @@ const experiment = (blockCount) => {
}
// was no response the correct answer?!
if (key_resp.keys === undefined) {
if (["None", "none", undefined].includes(correctAns)) {
// Play correct audio
playCorrectSynth()
key_resp.corr = 1; // correct non-response
} else {
// Play wrong audio
key_resp.corr = 0; // failed to respond (incorrectly)
}
console.error('[key_resp.keys] No response error.');
}
// store data for psychoJS.experiment (ExperimentHandler)
// update the trial handler
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment