Pavlovia does not recognise 'readOnly' for slider

Online experiments
1

Hi all,

We are having the following issue with the slider and trying to get it to be recognised as “read only” in Pavlovia. Have tried multiple things to find a solution but have been unsuccessful so far.

Any insight or suggestions would be super helpful.

Thanks,

Laura

What is the issue (in short): Using the “readOnly” check box in Builder for slider correctly makes the slider “read only” in PsychoPy but not in Pavlovia.

What are we using: Used Builder first. Have tried to solve the issue by using javascript in the coder (in GitHub for opacity, too). These are described below.

PsychoPy version/Operating System/Browsers: v2023.1.2 in Windows 10 (to my knowledge is the most recent) but the issue was present in earlier versions. Browsers tried: Chrome, Firefox, Edge.

Solution we are after: To either make the slider read only (how it works in PsychoPy) or to make the marker disappear (opacity = 0 or size = 0/very small) so to the participant it looks like it is not collecting responses (we do not need the responses). We are using the slider to provide feedback to participants (using shapes as an answer marker on the slider and have no issues with this).

What we have tried
*Tried these solutions below in an experiment that only has a slider and the problems still exist.

feedback_slider.setReadOnly = true;

**Results for each of the above: Code completely ignored and no error message comes up.

  • This code in Build Routine or Every Frame coder:
feedback_slider.setAttribute('readOnly', 'true')

**Result: *Error message “feedback_slider.setAttribute is not a function”

  • Creating a new slider in coder and applying the code below under Begin Routine.
    **Result: Code completely ignored (no error message comes up) for both “readOnly” and “marker.opacity”:
feedback_slider = new visual.Slider({
"win": psychoJS.window, "name": "feedback_slider", "startValue": null, "size": [1.0, 0.06], "pos": [0, (- 0.32)], "units": "height", "labels": [0, 5, 10, 15, 20], "ticks": [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20], "granularity": 1.0, "style": "rating", "styleTweaks": [], "opacity": null, "labelColor": "black", "markerColor": [0.0824, (- 0.6627), 0.7725], "lineColor": "black", "colorSpace": "rgb", "font": "Open Sans", "labelHeight": 0.05, "flip": false, "ori": 0.0, "depth": (- 1), "readOnly": true});

and

 feedback_slider = new visual.Slider({
 win: psychoJS.window, name: 'feedback_slider',
 startValue: undefined,
 size: [1.0, 0.06], pos: [0, (- 0.32)], ori: 0.0, units: 'height',
 labels: [0, 5, 10, 15, 20], fontSize: 0.05, ticks: [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20],
 granularity: 1.0, style: ["RATING"],
 color: new util.Color('black'), markerColor: new util.Color([0.0824, (- 0.6627), 0.7725]), markerOpacity: 0, lineColor: new util.Color('black'), 
 opacity: undefined, fontFamily: 'Open Sans', bold: true, italic: false, depth: -1, 
 flip: false, readOnly: true
 });

  • The following solutions to change marker size (so it looks non-existant):
    **Changing the slider marker size in Javascript - #13 by Rahim_Hashim
    **Changing slider appearance in JS
    **Result: When adding the code to the coder, it makes a new smaller marker but does not change the size of the original marker (Every Frame) OR changes colour of the marker but does not change the size (Begin Routine)

  • Setting the marker position to be off-screen: moves the marker to the maximum rating (e.g., 20 if scale is 0-20) and makes it appear.

  • Other notes: Slider has appearance settings set to “constant”. When changed to “set every repeat” OR “set every frame” the following error appears: ReferenceError: colorSpace is not defined

2

Hi Laura,

I am facing the same problem. Have you ever found a solution for it?

Thanks!
Otávio

3

Hi there,
I have the same problem with the version 2023.2.2.
To fix this, in the builder, I have put all the filled settings of the slider (pos, contrast,…) on “set every frame”. I did not check precisely which one makes this working but as long as it works…
Nicolas

4

Hi,

I also encountered the same problem in the newest 2025 version. Any fix?
The slider will become more transparent but still clickable (instead of readOnly).

The local psychopy version works but not the online version.

Thanks!
Chenzi.

5

After a bit of digging, it looks like implementing the “readOnly” property is still listed as “to-do” for the slider in PsychoJS. It just hasn’t been added as a feature to the JavaScript version yet, so the check-box doesn’t do anything for online studies. For now, your best bet is to make a fake slider with a combination of shapes or images.

6

I was using .readOnly property to control the activation of a slider during interactions. My slider controls sound and I want to freeze the slider when a sound is being played and reactivate it when the sound play ended. Does it mean that I need to build a slider from scratch? Any pointer of how I could achieve it in online version based on the builder slider component? (the offline PsychoPy version works perfectly)

7

I see, the issue is flipping modes dynamically. That is indeed harder. It does seem like the “readOnly” property changes the transparency of the slider, so it should “fade” but it will still be interactive.

I can think of a couple of possible solutions you could try, though I haven’t tested either of them and I’m not sure they will work.

  1. Use the slider’s setMarkerPos(value) function in the “each frame” code to “lock” the marker position to its current value. I’m not sure how this will go if the user tries to interact with it (e.g. if it will drag and snap back or just not move at all), but it should keep them from actually changing the value at least.
  2. Create an image with opacity 0 (or close) that covers the slider and is drawn “on top” of it (is lower in the list of components in the builder), and make its appearance conditional on a boolean that acts like readOnly (i.e., it’s only drawn when you don’t want them to interact with the slider). Alternately, move it over the slider when you don’t want them to interact with it using setPos(), and move it elsewhere otherwise. I’m not 100% sure this will work, but if the image covers the slider object I think it will make it so that clicks on the slider aren’t registered at all.

They’re both a little kludgy but if one of them works it should get you the behavior you’re looking for without having to make a slider from scratch.

8

Thanks for this idea and I will try the image approach. The current readOnly mode enables a half transparent slider, which is a good signal. I can also probably mention something in the instructions for participants.