diff options
Diffstat (limited to 'apps/web/src/lib/effects/definitions')
| -rw-r--r-- | apps/web/src/lib/effects/definitions/blur.frag.glsl | 25 | ||||
| -rw-r--r-- | apps/web/src/lib/effects/definitions/blur.ts | 18 |
2 files changed, 9 insertions, 34 deletions
diff --git a/apps/web/src/lib/effects/definitions/blur.frag.glsl b/apps/web/src/lib/effects/definitions/blur.frag.glsl deleted file mode 100644 index c9ad2eae..00000000 --- a/apps/web/src/lib/effects/definitions/blur.frag.glsl +++ /dev/null @@ -1,25 +0,0 @@ -precision mediump float; - -uniform sampler2D u_texture; -uniform vec2 u_resolution; -uniform float u_sigma; -uniform float u_step; -uniform vec2 u_direction; - -varying vec2 v_texCoord; - -void main() { - vec2 texelSize = 1.0 / u_resolution; - - vec4 color = vec4(0.0); - float totalWeight = 0.0; - - for (int i = -30; i <= 30; i++) { - float pos = float(i) * u_step; - float weight = exp(-(pos * pos) / (2.0 * u_sigma * u_sigma)); - color += texture2D(u_texture, v_texCoord + texelSize * u_direction * pos) * weight; - totalWeight += weight; - } - - gl_FragColor = color / totalWeight; -}
\ No newline at end of file diff --git a/apps/web/src/lib/effects/definitions/blur.ts b/apps/web/src/lib/effects/definitions/blur.ts index 54934402..3bfd5e3c 100644 --- a/apps/web/src/lib/effects/definitions/blur.ts +++ b/apps/web/src/lib/effects/definitions/blur.ts @@ -1,5 +1,6 @@ -import type { EffectDefinition, ResolvedEffectPass } from "@/lib/effects/types"; -import blurFragmentShader from "./blur.frag.glsl"; +import type { EffectDefinition, EffectPass } from "@/lib/effects/types"; + +export const GAUSSIAN_BLUR_SHADER = "gaussian-blur"; const MAX_SINGLE_PASS_SIGMA = 10; const MAX_STEP = 4; @@ -17,7 +18,7 @@ export function buildGaussianBlurPasses({ }: { sigmaX: number; sigmaY: number; -}): ResolvedEffectPass[] { +}): EffectPass[] { const maxSigma = Math.max(sigmaX, sigmaY); if (maxSigma < 0.001) return []; @@ -36,10 +37,10 @@ export function buildGaussianBlurPasses({ const stepX = Math.max(1, perPassSigmaX / MAX_SINGLE_PASS_SIGMA); const stepY = Math.max(1, perPassSigmaY / MAX_SINGLE_PASS_SIGMA); - const passes: ResolvedEffectPass[] = []; + const passes: EffectPass[] = []; for (let i = 0; i < iterations; i++) { passes.push({ - fragmentShader: blurFragmentShader, + shader: GAUSSIAN_BLUR_SHADER, uniforms: { u_sigma: perPassSigmaX, u_step: stepX, @@ -47,7 +48,7 @@ export function buildGaussianBlurPasses({ }, }); passes.push({ - fragmentShader: blurFragmentShader, + shader: GAUSSIAN_BLUR_SHADER, uniforms: { u_sigma: perPassSigmaY, u_step: stepY, @@ -83,10 +84,9 @@ export const blurEffectDefinition: EffectDefinition = { }, ], renderer: { - type: "webgl", passes: [ { - fragmentShader: blurFragmentShader, + shader: GAUSSIAN_BLUR_SHADER, uniforms: ({ effectParams, width }) => ({ u_sigma: Math.max(intensityToSigma(parseIntensity(effectParams), width, 1920), 0.001), u_step: 1, @@ -94,7 +94,7 @@ export const blurEffectDefinition: EffectDefinition = { }), }, { - fragmentShader: blurFragmentShader, + shader: GAUSSIAN_BLUR_SHADER, uniforms: ({ effectParams, height }) => ({ u_sigma: Math.max(intensityToSigma(parseIntensity(effectParams), height, 1080), 0.001), u_step: 1, |
