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

A couple changes on the REGL side that missed the boat

Browse Source
This commit is contained in:
Rezmason
2022-09-07 23:00:58 -07:00
parent 2eb7b70926
commit a14b6db911
4 changed files with 3 additions and 153 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
js/regl/rainPass.js
View File

@@ -202,7 +202,7 @@ export default ({ regl, config, lkg }) => {
{ {
primary: output, primary: output,
}, },
Promise.all([msdf.loaded, rainPassShine.loaded, rainPassVert.loaded, rainPassFrag.loaded]), Promise.all([msdf.loaded, rainPassShine.loaded, rainPassSymbol.loaded, rainPassVert.loaded, rainPassFrag.loaded]),
(w, h) => { (w, h) => {
output.resize(w, h); output.resize(w, h);
const aspectRatio = w / h; const aspectRatio = w / h;

59
shaders/glsl/resurrectionPass.frag.glsl
View File

@@ -1,59 +0,0 @@
precision mediump float;
#define PI 3.14159265359
uniform sampler2D tex;
uniform sampler2D bloomTex;
uniform float bloomStrength;
uniform float ditherMagnitude;
uniform float time;
uniform vec3 backgroundColor;
varying vec2 vUV;
highp float rand( const in vec2 uv, const in float t ) {
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 + t);
}
float rgbComponent(float p, float q, float t) {
if (t < 0.0) t += 1.0;
if (t > 1.0) t -= 1.0;
if (t < 1.0 / 6.0) return p + (q - p) * 6.0 * t;
if (t < 1.0 / 2.0) return q;
if (t < 2.0 / 3.0) return p + (q - p) * (2.0 / 3.0 - t) * 6.0;
return p;
}
vec3 hslToRgb(float h, float s, float l){
float q = l < 0.5 ? l * (1. + s) : l + s - l * s;
float p = 2.0 * l - q;
return vec3(
rgbComponent(p, q, h + 1.0 / 3.0),
rgbComponent(p, q, h),
rgbComponent(p, q, h - 1.0 / 3.0)
);
}
void main() {
// Mix the texture and bloom based on distance from center,
// to approximate a lens blur
vec3 brightness = mix(
texture2D( bloomTex, vUV ).rgb * bloomStrength,
texture2D( tex, vUV ).rgb,
(0.7 - length(vUV - 0.5))
) * 1.25;
// Dither: subtract a random value from the brightness
brightness = brightness - rand( gl_FragCoord.xy, time ) * ditherMagnitude;
// Calculate a hue based on distance from center
float hue = 0.35 + (length(vUV - vec2(0.5, 1.0)) * -0.4 + 0.2);
// Convert HSL to RGB
vec3 rgb = hslToRgb(hue, 0.8, max(0., brightness.r)) * vec3(0.8, 1.0, 0.7);
// Calculate a separate RGB for upward-flowing glyphs
vec3 resurrectionRGB = hslToRgb(0.13, 1.0, max(0., brightness.g) * 0.9);
gl_FragColor = vec4(rgb + resurrectionRGB + backgroundColor, 1.0);
}

4
shaders/wgsl/rainPass.wgsl
View File

@@ -16,7 +16,7 @@ struct Config {
brightnessDecay : f32, brightnessDecay : f32,
baseBrightness : f32, baseBrightness : f32,
baseContrast : f32, baseContrast : f32,
cursorEffectThreshold : f32, cursorBrightness : f32,
cycleSpeed : f32, cycleSpeed : f32,
cycleFrameSkip : i32, cycleFrameSkip : i32,
fallSpeed : f32, fallSpeed : f32,
@@ -209,7 +209,7 @@ fn applyRippleEffect(effect : f32, simTime : f32, screenPos : vec2<f32>) -> f32
} }
fn applyCursorEffect(effect : f32, brightness : f32) -> f32 { fn applyCursorEffect(effect : f32, brightness : f32) -> f32 {
if (brightness >= config.cursorEffectThreshold) { if (brightness >= config.cursorBrightness) {
return 1.0; return 1.0;
} }
return effect; return effect;

91
shaders/wgsl/resurrectionPass.wgsl
View File

@@ -1,91 +0,0 @@
struct Config {
bloomStrength : f32,
ditherMagnitude : f32,
backgroundColor : vec3<f32>,
};
struct Time {
seconds : f32,
frames : i32,
};
@group(0) @binding(0) var<uniform> config : Config;
@group(0) @binding(1) var<uniform> time : Time;
@group(0) @binding(2) var linearSampler : sampler;
@group(0) @binding(3) var tex : texture_2d<f32>;
@group(0) @binding(4) var bloomTex : texture_2d<f32>;
@group(0) @binding(5) var outputTex : texture_storage_2d<rgba8unorm, write>;
struct ComputeInput {
@builtin(global_invocation_id) id : vec3<u32>,
};
const PI : f32 = 3.14159265359;
fn randomFloat( uv : vec2<f32> ) -> f32 {
let a = 12.9898;
let b = 78.233;
let c = 43758.5453;
let dt = dot( uv, vec2<f32>( a, b ) );
let sn = dt % PI;
return fract(sin(sn) * c);
}
fn rgbComponent(p : f32, q : f32, t : f32) -> f32 {
var t2 = t;
if (t2 < 0.0) { t2 += 1.0; }
if (t2 > 1.0) { t2 -= 1.0; }
if (t2 < 1.0 / 6.0) { return p + (q - p) * 6.0 * t2; }
if (t2 < 1.0 / 2.0) { return q; }
if (t2 < 2.0 / 3.0) { return p + (q - p) * (2.0 / 3.0 - t2) * 6.0; }
return p;
}
fn hslToRgb(h : f32, s : f32, l : f32) -> vec3<f32> {
var q : f32;
if (l < 0.5) {
q = l * (1. + s);
} else {
q = l + s - l * s;
}
var p = 2.0 * l - q;
return vec3<f32>(
rgbComponent(p, q, h + 1.0 / 3.0),
rgbComponent(p, q, h),
rgbComponent(p, q, h - 1.0 / 3.0)
);
}
@compute @workgroup_size(32, 1, 1) fn computeMain(input : ComputeInput) {
// Resolve the invocation ID to a texel coordinate
var coord = vec2<i32>(input.id.xy);
var screenSize = textureDimensions(tex);
if (coord.x >= screenSize.x) {
return;
}
var uv = vec2<f32>(coord) / vec2<f32>(screenSize);
// Mix the texture and bloom based on distance from center,
// to approximate a lens blur
var brightness = mix(
textureSampleLevel( tex, linearSampler, uv, 0.0 ).rgb,
textureSampleLevel( bloomTex, linearSampler, uv, 0.0 ).rgb * config.bloomStrength,
(0.7 - length(uv - 0.5))
) * 1.25;
// Dither: subtract a random value from the brightness
brightness -= randomFloat( uv + vec2<f32>(time.seconds) ) * config.ditherMagnitude;
// Calculate a hue based on distance from center
var hue = 0.35 + (length(vec2<f32>(uv.x, 1.0 - uv.y) - vec2<f32>(0.5, 1.0)) * -0.4 + 0.2);
// Convert HSL to RGB
var rgb = hslToRgb(hue, 0.8, max(0., brightness.r)) * vec3<f32>(0.8, 1.0, 0.7);
// Calculate a separate RGB for upward-flowing glyphs
var resurrectionRGB = hslToRgb(0.13, 1.0, max(0., brightness.g) * 0.9);
textureStore(outputTex, coord, vec4<f32>(rgb + resurrectionRGB + config.backgroundColor, 1.0));
}