4 ms·
Got the matrix working. I tried adjusting the UV so we could see the top of the sphere, but I gave up. For what it's worth, the threejs uniforms "projectionMat
by rezmason 3y ago
Got the matrix working.
I tried adjusting the UV so we could see the top of the sphere, but I gave up. For what it's worth, the threejs uniforms "projectionMatrix" and "modelViewMatrix" can be referenced in the GLSL as long as you declare them up top.
#define PI 3.14159265359
#define SQRT_2 1.4142135623730951
#define SQRT_5 2.23606797749979
//uniform mat4 projectionMatrix, modelViewMatrix;
uniform float time;
varying vec2 vUv;
varying vec3 vNormal;
highp float randomFloat( const in vec2 uv ) {
const highp float a = 12.9898, b = 78.233, c = 43758.5453;
highp float dt = dot( uv.xy, vec2( a,b ) ), sn = mod( dt, PI );
return fract(sin(sn) * c);
}
float wobble(float x) {
return x + 0.3 * sin(SQRT_2 * x) + 0.2 * sin(SQRT_5 * x);
}
float getRainBrightness(float simTime, vec2 glyphPos) {
float columnTimeOffset = randomFloat(vec2(glyphPos.x, 0.)) * 1000.;
float columnSpeedOffset = randomFloat(vec2(glyphPos.x + 0.1, 0.)) * 0.5 + 0.5;
float columnTime = columnTimeOffset + simTime * columnSpeedOffset;
float rainTime = (glyphPos.y * 0.01 + columnTime) * 350.0;
rainTime = wobble(rainTime);
return 1.0 - fract(rainTime);
}
void main(){
float t = fract(time / 14.487);
vec2 animatedUv = fract(vUv + vec2(t * 0.002, 0));
vec2 gridSize = vec2(3.14 / 2.0, 1.0) * 100.0;
vec2 glyphUv = fract(animatedUv * gridSize);
vec2 gridCoord = floor(animatedUv * gridSize) / gridSize;
float brightness = getRainBrightness(t * 0.1, gridCoord);
brightness = clamp(0.0, 1.0, brightness * 1.6 - 1.2);
float coverage = 1.3 - length(glyphUv - 0.5) * 3.0;
gl_FragColor = vec4(brightness * coverage * vec3(0.2, 1.0, 0.05), 1);
}