Clean up glsl code

This commit is contained in:
Emil Ernerfeldt 2021-11-13 13:09:08 +01:00
parent b5cb2b2c0d
commit 105cb57050
13 changed files with 219 additions and 219 deletions

View file

@ -7,39 +7,39 @@ varying vec2 v_tc;
// 0-255 sRGB from 0-1 linear // 0-255 sRGB from 0-1 linear
vec3 srgb_from_linear(vec3 rgb) { vec3 srgb_from_linear(vec3 rgb) {
bvec3 cutoff = lessThan(rgb, vec3(0.0031308)); bvec3 cutoff = lessThan(rgb, vec3(0.0031308));
vec3 lower = rgb * vec3(3294.6); vec3 lower = rgb * vec3(3294.6);
vec3 higher = vec3(269.025) * pow(rgb, vec3(1.0 / 2.4)) - vec3(14.025); vec3 higher = vec3(269.025) * pow(rgb, vec3(1.0 / 2.4)) - vec3(14.025);
return mix(higher, lower, vec3(cutoff)); return mix(higher, lower, vec3(cutoff));
} }
vec4 srgba_from_linear(vec4 rgba) { vec4 srgba_from_linear(vec4 rgba) {
return vec4(srgb_from_linear(rgba.rgb), 255.0 * rgba.a); return vec4(srgb_from_linear(rgba.rgb), 255.0 * rgba.a);
} }
// 0-1 linear from 0-255 sRGB // 0-1 linear from 0-255 sRGB
vec3 linear_from_srgb(vec3 srgb) { vec3 linear_from_srgb(vec3 srgb) {
bvec3 cutoff = lessThan(srgb, vec3(10.31475)); bvec3 cutoff = lessThan(srgb, vec3(10.31475));
vec3 lower = srgb / vec3(3294.6); vec3 lower = srgb / vec3(3294.6);
vec3 higher = pow((srgb + vec3(14.025)) / vec3(269.025), vec3(2.4)); vec3 higher = pow((srgb + vec3(14.025)) / vec3(269.025), vec3(2.4));
return mix(higher, lower, vec3(cutoff)); return mix(higher, lower, vec3(cutoff));
} }
vec4 linear_from_srgba(vec4 srgba) { vec4 linear_from_srgba(vec4 srgba) {
return vec4(linear_from_srgb(srgba.rgb), srgba.a / 255.0); return vec4(linear_from_srgb(srgba.rgb), srgba.a / 255.0);
} }
void main() { void main() {
// We must decode the colors, since WebGL doesn't come with sRGBA textures: // We must decode the colors, since WebGL doesn't come with sRGBA textures:
vec4 texture_rgba = linear_from_srgba(texture2D(u_sampler, v_tc) * 255.0); vec4 texture_rgba = linear_from_srgba(texture2D(u_sampler, v_tc) * 255.0);
/// Multiply vertex color with texture color (in linear space). /// Multiply vertex color with texture color (in linear space).
gl_FragColor = v_rgba * texture_rgba; gl_FragColor = v_rgba * texture_rgba;
// We must gamma-encode again since WebGL doesn't support linear blending in the framebuffer. // We must gamma-encode again since WebGL doesn't support linear blending in the framebuffer.
gl_FragColor = srgba_from_linear(v_rgba * texture_rgba) / 255.0; gl_FragColor = srgba_from_linear(v_rgba * texture_rgba) / 255.0;
// WebGL doesn't support linear blending in the framebuffer, // WebGL doesn't support linear blending in the framebuffer,
// so we apply this hack to at least get a bit closer to the desired blending: // so we apply this hack to at least get a bit closer to the desired blending:
gl_FragColor.a = pow(gl_FragColor.a, 1.6); // Empiric nonsense gl_FragColor.a = pow(gl_FragColor.a, 1.6); // Empiric nonsense
} }

View file

@ -5,7 +5,7 @@ varying vec4 v_rgba;
varying vec2 v_tc; varying vec2 v_tc;
void main() { void main() {
// The texture sampler is sRGB aware, and glium already expects linear rgba output // The texture sampler is sRGB aware, and glium already expects linear rgba output
// so no need for any sRGB conversions here: // so no need for any sRGB conversions here:
gl_FragColor = v_rgba * texture2D(u_sampler, v_tc); gl_FragColor = v_rgba * texture2D(u_sampler, v_tc);
} }

View file

@ -6,7 +6,7 @@ in vec2 v_tc;
out vec4 f_color; out vec4 f_color;
void main() { void main() {
// The texture sampler is sRGB aware, and glium already expects linear rgba output // The texture sampler is sRGB aware, and glium already expects linear rgba output
// so no need for any sRGB conversions here: // so no need for any sRGB conversions here:
f_color = v_rgba * texture(u_sampler, v_tc); f_color = v_rgba * texture(u_sampler, v_tc);
} }

View file

@ -7,27 +7,27 @@ varying vec2 v_tc;
// 0-255 sRGB from 0-1 linear // 0-255 sRGB from 0-1 linear
vec3 srgb_from_linear(vec3 rgb) { vec3 srgb_from_linear(vec3 rgb) {
bvec3 cutoff = lessThan(rgb, vec3(0.0031308)); bvec3 cutoff = lessThan(rgb, vec3(0.0031308));
vec3 lower = rgb * vec3(3294.6); vec3 lower = rgb * vec3(3294.6);
vec3 higher = vec3(269.025) * pow(rgb, vec3(1.0 / 2.4)) - vec3(14.025); vec3 higher = vec3(269.025) * pow(rgb, vec3(1.0 / 2.4)) - vec3(14.025);
return mix(higher, lower, vec3(cutoff)); return mix(higher, lower, vec3(cutoff));
} }
vec4 srgba_from_linear(vec4 rgba) { vec4 srgba_from_linear(vec4 rgba) {
return vec4(srgb_from_linear(rgba.rgb), 255.0 * rgba.a); return vec4(srgb_from_linear(rgba.rgb), 255.0 * rgba.a);
} }
void main() { void main() {
// The texture is set up with `SRGB8_ALPHA8`, so no need to decode here! // The texture is set up with `SRGB8_ALPHA8`, so no need to decode here!
vec4 texture_rgba = texture2D(u_sampler, v_tc); vec4 texture_rgba = texture2D(u_sampler, v_tc);
/// Multiply vertex color with texture color (in linear space). /// Multiply vertex color with texture color (in linear space).
gl_FragColor = v_rgba * texture_rgba; gl_FragColor = v_rgba * texture_rgba;
// We must gamma-encode again since WebGL doesn't support linear blending in the framebuffer. // We must gamma-encode again since WebGL doesn't support linear blending in the framebuffer.
gl_FragColor = srgba_from_linear(v_rgba * texture_rgba) / 255.0; gl_FragColor = srgba_from_linear(v_rgba * texture_rgba) / 255.0;
// WebGL doesn't support linear blending in the framebuffer, // WebGL doesn't support linear blending in the framebuffer,
// so we apply this hack to at least get a bit closer to the desired blending: // so we apply this hack to at least get a bit closer to the desired blending:
gl_FragColor.a = pow(gl_FragColor.a, 1.6); // Empiric nonsense gl_FragColor.a = pow(gl_FragColor.a, 1.6); // Empiric nonsense
} }

View file

@ -10,23 +10,23 @@ varying vec2 v_tc;
// 0-1 linear from 0-255 sRGB // 0-1 linear from 0-255 sRGB
vec3 linear_from_srgb(vec3 srgb) { vec3 linear_from_srgb(vec3 srgb) {
bvec3 cutoff = lessThan(srgb, vec3(10.31475)); bvec3 cutoff = lessThan(srgb, vec3(10.31475));
vec3 lower = srgb / vec3(3294.6); vec3 lower = srgb / vec3(3294.6);
vec3 higher = pow((srgb + vec3(14.025)) / vec3(269.025), vec3(2.4)); vec3 higher = pow((srgb + vec3(14.025)) / vec3(269.025), vec3(2.4));
return mix(higher, lower, vec3(cutoff)); return mix(higher, lower, vec3(cutoff));
} }
vec4 linear_from_srgba(vec4 srgba) { vec4 linear_from_srgba(vec4 srgba) {
return vec4(linear_from_srgb(srgba.rgb), srgba.a / 255.0); return vec4(linear_from_srgb(srgba.rgb), srgba.a / 255.0);
} }
void main() { void main() {
gl_Position = vec4( gl_Position = vec4(
2.0 * a_pos.x / u_screen_size.x - 1.0, 2.0 * a_pos.x / u_screen_size.x - 1.0,
1.0 - 2.0 * a_pos.y / u_screen_size.y, 1.0 - 2.0 * a_pos.y / u_screen_size.y,
0.0, 0.0,
1.0); 1.0);
// egui encodes vertex colors in gamma spaces, so we must decode the colors here: // egui encodes vertex colors in gamma spaces, so we must decode the colors here:
v_rgba = linear_from_srgba(a_srgba); v_rgba = linear_from_srgba(a_srgba);
v_tc = a_tc; v_tc = a_tc;
} }

View file

@ -9,23 +9,23 @@ varying vec2 v_tc;
// 0-1 linear from 0-255 sRGB // 0-1 linear from 0-255 sRGB
vec3 linear_from_srgb(vec3 srgb) { vec3 linear_from_srgb(vec3 srgb) {
bvec3 cutoff = lessThan(srgb, vec3(10.31475)); bvec3 cutoff = lessThan(srgb, vec3(10.31475));
vec3 lower = srgb / vec3(3294.6); vec3 lower = srgb / vec3(3294.6);
vec3 higher = pow((srgb + vec3(14.025)) / vec3(269.025), vec3(2.4)); vec3 higher = pow((srgb + vec3(14.025)) / vec3(269.025), vec3(2.4));
return mix(higher, lower, vec3(cutoff)); return mix(higher, lower, vec3(cutoff));
} }
vec4 linear_from_srgba(vec4 srgba) { vec4 linear_from_srgba(vec4 srgba) {
return vec4(linear_from_srgb(srgba.rgb), srgba.a / 255.0); return vec4(linear_from_srgb(srgba.rgb), srgba.a / 255.0);
} }
void main() { void main() {
gl_Position = vec4( gl_Position = vec4(
2.0 * a_pos.x / u_screen_size.x - 1.0, 2.0 * a_pos.x / u_screen_size.x - 1.0,
1.0 - 2.0 * a_pos.y / u_screen_size.y, 1.0 - 2.0 * a_pos.y / u_screen_size.y,
0.0, 0.0,
1.0); 1.0);
// egui encodes vertex colors in gamma spaces, so we must decode the colors here: // egui encodes vertex colors in gamma spaces, so we must decode the colors here:
v_rgba = linear_from_srgba(a_srgba); v_rgba = linear_from_srgba(a_srgba);
v_tc = a_tc; v_tc = a_tc;
} }

View file

@ -9,23 +9,23 @@ out vec2 v_tc;
// 0-1 linear from 0-255 sRGB // 0-1 linear from 0-255 sRGB
vec3 linear_from_srgb(vec3 srgb) { vec3 linear_from_srgb(vec3 srgb) {
bvec3 cutoff = lessThan(srgb, vec3(10.31475)); bvec3 cutoff = lessThan(srgb, vec3(10.31475));
vec3 lower = srgb / vec3(3294.6); vec3 lower = srgb / vec3(3294.6);
vec3 higher = pow((srgb + vec3(14.025)) / vec3(269.025), vec3(2.4)); vec3 higher = pow((srgb + vec3(14.025)) / vec3(269.025), vec3(2.4));
return mix(higher, lower, cutoff); return mix(higher, lower, cutoff);
} }
vec4 linear_from_srgba(vec4 srgba) { vec4 linear_from_srgba(vec4 srgba) {
return vec4(linear_from_srgb(srgba.rgb), srgba.a / 255.0); return vec4(linear_from_srgb(srgba.rgb), srgba.a / 255.0);
} }
void main() { void main() {
gl_Position = vec4( gl_Position = vec4(
2.0 * a_pos.x / u_screen_size.x - 1.0, 2.0 * a_pos.x / u_screen_size.x - 1.0,
1.0 - 2.0 * a_pos.y / u_screen_size.y, 1.0 - 2.0 * a_pos.y / u_screen_size.y,
0.0, 0.0,
1.0); 1.0);
// egui encodes vertex colors in gamma spaces, so we must decode the colors here: // egui encodes vertex colors in gamma spaces, so we must decode the colors here:
v_rgba = linear_from_srgba(a_srgba); v_rgba = linear_from_srgba(a_srgba);
v_tc = a_tc; v_tc = a_tc;
} }

View file

@ -10,23 +10,23 @@ varying vec2 v_tc;
// 0-1 linear from 0-255 sRGB // 0-1 linear from 0-255 sRGB
vec3 linear_from_srgb(vec3 srgb) { vec3 linear_from_srgb(vec3 srgb) {
bvec3 cutoff = lessThan(srgb, vec3(10.31475)); bvec3 cutoff = lessThan(srgb, vec3(10.31475));
vec3 lower = srgb / vec3(3294.6); vec3 lower = srgb / vec3(3294.6);
vec3 higher = pow((srgb + vec3(14.025)) / vec3(269.025), vec3(2.4)); vec3 higher = pow((srgb + vec3(14.025)) / vec3(269.025), vec3(2.4));
return mix(higher, lower, vec3(cutoff)); return mix(higher, lower, vec3(cutoff));
} }
vec4 linear_from_srgba(vec4 srgba) { vec4 linear_from_srgba(vec4 srgba) {
return vec4(linear_from_srgb(srgba.rgb), srgba.a / 255.0); return vec4(linear_from_srgb(srgba.rgb), srgba.a / 255.0);
} }
void main() { void main() {
gl_Position = vec4( gl_Position = vec4(
2.0 * a_pos.x / u_screen_size.x - 1.0, 2.0 * a_pos.x / u_screen_size.x - 1.0,
1.0 - 2.0 * a_pos.y / u_screen_size.y, 1.0 - 2.0 * a_pos.y / u_screen_size.y,
0.0, 0.0,
1.0); 1.0);
// egui encodes vertex colors in gamma spaces, so we must decode the colors here: // egui encodes vertex colors in gamma spaces, so we must decode the colors here:
v_rgba = linear_from_srgba(a_srgba); v_rgba = linear_from_srgba(a_srgba);
v_tc = a_tc; v_tc = a_tc;
} }

View file

@ -1,77 +1,76 @@
#ifdef GL_ES #ifdef GL_ES
precision mediump float; precision mediump float;
#endif #endif
uniform sampler2D u_sampler; uniform sampler2D u_sampler;
#ifdef NEW_SHADER_INTERFACE #ifdef NEW_SHADER_INTERFACE
in vec4 v_rgba; in vec4 v_rgba;
in vec2 v_tc; in vec2 v_tc;
out vec4 f_color; out vec4 f_color;
// a dirty hack applied to support webGL2 // a dirty hack applied to support webGL2
#define gl_FragColor f_color #define gl_FragColor f_color
#define texture2D texture #define texture2D texture
#else #else
varying vec4 v_rgba; varying vec4 v_rgba;
varying vec2 v_tc; varying vec2 v_tc;
#endif #endif
#ifndef SRGB_SUPPORTED #ifdef SRGB_SUPPORTED
// 0-255 sRGB from 0-1 linear void main() {
vec3 srgb_from_linear(vec3 rgb) { // The texture sampler is sRGB aware, and OpenGL already expects linear rgba output
bvec3 cutoff = lessThan(rgb, vec3(0.0031308)); // so no need for any sRGB conversions here:
vec3 lower = rgb * vec3(3294.6); gl_FragColor = v_rgba * texture2D(u_sampler, v_tc);
vec3 higher = vec3(269.025) * pow(rgb, vec3(1.0 / 2.4)) - vec3(14.025);
return mix(higher, lower, vec3(cutoff));
}
vec4 srgba_from_linear(vec4 rgba) {
return vec4(srgb_from_linear(rgba.rgb), 255.0 * rgba.a);
}
// 0-1 linear from 0-255 sRGB
vec3 linear_from_srgb(vec3 srgb) {
bvec3 cutoff = lessThan(srgb, vec3(10.31475));
vec3 lower = srgb / vec3(3294.6);
vec3 higher = pow((srgb + vec3(14.025)) / vec3(269.025), vec3(2.4));
return mix(higher, lower, vec3(cutoff));
}
vec4 linear_from_srgba(vec4 srgba) {
return vec4(linear_from_srgb(srgba.rgb), srgba.a / 255.0);
}
void main() {
// We must decode the colors, since WebGL doesn't come with sRGBA textures:
vec4 texture_rgba = linear_from_srgba(texture2D(u_sampler, v_tc) * 255.0);
/// Multiply vertex color with texture color (in linear space).
gl_FragColor = v_rgba * texture_rgba;
// WebGL doesn't support linear blending in the framebuffer,
// so we do a hack here where we change the premultiplied alpha
// to do the multiplication in gamma space instead:
// Unmultiply alpha:
if (gl_FragColor.a > 0.0) {
gl_FragColor.rgb /= gl_FragColor.a;
} }
#else
// 0-255 sRGB from 0-1 linear
vec3 srgb_from_linear(vec3 rgb) {
bvec3 cutoff = lessThan(rgb, vec3(0.0031308));
vec3 lower = rgb * vec3(3294.6);
vec3 higher = vec3(269.025) * pow(rgb, vec3(1.0 / 2.4)) - vec3(14.025);
return mix(higher, lower, vec3(cutoff));
}
vec4 srgba_from_linear(vec4 rgba) {
return vec4(srgb_from_linear(rgba.rgb), 255.0 * rgba.a);
}
// 0-1 linear from 0-255 sRGB
vec3 linear_from_srgb(vec3 srgb) {
bvec3 cutoff = lessThan(srgb, vec3(10.31475));
vec3 lower = srgb / vec3(3294.6);
vec3 higher = pow((srgb + vec3(14.025)) / vec3(269.025), vec3(2.4));
return mix(higher, lower, vec3(cutoff));
}
vec4 linear_from_srgba(vec4 srgba) {
return vec4(linear_from_srgb(srgba.rgb), srgba.a / 255.0);
}
void main() {
// We must decode the colors, since WebGL1 doesn't come with sRGBA textures:
vec4 texture_rgba = linear_from_srgba(texture2D(u_sampler, v_tc) * 255.0);
/// Multiply vertex color with texture color (in linear space).
gl_FragColor = v_rgba * texture_rgba;
// WebGL1 doesn't support linear blending in the framebuffer,
// so we do a hack here where we change the premultiplied alpha
// to do the multiplication in gamma space instead:
// Unmultiply alpha:
if (gl_FragColor.a > 0.0) {
gl_FragColor.rgb /= gl_FragColor.a;
}
// Empiric tweak to make e.g. shadows look more like they should: // Empiric tweak to make e.g. shadows look more like they should:
gl_FragColor.a *= sqrt(gl_FragColor.a); gl_FragColor.a *= sqrt(gl_FragColor.a);
// To gamma: // To gamma:
gl_FragColor = srgba_from_linear(gl_FragColor) / 255.0; gl_FragColor = srgba_from_linear(gl_FragColor) / 255.0;
// Premultiply alpha, this time in gamma space: // Premultiply alpha, this time in gamma space:
if (gl_FragColor.a > 0.0) { if (gl_FragColor.a > 0.0) {
gl_FragColor.rgb *= gl_FragColor.a; gl_FragColor.rgb *= gl_FragColor.a;
}
} }
} #endif
#else
void main() {
// The texture sampler is sRGB aware, and OpenGL already expects linear rgba output
// so no need for any sRGB conversions here:
gl_FragColor = v_rgba * texture2D(u_sampler, v_tc);
}
#endif

View file

@ -1,16 +1,17 @@
#ifdef NEW_SHADER_INTERFACE #ifdef NEW_SHADER_INTERFACE
#define I in #define I in
#define O out #define O out
#define V(x) x #define V(x) x
#else #else
#define I attribute #define I attribute
#define O varying #define O varying
#define V(x) vec3(x) #define V(x) vec3(x)
#endif #endif
#ifdef GL_ES #ifdef GL_ES
precision mediump float; precision mediump float;
#endif #endif
uniform vec2 u_screen_size; uniform vec2 u_screen_size;
I vec2 a_pos; I vec2 a_pos;
I vec4 a_srgba; // 0-255 sRGB I vec4 a_srgba; // 0-255 sRGB
@ -20,23 +21,23 @@ O vec2 v_tc;
// 0-1 linear from 0-255 sRGB // 0-1 linear from 0-255 sRGB
vec3 linear_from_srgb(vec3 srgb) { vec3 linear_from_srgb(vec3 srgb) {
bvec3 cutoff = lessThan(srgb, vec3(10.31475)); bvec3 cutoff = lessThan(srgb, vec3(10.31475));
vec3 lower = srgb / vec3(3294.6); vec3 lower = srgb / vec3(3294.6);
vec3 higher = pow((srgb + vec3(14.025)) / vec3(269.025), vec3(2.4)); vec3 higher = pow((srgb + vec3(14.025)) / vec3(269.025), vec3(2.4));
return mix(higher, lower, V(cutoff)); return mix(higher, lower, V(cutoff));
} }
vec4 linear_from_srgba(vec4 srgba) { vec4 linear_from_srgba(vec4 srgba) {
return vec4(linear_from_srgb(srgba.rgb), srgba.a / 255.0); return vec4(linear_from_srgb(srgba.rgb), srgba.a / 255.0);
} }
void main() { void main() {
gl_Position = vec4( gl_Position = vec4(
2.0 * a_pos.x / u_screen_size.x - 1.0, 2.0 * a_pos.x / u_screen_size.x - 1.0,
1.0 - 2.0 * a_pos.y / u_screen_size.y, 1.0 - 2.0 * a_pos.y / u_screen_size.y,
0.0, 0.0,
1.0); 1.0);
// egui encodes vertex colors in gamma spaces, so we must decode the colors here: // egui encodes vertex colors in gamma space, so we must decode the colors here:
v_rgba = linear_from_srgba(a_srgba); v_rgba = linear_from_srgba(a_srgba);
v_tc = a_tc; v_tc = a_tc;
} }

View file

@ -5,54 +5,54 @@ varying vec2 v_tc;
// 0-255 sRGB from 0-1 linear // 0-255 sRGB from 0-1 linear
vec3 srgb_from_linear(vec3 rgb) { vec3 srgb_from_linear(vec3 rgb) {
bvec3 cutoff = lessThan(rgb, vec3(0.0031308)); bvec3 cutoff = lessThan(rgb, vec3(0.0031308));
vec3 lower = rgb * vec3(3294.6); vec3 lower = rgb * vec3(3294.6);
vec3 higher = vec3(269.025) * pow(rgb, vec3(1.0 / 2.4)) - vec3(14.025); vec3 higher = vec3(269.025) * pow(rgb, vec3(1.0 / 2.4)) - vec3(14.025);
return mix(higher, lower, vec3(cutoff)); return mix(higher, lower, vec3(cutoff));
} }
// 0-255 sRGB from 0-1 linear // 0-255 sRGB from 0-1 linear
vec4 srgba_from_linear(vec4 rgba) { vec4 srgba_from_linear(vec4 rgba) {
return vec4(srgb_from_linear(rgba.rgb), 255.0 * rgba.a); return vec4(srgb_from_linear(rgba.rgb), 255.0 * rgba.a);
} }
// 0-1 linear from 0-255 sRGB // 0-1 linear from 0-255 sRGB
vec3 linear_from_srgb(vec3 srgb) { vec3 linear_from_srgb(vec3 srgb) {
bvec3 cutoff = lessThan(srgb, vec3(10.31475)); bvec3 cutoff = lessThan(srgb, vec3(10.31475));
vec3 lower = srgb / vec3(3294.6); vec3 lower = srgb / vec3(3294.6);
vec3 higher = pow((srgb + vec3(14.025)) / vec3(269.025), vec3(2.4)); vec3 higher = pow((srgb + vec3(14.025)) / vec3(269.025), vec3(2.4));
return mix(higher, lower, vec3(cutoff)); return mix(higher, lower, vec3(cutoff));
} }
// 0-1 linear from 0-255 sRGBA // 0-1 linear from 0-255 sRGBA
vec4 linear_from_srgba(vec4 srgba) { vec4 linear_from_srgba(vec4 srgba) {
return vec4(linear_from_srgb(srgba.rgb), srgba.a / 255.0); return vec4(linear_from_srgb(srgba.rgb), srgba.a / 255.0);
} }
void main() { void main() {
// We must decode the colors, since WebGL1 doesn't come with sRGBA textures: // We must decode the colors, since WebGL1 doesn't come with sRGBA textures:
vec4 texture_rgba = linear_from_srgba(texture2D(u_sampler, v_tc) * 255.0); vec4 texture_rgba = linear_from_srgba(texture2D(u_sampler, v_tc) * 255.0);
/// Multiply vertex color with texture color (in linear space). /// Multiply vertex color with texture color (in linear space).
gl_FragColor = v_rgba * texture_rgba; gl_FragColor = v_rgba * texture_rgba;
// WebGL doesn't support linear blending in the framebuffer, // WebGL doesn't support linear blending in the framebuffer,
// so we do a hack here where we change the premultiplied alpha // so we do a hack here where we change the premultiplied alpha
// to do the multiplication in gamma space instead: // to do the multiplication in gamma space instead:
// Unmultiply alpha: // Unmultiply alpha:
if (gl_FragColor.a > 0.0) { if (gl_FragColor.a > 0.0) {
gl_FragColor.rgb /= gl_FragColor.a; gl_FragColor.rgb /= gl_FragColor.a;
} }
// Empiric tweak to make e.g. shadows look more like they should: // Empiric tweak to make e.g. shadows look more like they should:
gl_FragColor.a *= sqrt(gl_FragColor.a); gl_FragColor.a *= sqrt(gl_FragColor.a);
// To gamma: // To gamma:
gl_FragColor = srgba_from_linear(gl_FragColor) / 255.0; gl_FragColor = srgba_from_linear(gl_FragColor) / 255.0;
// Premultiply alpha, this time in gamma space: // Premultiply alpha, this time in gamma space:
if (gl_FragColor.a > 0.0) { if (gl_FragColor.a > 0.0) {
gl_FragColor.rgb *= gl_FragColor.a; gl_FragColor.rgb *= gl_FragColor.a;
} }
} }

View file

@ -4,10 +4,10 @@ varying vec4 v_rgba;
varying vec2 v_tc; varying vec2 v_tc;
void main() { void main() {
// The texture is set up with `SRGB8_ALPHA8`, so no need to decode here! // The texture is set up with `SRGB8_ALPHA8`, so no need to decode here!
vec4 texture_rgba = texture2D(u_sampler, v_tc); vec4 texture_rgba = texture2D(u_sampler, v_tc);
// Multiply vertex color with texture color (in linear space). // Multiply vertex color with texture color (in linear space).
// Linear color is written and blended in Framebuffer and converted to sRGB later // Linear color is written and blended in Framebuffer and converted to sRGB later
gl_FragColor = v_rgba * texture_rgba; gl_FragColor = v_rgba * texture_rgba;
} }

View file

@ -8,24 +8,24 @@ varying vec2 v_tc;
// 0-1 linear from 0-255 sRGB // 0-1 linear from 0-255 sRGB
vec3 linear_from_srgb(vec3 srgb) { vec3 linear_from_srgb(vec3 srgb) {
bvec3 cutoff = lessThan(srgb, vec3(10.31475)); bvec3 cutoff = lessThan(srgb, vec3(10.31475));
vec3 lower = srgb / vec3(3294.6); vec3 lower = srgb / vec3(3294.6);
vec3 higher = pow((srgb + vec3(14.025)) / vec3(269.025), vec3(2.4)); vec3 higher = pow((srgb + vec3(14.025)) / vec3(269.025), vec3(2.4));
return mix(higher, lower, vec3(cutoff)); return mix(higher, lower, vec3(cutoff));
} }
// 0-1 linear from 0-255 sRGBA // 0-1 linear from 0-255 sRGBA
vec4 linear_from_srgba(vec4 srgba) { vec4 linear_from_srgba(vec4 srgba) {
return vec4(linear_from_srgb(srgba.rgb), srgba.a / 255.0); return vec4(linear_from_srgb(srgba.rgb), srgba.a / 255.0);
} }
void main() { void main() {
gl_Position = vec4( gl_Position = vec4(
2.0 * a_pos.x / u_screen_size.x - 1.0, 2.0 * a_pos.x / u_screen_size.x - 1.0,
1.0 - 2.0 * a_pos.y / u_screen_size.y, 1.0 - 2.0 * a_pos.y / u_screen_size.y,
0.0, 0.0,
1.0); 1.0);
// egui encodes vertex colors in gamma spaces, so we must decode the colors here: // egui encodes vertex colors in gamma spaces, so we must decode the colors here:
v_rgba = linear_from_srgba(a_srgba); v_rgba = linear_from_srgba(a_srgba);
v_tc = a_tc; v_tc = a_tc;
} }