77 lines
2.4 KiB
JavaScript
77 lines
2.4 KiB
JavaScript
"use strict";
|
|
const mSDFBit = {
|
|
name: "msdf-bit",
|
|
fragment: {
|
|
header: (
|
|
/* wgsl */
|
|
`
|
|
fn calculateMSDFAlpha(msdfColor:vec4<f32>, shapeColor:vec4<f32>, distance:f32) -> f32 {
|
|
|
|
// MSDF
|
|
var median = msdfColor.r + msdfColor.g + msdfColor.b -
|
|
min(msdfColor.r, min(msdfColor.g, msdfColor.b)) -
|
|
max(msdfColor.r, max(msdfColor.g, msdfColor.b));
|
|
|
|
// SDF
|
|
median = min(median, msdfColor.a);
|
|
|
|
var screenPxDistance = distance * (median - 0.5);
|
|
var alpha = clamp(screenPxDistance + 0.5, 0.0, 1.0);
|
|
if (median < 0.01) {
|
|
alpha = 0.0;
|
|
} else if (median > 0.99) {
|
|
alpha = 1.0;
|
|
}
|
|
|
|
// Gamma correction for coverage-like alpha
|
|
var luma: f32 = dot(shapeColor.rgb, vec3<f32>(0.299, 0.587, 0.114));
|
|
var gamma: f32 = mix(1.0, 1.0 / 2.2, luma);
|
|
var coverage: f32 = pow(shapeColor.a * alpha, gamma);
|
|
|
|
return coverage;
|
|
|
|
}
|
|
`
|
|
)
|
|
}
|
|
};
|
|
const mSDFBitGl = {
|
|
name: "msdf-bit",
|
|
fragment: {
|
|
header: (
|
|
/* glsl */
|
|
`
|
|
float calculateMSDFAlpha(vec4 msdfColor, vec4 shapeColor, float distance) {
|
|
|
|
// MSDF
|
|
float median = msdfColor.r + msdfColor.g + msdfColor.b -
|
|
min(msdfColor.r, min(msdfColor.g, msdfColor.b)) -
|
|
max(msdfColor.r, max(msdfColor.g, msdfColor.b));
|
|
|
|
// SDF
|
|
median = min(median, msdfColor.a);
|
|
|
|
float screenPxDistance = distance * (median - 0.5);
|
|
float alpha = clamp(screenPxDistance + 0.5, 0.0, 1.0);
|
|
|
|
if (median < 0.01) {
|
|
alpha = 0.0;
|
|
} else if (median > 0.99) {
|
|
alpha = 1.0;
|
|
}
|
|
|
|
// Gamma correction for coverage-like alpha
|
|
float luma = dot(shapeColor.rgb, vec3(0.299, 0.587, 0.114));
|
|
float gamma = mix(1.0, 1.0 / 2.2, luma);
|
|
float coverage = pow(shapeColor.a * alpha, gamma);
|
|
|
|
return coverage;
|
|
}
|
|
`
|
|
)
|
|
}
|
|
};
|
|
|
|
export { mSDFBit, mSDFBitGl };
|
|
//# sourceMappingURL=mSDFBit.mjs.map
|