lightbox: Use variable magnitude for dithering noise

The magnitude of the noise in the final output scales with:

 1.0 - cogl_color_out.a

A fixed value for the magnitude relative to cogl_color_out.a might be
too small for large cogl_color_out.a or too large for small
cogl_color_out.a (or possibly even both).

Compensate for this to achieve constant magnitude in the final output.
The coefficients were determined experimentally as a compromise between
preventing colour banding with dark background content and tolerable
noise with bright background content.

This helps for the issue described in
https://gitlab.gnome.org/GNOME/gnome-shell/-/issues/7795 .

Part-of: <https://gitlab.gnome.org/GNOME/gnome-shell/-/merge_requests/3572>

js/ui/lightbox.js

@@ -24,7 +24,8 @@ vec2 position = cogl_tex_coord_in[0].xy - 0.5;                             \n\
 float t = clamp(length(1.41421 * position), 0.0, 1.0);                     \n\
 float pixel_brightness = mix(1.0, 1.0 - vignette_sharpness, t);            \n\
 cogl_color_out.a *= 1.0 - pixel_brightness * brightness;                   \n\
-cogl_color_out.a += (rand(position) - 0.5) / 100.0;                        \n';
+float noise_magnitude = (2.0 / ((1.0 - cogl_color_out.a) * 255.0));        \n\
+cogl_color_out.a += (rand(position) - 0.5) * noise_magnitude;              \n';
 
 
 const RadialShaderEffect = GObject.registerClass({