summaryrefslogtreecommitdiff
path: root/apps/web/src/lib
diff options
context:
space:
mode:
Diffstat (limited to 'apps/web/src/lib')
-rw-r--r--apps/web/src/lib/effects/definitions/blur.frag.glsl25
-rw-r--r--apps/web/src/lib/effects/definitions/blur.ts18
-rw-r--r--apps/web/src/lib/effects/effect.vert.glsl7
-rw-r--r--apps/web/src/lib/effects/index.ts6
-rw-r--r--apps/web/src/lib/effects/types.ts83
-rw-r--r--apps/web/src/lib/masks/shaders/jfa-distance.frag.glsl36
-rw-r--r--apps/web/src/lib/shaders/jfa-init.frag.glsl25
-rw-r--r--apps/web/src/lib/shaders/jfa-step.frag.glsl60
8 files changed, 53 insertions, 207 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,
diff --git a/apps/web/src/lib/effects/effect.vert.glsl b/apps/web/src/lib/effects/effect.vert.glsl
deleted file mode 100644
index 770faf0c..00000000
--- a/apps/web/src/lib/effects/effect.vert.glsl
+++ /dev/null
@@ -1,7 +0,0 @@
-attribute vec2 a_position;
-varying vec2 v_texCoord;
-
-void main() {
- v_texCoord = a_position * 0.5 + 0.5;
- gl_Position = vec4(a_position, 0.0, 1.0);
-}
diff --git a/apps/web/src/lib/effects/index.ts b/apps/web/src/lib/effects/index.ts
index 549811f5..92484ee2 100644
--- a/apps/web/src/lib/effects/index.ts
+++ b/apps/web/src/lib/effects/index.ts
@@ -2,7 +2,7 @@ import { generateUUID } from "@/utils/id";
import { buildDefaultParamValues } from "@/lib/registry";
import { effectsRegistry } from "./registry";
import type { ParamValues } from "@/lib/params";
-import type { Effect, EffectDefinition, ResolvedEffectPass } from "@/lib/effects/types";
+import type { Effect, EffectDefinition, EffectPass } from "@/lib/effects/types";
import { VISUAL_ELEMENT_TYPES } from "@/lib/timeline";
export { effectsRegistry } from "./registry";
@@ -18,12 +18,12 @@ export function resolveEffectPasses({
effectParams: ParamValues;
width: number;
height: number;
-}): ResolvedEffectPass[] {
+}): EffectPass[] {
if (definition.renderer.buildPasses) {
return definition.renderer.buildPasses({ effectParams, width, height });
}
return definition.renderer.passes.map((pass) => ({
- fragmentShader: pass.fragmentShader,
+ shader: pass.shader,
uniforms: pass.uniforms({ effectParams, width, height }),
}));
}
diff --git a/apps/web/src/lib/effects/types.ts b/apps/web/src/lib/effects/types.ts
index 5573ef12..1862b440 100644
--- a/apps/web/src/lib/effects/types.ts
+++ b/apps/web/src/lib/effects/types.ts
@@ -1,42 +1,41 @@
-import type { ParamDefinition, ParamValues } from "@/lib/params";
-
-export interface Effect {
- id: string;
- type: string;
- params: ParamValues;
- enabled: boolean;
-}
-
-export interface ResolvedEffectPass {
- fragmentShader: string;
- uniforms: Record<string, number | number[]>;
-}
-
-export interface WebGLEffectPass {
- fragmentShader: string;
- uniforms(params: {
- effectParams: ParamValues;
- width: number;
- height: number;
- }): Record<string, number | number[]>;
-}
-
-export interface WebGLEffectRenderer {
- type: "webgl";
- passes: WebGLEffectPass[];
- buildPasses?: (params: {
- effectParams: ParamValues;
- width: number;
- height: number;
- }) => ResolvedEffectPass[];
-}
-
-export type EffectRenderer = WebGLEffectRenderer;
-
-export interface EffectDefinition {
- type: string;
- name: string;
- keywords: string[];
- params: ParamDefinition[];
- renderer: EffectRenderer;
-}
+import type { ParamDefinition, ParamValues } from "@/lib/params";
+
+export interface Effect {
+ id: string;
+ type: string;
+ params: ParamValues;
+ enabled: boolean;
+}
+
+export type EffectUniformValue = number | number[];
+
+export interface EffectPass {
+ shader: string;
+ uniforms: Record<string, EffectUniformValue>;
+}
+
+export interface EffectPassTemplate {
+ shader: string;
+ uniforms(params: {
+ effectParams: ParamValues;
+ width: number;
+ height: number;
+ }): Record<string, EffectUniformValue>;
+}
+
+export interface EffectRendererConfig {
+ passes: EffectPassTemplate[];
+ buildPasses?: (params: {
+ effectParams: ParamValues;
+ width: number;
+ height: number;
+ }) => EffectPass[];
+}
+
+export interface EffectDefinition {
+ type: string;
+ name: string;
+ keywords: string[];
+ params: ParamDefinition[];
+ renderer: EffectRendererConfig;
+}
diff --git a/apps/web/src/lib/masks/shaders/jfa-distance.frag.glsl b/apps/web/src/lib/masks/shaders/jfa-distance.frag.glsl
deleted file mode 100644
index 9d9a8773..00000000
--- a/apps/web/src/lib/masks/shaders/jfa-distance.frag.glsl
+++ /dev/null
@@ -1,36 +0,0 @@
-precision mediump float;
-
-uniform sampler2D u_texture;
-uniform sampler2D u_jfa_outside;
-uniform vec2 u_resolution;
-uniform float u_feather_half;
-
-varying vec2 v_texCoord;
-
-vec2 decodeSeed(vec4 encoded) {
- float x = floor(encoded.r * 255.0 + 0.5) * 256.0 + floor(encoded.g * 255.0 + 0.5);
- float y = floor(encoded.b * 255.0 + 0.5) * 256.0 + floor(encoded.a * 255.0 + 0.5);
- return vec2(x, y);
-}
-
-bool isNoSeed(vec4 encoded) {
- return encoded.r > 0.99 && encoded.g > 0.99 && encoded.b > 0.99 && encoded.a > 0.99;
-}
-
-void main() {
- vec2 pixelCoord = floor(v_texCoord * u_resolution);
-
- vec4 insideEncoded = texture2D(u_texture, v_texCoord);
- vec4 outsideEncoded = texture2D(u_jfa_outside, v_texCoord);
-
- bool hasInside = !isNoSeed(insideEncoded);
- bool hasOutside = !isNoSeed(outsideEncoded);
-
- float distToInside = hasInside ? distance(pixelCoord, decodeSeed(insideEncoded)) : 1e5;
- float distToOutside = hasOutside ? distance(pixelCoord, decodeSeed(outsideEncoded)) : 1e5;
-
- float signedDist = distToOutside - distToInside;
- float alpha = smoothstep(-u_feather_half, u_feather_half, signedDist);
-
- gl_FragColor = vec4(alpha, alpha, alpha, alpha);
-}
diff --git a/apps/web/src/lib/shaders/jfa-init.frag.glsl b/apps/web/src/lib/shaders/jfa-init.frag.glsl
deleted file mode 100644
index e465752c..00000000
--- a/apps/web/src/lib/shaders/jfa-init.frag.glsl
+++ /dev/null
@@ -1,25 +0,0 @@
-precision mediump float;
-
-uniform sampler2D u_texture;
-uniform vec2 u_resolution;
-uniform float u_invert;
-
-varying vec2 v_texCoord;
-
-void main() {
- float mask = texture2D(u_texture, v_texCoord).r;
- bool isSeed = u_invert > 0.5 ? mask < 0.5 : mask > 0.5;
-
- if (isSeed) {
- vec2 pixelCoord = floor(v_texCoord * u_resolution);
- float x = pixelCoord.x;
- float y = pixelCoord.y;
- float xHi = floor(x / 256.0);
- float xLo = x - xHi * 256.0;
- float yHi = floor(y / 256.0);
- float yLo = y - yHi * 256.0;
- gl_FragColor = vec4(xHi / 255.0, xLo / 255.0, yHi / 255.0, yLo / 255.0);
- } else {
- gl_FragColor = vec4(1.0, 1.0, 1.0, 1.0);
- }
-}
diff --git a/apps/web/src/lib/shaders/jfa-step.frag.glsl b/apps/web/src/lib/shaders/jfa-step.frag.glsl
deleted file mode 100644
index 9b76a70b..00000000
--- a/apps/web/src/lib/shaders/jfa-step.frag.glsl
+++ /dev/null
@@ -1,60 +0,0 @@
-precision mediump float;
-
-uniform sampler2D u_texture;
-uniform vec2 u_resolution;
-uniform float u_step_size;
-
-varying vec2 v_texCoord;
-
-vec2 decodeSeed(vec4 encoded) {
- float x = floor(encoded.r * 255.0 + 0.5) * 256.0 + floor(encoded.g * 255.0 + 0.5);
- float y = floor(encoded.b * 255.0 + 0.5) * 256.0 + floor(encoded.a * 255.0 + 0.5);
- return vec2(x, y);
-}
-
-vec4 encodeSeed(vec2 seed) {
- float xHi = floor(seed.x / 256.0);
- float xLo = seed.x - xHi * 256.0;
- float yHi = floor(seed.y / 256.0);
- float yLo = seed.y - yHi * 256.0;
- return vec4(xHi / 255.0, xLo / 255.0, yHi / 255.0, yLo / 255.0);
-}
-
-bool isNoSeed(vec4 encoded) {
- return encoded.r > 0.99 && encoded.g > 0.99 && encoded.b > 0.99 && encoded.a > 0.99;
-}
-
-void main() {
- vec2 pixelCoord = floor(v_texCoord * u_resolution);
- vec2 texelSize = 1.0 / u_resolution;
-
- float bestDist = 1e10;
- vec2 bestSeed = vec2(65535.0);
-
- for (int dy = -1; dy <= 1; dy++) {
- for (int dx = -1; dx <= 1; dx++) {
- vec2 offset = vec2(float(dx), float(dy)) * u_step_size;
- vec2 sampleUV = v_texCoord + offset * texelSize;
-
- if (sampleUV.x < 0.0 || sampleUV.x > 1.0 || sampleUV.y < 0.0 || sampleUV.y > 1.0)
- continue;
-
- vec4 encoded = texture2D(u_texture, sampleUV);
- if (isNoSeed(encoded))
- continue;
-
- vec2 seed = decodeSeed(encoded);
- float dist = distance(pixelCoord, seed);
- if (dist < bestDist) {
- bestDist = dist;
- bestSeed = seed;
- }
- }
- }
-
- if (bestDist < 1e9) {
- gl_FragColor = encodeSeed(bestSeed);
- } else {
- gl_FragColor = vec4(1.0, 1.0, 1.0, 1.0);
- }
-}