Hello all!
I’m working on a Self-paced Reading task with a Moving window design where all words in a sentence are initially covered by dashes until the participant presses space and the first region (with multiple words) displays. Once they click again, that first region will be covered by dashes again and the second region will be displayed and so on.
Below is my JS code component to achieve this. I’ve put commas between regions in my csv and coded sentenceList to split based on those commas. This way, rather than regions being word by word, it’ll be region by region which can contain multiple words.
Begin Routine:
sentenceList = Sentence.split(",");
wordNumber = (- 2);
Each Frame:
var _pj;
function replaceWithdash(sentenceList, currentWordNumber) {
var index, result, word;
result = "";
index = 0;
while ((index < sentenceList.length)) {
word = sentenceList[index];
if ((index !== currentWordNumber)) {
result = ((result + ("-".repeat(word.length))) + " ");
} else {
result = ((result + word) + " ");
}
index = (index + 1);
}
return result;
}
function _pj_snippets(container) {
function in_es6(left, right) {
if (((right instanceof Array) || ((typeof right) === "string"))) {
return (right.indexOf(left) > (- 1));
} else {
if (((right instanceof Map) || (right instanceof Set) || (right instanceof WeakMap) || (right instanceof WeakSet))) {
return right.has(left);
} else {
return (left in right);
}
}
}
container["in_es6"] = in_es6;
return container;
}
_pj = {};
_pj_snippets(_pj);
Trials_Display.text = replaceWithdash(sentenceList, wordNumber);
keypresses = psychoJS.eventManager.getKeys();
if ((keypresses.length > 0)) {
if (_pj.in_es6("space", keypresses)) {
thisResponseTime = t;
wordNumber = (wordNumber + 1);
if ((wordNumber < sentenceList.length)) {
if ((wordNumber === 0)) {
timeOfLastResponse = 0;
}
thisExp.addData(("IRI_" + wordNumber.toString()), (thisResponseTime - timeOfLastResponse));
timeOfLastResponse = thisResponseTime;
Trials_Display.text = replaceWithdash(sentenceList, wordNumber);
} else {
continueRoutine = false;
}
} else {
if (_pj.in_es6("escape", keypresses)) {
core.quit();
}
}
}
My problem comes with the display of the dashes. Like I said, I define the regions using commas, so in the replaceWithdash function defined above, I was able to basically say ‘cover regions with the same amount of dashes as their length and then put a space after that’. With that code, this is the display:
------ --- ------
The dog --- ------
Notice there is a space between regions (so here there would be three regions), but there’s no space between the words in those regions when they are all dashes
However, my goal is for the participant to be able to see how many words there are in total in the sentence before clicking region by region, so I need spaces between the words rather than the regions. Like this:
--- --- --- --- ---
The dog --- --- ---
Now, the participant can see how many words there are total with all the spaces between them but the regions are still the same.
What I tried so far:
I don’t know a ton about JS but I figured I would need to define word boundaries and region boundaries with separate delimiters (a comma for regions and an underscore for words). I basically only got that far though because, in the replaceWithdash function it needs to read region by region in order to display things correctly (I’m pretty sure). I have no idea how to also tell it to create spaces word by word. Maybe I need to make another variable for the word boundary delimiter? Something like
wordList = Sentence.split("_");
and then do something with that? Or is there another area about keypress display I can mess with?
Any help would be appreciated!!
Shannon
