I have this smiley face mask in my fragment shader that takes up the entire window (1).
I passed in smaller coordinates to the vertex shader in an attempt to shrink the smiley face into a smaller box (2) (desired result).
However, the result is (3).
How can I make it so that the fragment shader fits into the coordinates I pass to the vertex shader so it looks like (2) and not (3)?
Below are the relevant pieces of code. Let me know if you require more code.
-- Vertex Shader --
#version 300 es
layout(location=0) in vec3 vPosition;
void main() {
gl_Position = vec4(vPosition, 1.0);
}
-- Fragment Shader --
#version 300 es
precision mediump float;
uniform float width;
uniform float height;
out vec4 fragColor;
float Circle(vec2 uv, vec2 p, float r, float blur) {
float d = length(uv - p);
return smoothstep(r, r-blur, d);
}
void main() {
vec2 uv = gl_FragCoord.xy / vec2(width, height);
uv -= 0.5;
uv.x *= width / height;
float blur = 0.005;
float c = Circle(uv, vec2(0., 0.), 0.25, blur);
c -= Circle(uv, vec2(-0.1, 0.1), 0.05, blur);
c -= Circle(uv, vec2(0.1, 0.1), 0.05, blur);
float mouth = Circle(uv, vec2(0., 0.), 0.15, blur);
mouth -= Circle(uv, vec2(0., 0.05), 0.15, blur);
c -= clamp(mouth, 0., 1.);
fragColor = vec4(vec3(1., 1., 0.) * c, 1.0);
}
Thanks!
edit 1:
Here are the two sets of coordinates being passed to the vertex shader before/after.
edit 2:
Thank you to Rabbid76 for the solution! Below shows the uv coordinates I ended up passing to the vertex shader.
// location = 0
GLfloat vertices[] = {
-0.8, -0.8, 0.0,
-0.2, -0.8, 0.0,
-0.2, -0.2, 0.0,
-0.8, -0.2, 0.0
};
// location = 1
GLfloat uv[] = {
0.0, 0.0,
1.0, 0.0,
1.0, 1.0,
0.0, 1.0
};
Add an additional attribute for the uv coordinates. The attributes must be in the range [0.0, 1.0]. (0, 0 bottom left and (1, 1) top right. Pass the attribute form the vertex shader to the fragment shader:
#version 300 es
layout(location=0) in vec3 vPosition;
layout(location=1) in vec2 vUV;
out vec2 uv;
void main()
{
uv = vUV;
gl_Position = vec4(vPosition, 1.0);
}
Use the fragment shader input uv
instead of vec2 uv = gl_FragCoord.xy / vec2(width, height);
:
// [...]
in vec2 uv;
void main()
{
// vec2 uv = gl_FragCoord.xy / vec2(width, height); DELETE
// [...]
}