Opacity not updating every frame

URL of experiment: https://gitlab.pavlovia.org/chenxuh2/wedell-tasks

Description of the problem:
This is a task that has 6 rectangles on the screen overlaying text. Every frame update, there’s code to check if the mouse is currently positioned over one of the rectangles, and if so, make that rectangle transparent.
The code works in PsychoPy but wasn’t working on PsychoJS with version 2020.2. After reading this post, we tried setting the version to 2020.1 in the experiment settings, and it fixed the problem; the opacity updated correctly online. However, we then had to add a couple new components to the task. Again, the additions worked in python on the desktop, but compiling to JS no longer works and generates errors similar to what’s described here. (I think the task may have originally been developed in an older version of PsychoPy.)
Any suggestions how we can make additions with the new version of PsychoPy but still have the opacity updating every frame online?
Thanks in advance!

Hi There,

does this work in one of the newer releases? try the newest 2020.2.6 (I remember this being a bug that I think has been ironed out now).

Becca

Hello Becca,

Thank you for your fast response!
I have updated my PsychoPy to 2020.2.6 and re-synced the files while setting the version in the Experiment setting to “2020.2.6”. After syncing, the experiment page shows that the platform version is 2020.2. However, the opacity of polygons still does not change.
I wonder if this could be a lag between the run version and code modification?

Very interesting, out of curiosity - if you push a totally new project (that should have the new platform version) what happens then?

Becca

Hello Becca,

I tried to upload a new project (https://gitlab.pavlovia.org/chenxuh2/test-opacity) that contains only one box, whose opacity changes to 0 and reveals text information underneath when the mouse is hovering over. However, I think this project was not even sync-ed correctly as there was no html folder and try piloting the experiment creates a 403 error.

Another issue I have noticed with the original project besides opacity change is that although I set the mouse data (x, y positions) to be saved on every frame, the generated data file doesn’t have this information anymore. It used to contain an array of X positions and an array of Y positions for each trial but not it only has an array of a single X position and an array of a single Y position. I think this is also a recent change after I have updated the PsychoPy version recently.

Please let me know if I can find ways to fix these two problems as making them work is central to this task. Thank you very much!

Hi @Chenxu_Hao

Just making you aware that I am checking this out now - thanks for making an ideal minimally working example. This makes it easier to debug!

Becca

Hi @Chenxu_Hao,

OK after looking into this more this project should fix both issues you were asking about https://gitlab.pavlovia.org/lpxrh6/test_opacity/tree/master

The solutions are as follows:

  1. Setting opacity on every frame. This is a known issue and a fix will be pulled into the next release of PsychoJS, @sotiri outlined the solution here Opacity of Visual Stimuli not updating, but exiting full-screen updates them which is to make yourself a ‘custom-lib’ directory, make the fix there (implemented already in this version on line 48 and described in the linked post) and import the ‘custom-lib’ instead of ‘lib’ at the start of your experiment. Note, that until this fix is implemented in the main psychoJS release, you will need to change your experiment settings to be online> export html> manually (rather than on sync). Then you will make edits you your builder, build the html using file>export html, manually edit the import lines of you JS code to use 'custom-lib/ ’ and THEN sync (I am aware this is a fair few steps, but whilst not in the release this will fix the issue).
  2. saving mouse coordinates on every frame. To use this online you will also need ‘force end routine’ to be never. You can then add a second mouse component to end the routine (see project link).

Hope this helps :slight_smile:
Becca

3 Likes

Thank you so much! It is working now :slight_smile:

so pleased to hear!

1 Like

Hello Becca,
For manually export html, would it change if I change other things on the “online” tab of the experiment settings? For example, would the syncing process still be the same if I add completion URL?
Do I just sync directly or shall I re-export html & and then sync?

Thank you for your help!

Hi there,

should do! Make your edit to the completion url, export html manually, correct the first import lines of your .js to use the ‘custom-lib’ rather than ‘lib’ then sync :slight_smile:

Becca

1 Like

Hello Becca,

Thank you!

##--------------------------------------------------------------------##
Update: the issue below has been solved
##--------------------------------------------------------------------##
Thank you! I tried to enter the URL and export html again as you have suggested. However, the html folder on the GitLab page doesn’t seem to be changed at all.
##--------------------------------------------------------------------##
Update: the issue below has been solved: set psychoPy version to blank, manually export HTML, change lib to custom-lib/visual-2020.2-patch.js in the .js file, and then re-sync.
##--------------------------------------------------------------------##
Another question I have is whether there is a specific version of psychoPy I should use when I use custom-lib. After making some changes, the opacity doesn’t work again.

##--------------------------------------------------------------------##
Update: the issue below has been solved: seems to be compatibility issue, if psychoPy version is set to blank then files will be properly generated.
##--------------------------------------------------------------------##
I also tried to add some new components to the task (welcome page & thank you page). However, the changes that I have made are neither reflected in builder or online. It seems that when I add new components to the experiment, the only file that gets modified is the .psyexp file, but not .py, last run, or .js file.
I think the builder is not generating lastrun file at all. I updated the builder to 2.8 version but it doesn’t seem to help.
##--------------------------------------------------------------------##

I am experiencing the same problem: Updates in opacity of polygons after every frame are not reflected on the screen. They only reflect when the size of the window changes.

I am using PsychoPy version 2020.2.9

Hello Miguel,

You can use the solutions outlined above:

@Chenxu_Hao @Becca Thank you for the suggestion. Unfortunately the custom-lib approach is not working for me at all. Importing the whole library from the forked project in the link makes the visuals of my project behave very weirdly. And if I import only the patched visuals module instead of the default one, an error mentioning “TypeError: color.rgb is undefined” shows up at the very beginning of the experiment, which before it was not the case. @sotiri I wonder which are the changes that you made to the visual library to make it work back then. Maybe I can make those changes in the new version of the visuals module and make it work in the newer version that I am using.

Best,
Miguel

Hi @miguel_santin, that project was created using a different version of PsychoPy, could you send me a link to your repo?

Hello @sotiri I have a quite big memory project with different stages but I am currently struggling with the instructions of one of the stages. I want to show and hide text during the practice trials to guide people through them so they understand better what they have to do. To achieve this, I am using figures to hide and show the relevant content. Several months ago I tried to use only text components but hiding them with opacity did not work at all back then.

I put the instructions at the beginning of the experiment to make it easy to test and debug. I will later move them where they belong.

This is the link to the repository of my project: Miguel Santin / memory test · GitLab

One workaround that seems to work is to change the position of the visual stimuli to hide them or show them when needed.

Best,
Miguel

Hi @miguel_santin, thanks for the link. I must be missing something, because I was unable to reproduce the type error you mention. I have staged a support fork in pilot mode featuring the edits required for opacity changes to hopefully reflect on each frame. Could you give me some pointers as to where exactly in the study lies the problem? x

Hello @sotiri thank you for looking into it. I piloted the experiment in the support fork that you made and notice that the opacity of the figures is indeed updated with the patched visuals library that you included there. I tested it on my project by copying the whole script of your visuals library and pasting it to mine and the issue was solved as well. The only problem that I see now is that, when clicking on the play image (see the first screenshot below) and going to the routine which plays a video and controls the opacity of polygons hiding different elements (see the second other image below), the polygons flicker for a split of a second when starting the routine. It is as if there is some lag in setting the opacity of the polygons to their initially transparent level (which is supposed to occur at the beginning of the routine).

Additionally, as you can see in the second screenshot, the text component on the bottom left corner is loading the feedback text from my excel file without recognizing that “\n” means to start a new line. Any ideas on how to fix this? It works well in Python though.

Best,
Miguel