JS problem: image resource found when "constant", not when "set every frame"

Hi,

This is sort of a continuation of my previous thread: Experiment terminates right after the start - #9 by WilliamWundtHoltz

My experiment involves an image component in which I use an image file path to specify the content of the image component. When compiled to JS, however, the “image” argument of the image component in JS remains “undefined”. But this is only the case when I choose “set every frame” from the drop-down menu of that component in the Builder. The argument is correctly set in the JS code when I choose “constant” instead.

How is this possible?

Please have a look at the thread linked above for more detail on my experiment.

Cheers,
Michael

Hi Michael,

If an image is set to constant, it is set at the start of the experiment.

If it is set to every frame then it is set as undefined at the start of the experiment and then gets set as a value in the first frame of the routine.

Thanks, but I’m still a bit puzzled. I think I understand the distinction the two options.

… then gets set as a value in the first frame of the routine.

I have now moved the code block up in the hierarchy to make sure that the string variable specifying the location of the image file is processed before the consent_sheet component (may matter less on JS as everything is simultaneous). But still, the image argument of that component remains undefined in the “set every frame” option.

If this is not yet supported, I could probably change my design just a little bit adapt to those constraints… (User chooses language in the start and that’s it.)

I was just surprised that this does not seem to work in the set every frame scenario.

Hello WilliamWundtHoltz

no, when an image is set to constant the Builder writes the JS in manner that the image is read at the start of the experiment. If mage is set to every frame, the code is written such that the image is read when it is needed. So moving the code up in the hierarchy does not help.

What you try to achieve is not a big deal in PsychoPy. You just need it to do as PsychoPy wants you to do it :wink: which might not be easy sometimes. Anyway, the easiest way to load stimuli is to use an Excel-file and loop through that file. If you need different stimuli for different groups of participants you either use two (or more) Excel-files or read only parts of an Excel-file containing all stimuli.

Best wishes Jens

Thanks, Jens.

Apologies for not being very clear. It runs fine on PsychoPy. The problem is that it does not work online in JS. Perhaps I should have put this in the title rather than just using the online tag for this thread. I edited the title now so that everyone is one the same page. :slight_smile:

Please could you show the exact error message you are getting?

Here is the output of the Console in Developer Tools:

WebGL context was lost. isWebGLSupported.ts:44:36
WARN 10:32:20.534 node_modules/log4javascript/log4javascript.js/</PatternLayout.prototype.format psychojs-2021.2.3.js:7 | setting the image of ImageStim: consent_sheet with argument: undefined. log4javascript.js:148:83
WARN 10:32:20.534 node_modules/log4javascript/log4javascript.js/</PatternLayout.prototype.format psychojs-2021.2.3.js:7 | setting the value of attribute: image in PsychObject: consent_sheet as: undefined log4javascript.js:148:83
WARN 10:32:20.534 node_modules/log4javascript/log4javascript.js/</PatternLayout.prototype.format psychojs-2021.2.3.js:7 | setting the mask of ImageStim: consent_sheet with argument: undefined. log4javascript.js:148:83
WARN 10:32:20.535 node_modules/log4javascript/log4javascript.js/</PatternLayout.prototype.format psychojs-2021.2.3.js:7 | setting the value of attribute: mask in PsychObject: consent_sheet as: undefined log4javascript.js:148:83
WARN 10:32:20.536 node_modules/log4javascript/log4javascript.js/</PatternLayout.prototype.format psychojs-2021.2.3.js:7 | setting the value of attribute: size in PsychObject: read_consent_sheet as: undefined log4javascript.js:148:83
WARN 10:32:20.539 node_modules/log4javascript/log4javascript.js/</PatternLayout.prototype.format psychojs-2021.2.3.js:7 | setting the mask of ImageStim: adenauer with argument: undefined. log4javascript.js:148:83
WARN 10:32:20.540 node_modules/log4javascript/log4javascript.js/</PatternLayout.prototype.format psychojs-2021.2.3.js:7 | setting the value of attribute: mask in PsychObject: adenauer as: undefined log4javascript.js:148:83
WARN 10:32:20.540 node_modules/log4javascript/log4javascript.js/</PatternLayout.prototype.format psychojs-2021.2.3.js:7 | setting the mask of ImageStim: union_jack with argument: undefined. log4javascript.js:148:83
WARN 10:32:20.540 node_modules/log4javascript/log4javascript.js/</PatternLayout.prototype.format psychojs-2021.2.3.js:7 | setting the value of attribute: mask in PsychObject: union_jack as: undefined log4javascript.js:148:83
WARN 10:32:20.541 node_modules/log4javascript/log4javascript.js/</PatternLayout.prototype.format psychojs-2021.2.3.js:7 | setting the value of attribute: size in PsychObject: german_switch as: undefined log4javascript.js:148:83
WARN 10:32:20.543 node_modules/log4javascript/log4javascript.js/</PatternLayout.prototype.format psychojs-2021.2.3.js:7 | setting the value of attribute: size in PsychObject: english_switch as: undefined log4javascript.js:148:83
WARN 10:32:20.545 node_modules/log4javascript/log4javascript.js/</PatternLayout.prototype.format psychojs-2021.2.3.js:7 | setting the value of attribute: size in PsychObject: read_instructions as: undefined log4javascript.js:148:83
WARN 10:32:20.553 node_modules/log4javascript/log4javascript.js/</PatternLayout.prototype.format psychojs-2021.2.3.js:7 | the Pixi.js representation of this stimulus is undefined. log4javascript.js:148:83
WebGL context was lost.

Hello

well, the fact that it runs offline might be due to the fact that PsychoPy is much better in guessing what image you intend to show than PsychoJS is. PsychoJS requires the correct path, extension, filename-case aso. which PsychoPy does not.

The error message seems to be, more or less, the same as before (Experiment terminates right after the start - #6 by wakecarter).

So, your code adaptations did not solve the problem.

You might want to give access to your project or upload a toy-version of your experiment incl. stimuli.

Best wishes Jens

Sure, the messages are the same. I just switched to a different thread because the problem of why the experiment terminated right after the start has been solved. The remainder of the problem would have been mislabeled by the thread title.

Hello,

do you happen to have the images as well and do not mind uploading them here? What do you want to achieve in this routine?

Best wishes Jens

Hello WilliamWundtHoltz

do you mind to follow the inquires mentioned above? Upload all pictures, images of the relevant routine and give a description what the routine should look like. The description should as be detailed as in the Method section of a paper. It not my job to figure out what you want and to supply some images to get your routine to run.

Best wishes Jens

1 Like

Hi,
I have made a self-contained version of the “experiment” available as a zip file for download at this location. I have tested that it shows the behavior which I have described. In the methods section I would describe this procedure as follows: “Before the experiment started, we obtained informed consent from the participants in their preferred language (either German or English).”
Cheers,
Michael

Hello WilliamWundtHoltz

I had to split your routine in two routines to get it running online.

present_consent_form.psyexp (26.3 KB)

BTW, you do not need to add a polygon to have a clickable object, simply name the image.

Best wishes Jens

1 Like

Dear Jens,
Thanks very much for your time and effort. This is a very clever way to address the problem :+1:. I’ll go with this straightforward solution and leave it to future generations of the PsychoPy community users to sort out how to do this “dynamically”.
Cheers,
Michael