Hi,
In that case what I would do is list all the words in a single cell (named “Words” for example) and use Var elements to dynamically update the content of the Text element upon pressing the key:
Template("new--Items_Wide.csv", row =>
newTrial("listOfWords",
fullscreen()
,
newMediaRecorder("recorder", "audio").log().record()
,
newTimer("recording", 3000).log().start()
,
newText("words", row.Words.split('_').slice(0,10).join("<br>")) // use slice to get the 10 first words
.cssContainer({
padding: '0.5em',
'text-align': 'center',
"justify-content": 'center',
"align-items": 'center' ,
'font-size': '50px',
})
.print()
,
newVar("listOfWords", ""), // we'll set this Var element to the next list of words
newVar("nextWordStartsAt").set(10) // this is the index where the next 10 words start
,
newKey("NEXT", " ")
.callback(
// first make sure that the index is within bounds
getVar("nextWordStartsAt").test.is(v=>v<row.Words.split('_').length).success(
// set listOfWords to the next words
getVar("listOfWords")
.set(getVar("nextWordStartsAt")) // first look up the index
.set(v=>row.Words.split('_').slice(v,v+10).join("<br>")) // then use the index+slice to get the next 10 words
,
getText("words").text( getVar("listOfWords") ) // update the content of the Text element
,
getVar("nextWordStartsAt").set(v=>v+10) // the next list of 10 words starts 10 words further
)
)
,
getTimer("recording").wait()
,
getMediaRecorder("recorder").stop()
,
getText("words").remove()
,
newText('time-is-up-msg', "Time is up!").print()
,
newButton('btn--finish--game', 'Finish Game').print().wait()
)
)
Jeremy