Open alexandrakirby opened 4 months ago
Try replacing
<img id="distractor-image" src="{ $this.files[this.parameters.distractor] } /">
with either
<img id="distractor-image" src="{ $this.files[this.parameters.distractor] }" />
or even simply
<img id="distractor-image" src="{ $this.files[this.parameters.distractor] }">
(personally I prefer including the explicit "/>" to close the element, but that is a style issue).
Thanks @mcfarla9, I have tried this both ways and I am still receiving the same issue:
Perhaps I am not defining the parameter properly? I have done this in the loop section where the main stimuli is defined:
At this stage I would set aside the main project and work through some small demos in order to figure out how things work, then import what I learned into the main project.
In particular, here I would set aside all the scripting. I would make a demo that does nothing but present a sequence of stimulus images (using a Loop component) in a fixed order (I always save randomizaiton for the last step in development, it greatly simplifies the testing!). Then I would add a distractor image. Etc.
Anyway, I did some fussing around myself, and it looks like the following should work in your Content:
<img id="distractor-image" src=${this.files[this.parameters.distractor]} />
You have to pay attention to where each $, {}, and [] should go.
Oh, since you used this.files in your Content, I assumed that you were storing the distractor files directly within the stimulus component. But from your screen shot it looks like you are storing your distractor files out in the static area. That changes everything. In that case you would reduce that line in your Content to simply
<img id="distractor-image" src=${this.parameters.distractor} />
Or if in your Loop you would rather put just the distractor file names without "static/" at the front of each one, you could add the "static/" string in the Content thus
<img id="distractor-image" src="static/${this.parameters.distractor}" />
I am trying to help a dissertation student add distractor images to their N-Back test. For content, I am using the following html code:
In scripts, I am using the following JavaScript so that the letter for the N-Back appears in the centre of the screen, and the image randomly appears above, below, to the right, or to the left of the main stimulus:
When testing the study, a broken image link symbol appears in the bottom left corner. Can anyone help me adjust the code so that the image loads? There are three images files uploaded.