PennController for IBEX › Forums › Support › Select more than one image › Reply To: Select more than one image
October 18, 2021 at 6:49 pm
#7389
Keymaster
Hi,
The Selector element does not come with the option to be an on/off switch by default, so you need to work around that to get what you want. In this case, you could use the same javascript randomizing method I employed in my other thread’s message, and create a Selector element for each Image element, and keep track of its status with a dedicated Var element, and then you can use a callback command to select/unselect accordingly:
makeImageSelector = imageName => newSelector("s"+imageName).add(getImage(imageName)).callback(
getSelector("simage5").unselect(),
newVar(imageName+"Selected",false).global().set(v=>true-v)
.test.is(false).success( getSelector("s"+imageName).unselect() )
)
// Testing trials for individual mapping
Template("testing-mapping-individual.csv", row =>
newTrial("testing-mapping-individual",
images = [row.image1,row.image2,row.image3,row.image4].sort(v=>0.5-Math.random()),
newTimer("break", 1000)
.start()
.wait()
,
newAudio("audio", row.audio)
.play()
,
newText("sentence", row.sentence)
.center()
.print()
,
newButton("dummy")
,
defaultSelector.frame("solid 2px purple").callback( getButton("dummy").click() ).log()
,
defaultImage.size(200,200)
,
newImage("image1", images[0]),
makeImageSelector("image1")
,
newImage("image2", images[1]),
makeImageSelector("image2")
,
newImage("image3", images[2]),
makeImageSelector("image3")
,
newImage("image4", images[3]),
makeImageSelector("image4")
,
newImage("image5", 'none.png'),
newSelector("simage5").add(getImage("image5")).callback(
getSelector("simage1").unselect(),
getSelector("simage2").unselect(),
getSelector("simage3").unselect(),
getSelector("simage4").unselect(),
getVar("image1selected").set(false),
getVar("image2selected").set(false),
getVar("image3selected").set(false),
getVar("image4selected").set(false)
)
,
newCanvas("side-by-side", 600,600)
.add( 0, 0, getImage("image1"))
.add(400, 0, getImage("image2"))
.add( 0, 400, getImage("image3"))
.add(400, 400, getImage("image4"))
.add(200, 200, getImage("image5"))
.center()
.print()
,
getButton("dummy").wait()
,
newButton("click", "Done!")
.center()
.print()
.wait()
,
getAudio("audio")
.wait("first")
)
.log("item", row.item)
.log("task", row.task)
.log("level", row.level)
.log("label", row.label)
.log("answer", row.answer)
.log("image1", images[0])
.log("image2", images[1])
.log("image3", images[2])
.log("image4", images[3])
.log("image5", 'none.png')
.log("image1selected", getVar("image1selected"))
.log("image2selected", getVar("image2selected"))
.log("image3selected", getVar("image3selected"))
.log("image4selected", getVar("image4selected"))
);
Jeremy