I am confused about mix in the shading language

Question

I am trying to understand this shader:

shader_type canvas_item;
render_mode unshaded;

uniform float circle_size : hint_range(0.0, 1.05);
uniform float screen_width;
uniform float screen_height;

void fragment() {
	float ratio = screen_width / screen_height;
	float dist = distance(vec2(0.5, 0.5), vec2(mix(0.5, UV.x, ratio), UV.y));
	COLOR.a = step(circle_size, dist);
}

(from here: https://godotshaders.com/shader/simple-circle-transition-2/)

I am confused at the float dist line where mix is used. Now, I do understand that the line is used to create a circle instead of an oval by accounting for the window not being a perfect square. However, I don't get how mix is getting to these values:

I get that the first value (0.5) is the center, with the second value being the current UV.x value; and we get the linear interpolation between the two. However then, ratio is always a fixed value that is greater than 1, with 1280x720 the ratio would be 1.77. At that point I have no idea what value we are getting out of the mix function. If the value is 1 we'd be getting UV.x but what if the value exceeds 1?

Dioptric

Answer 1

https://registry.khronos.org/OpenGL-Refpages/gl4/html/mix.xhtml

Name
mix — linearly interpolate between two values

Description

mix performs a linear interpolation between x and y using a to weight between them. The return value is computed as $x \times (1 - a) + y \times a$.

The variants of mix where a is genBType select which vector each returned component comes from. For a component of a that is false, the corresponding component of x is returned. For a component of a that is true, the corresponding component of y is returned. Components of x and y that are not selected are allowed to be invalid floating-point values and will have no effect on the results.

Polecat