eric/matrix
1
0
Fork 0
mirror of https://github.com/Rezmason/matrix.git synced 2026-04-17 05:49:30 -07:00
Code Issues Packages Projects Releases Wiki Activity

Removing A-Frame alpha test from the MSDF shader. I should have known better!

Browse Source
This commit is contained in:
Rezmason
2019-05-15 08:30:38 -07:00
parent c154a2f30f
commit ec4d1878c4
2 changed files with 4 additions and 19 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
index.html
View File

@@ -174,7 +174,6 @@
const version = versions[getParam("version", "1999")] || versions["1999"];
const sharpness = parseFloat(getParam("sharpness", 0.5));
const animationSpeed = parseFloat(getParam("animationSpeed", 1));
const fallSpeed = parseFloat(getParam("fallSpeed", 1)) * version.fallSpeed;
const cycleSpeed = parseFloat(getParam("cycleSpeed", 1)) * version.cycleSpeed;
@@ -215,7 +214,6 @@
numColumns,
numFontColumns,
raindropLength,
sharpness,
showComputationTexture: effect === "none",
slant,
});
@@ -263,11 +261,11 @@
composer.passes[composer.passes.length - 1].renderToScreen = true;
const windowResize = () => {
const [width, height] = [window.innerWidth, window.innerHeight];
const [width, height, pixelRatio] = [window.innerWidth, window.innerHeight, window.devicePixelRatio];
matrixRenderer.resize(width, height);
renderer.setSize(width, height);
composer.setSize(width, height);
bloomPass.setSize( window.innerWidth, window.innerHeight );
composer.setSize(width * pixelRatio, height * pixelRatio);
bloomPass.setSize( window.innerWidth * pixelRatio, window.innerHeight * pixelRatio );
}
window.addEventListener("resize", windowResize, false);
window.addEventListener("orientationchange", windowResize, false);

15
js/MatrixRenderer.js
View File

@@ -1,6 +1,5 @@
const makeMatrixRenderer = (renderer, {
fontTexture,
sharpness,
numColumns,
animationSpeed, fallSpeed, cycleSpeed,
glyphSequenceLength,
@@ -178,7 +177,6 @@ const glyphVariable = gpuCompute.addVariable(
glyphs: { type: "t", value: glyphRTT },
msdf: { type: "t", value: fontTexture },
numColumns: {type: "f", value: numColumns},
sharpness: { type: "f", value: sharpness },
numFontColumns: {type: "f", value: numFontColumns},
resolution: {type: "v2", value: new THREE.Vector2() },
slant: {type: "v2", value: new THREE.Vector2(Math.cos(slant), Math.sin(slant)) },
@@ -201,9 +199,7 @@ const glyphVariable = gpuCompute.addVariable(
#extension GL_OES_standard_derivatives: enable
#endif
precision lowp float;
#define BIG_ENOUGH 0.001
#define MODIFIED_ALPHATEST (0.02 * isBigEnough / BIG_ENOUGH)
uniform float sharpness;
uniform sampler2D msdf;
uniform sampler2D glyphs;
uniform float numColumns;
@@ -262,16 +258,7 @@ const glyphVariable = gpuCompute.addVariable(
// The rest is straight up MSDF
float sigDist = median(sample.r, sample.g, sample.b) - 0.5;
float alpha = clamp(sigDist/fwidth(sigDist) + 0.5, 0.0, 1.0);
float dscale = 0.353505 / sharpness;
vec2 duv = dscale * (dFdx(uv) + dFdy(uv));
float isBigEnough = max(abs(duv.x), abs(duv.y));
if (isBigEnough > BIG_ENOUGH) {
float ratio = BIG_ENOUGH / isBigEnough;
alpha = ratio * alpha + (1.0 - ratio) * (sigDist + 0.5);
}
if (isBigEnough <= BIG_ENOUGH && alpha < 0.5) { discard; return; }
if (alpha < 0.5 * MODIFIED_ALPHATEST) { discard; return; }
gl_FragColor = vec4(vec3(brightness * alpha), 1.0);
}
`