From b33eeb13663b2321793c4127dcd4a1d108cefa53 Mon Sep 17 00:00:00 2001 From: syuilo <4439005+syuilo@users.noreply.github.com> Date: Sun, 15 Jun 2025 08:47:59 +0900 Subject: [PATCH] enhance(frontend/image-effector): tweak distort fx --- .../src/utility/image-effector/fxs/distort.ts | 22 +++++++++++-------- 1 file changed, 13 insertions(+), 9 deletions(-) diff --git a/packages/frontend/src/utility/image-effector/fxs/distort.ts b/packages/frontend/src/utility/image-effector/fxs/distort.ts index f91287c038..67ebc77733 100644 --- a/packages/frontend/src/utility/image-effector/fxs/distort.ts +++ b/packages/frontend/src/utility/image-effector/fxs/distort.ts @@ -9,6 +9,10 @@ import { i18n } from '@/i18n.js'; const shader = `#version 300 es precision mediump float; +const float PI = 3.141592653589793; +const float TWO_PI = 6.283185307179586; +const float HALF_PI = 1.5707963267948966; + in vec2 in_uv; uniform sampler2D in_texture; uniform vec2 in_resolution; @@ -20,8 +24,8 @@ out vec4 out_color; void main() { float v = u_direction == 0 ? - sin(u_phase + in_uv.y * u_frequency) * u_strength : - sin(u_phase + in_uv.x * u_frequency) * u_strength; + sin((HALF_PI + (u_phase * PI) - (u_frequency / 2.0)) + in_uv.y * u_frequency) * u_strength : + sin((HALF_PI + (u_phase * PI) - (u_frequency / 2.0)) + in_uv.x * u_frequency) * u_strength; vec4 in_color = u_direction == 0 ? texture(in_texture, vec2(in_uv.x + v, in_uv.y)) : texture(in_texture, vec2(in_uv.x, in_uv.y + v)); @@ -38,32 +42,32 @@ export const FX_distort = defineImageEffectorFx({ direction: { type: 'number:enum' as const, enum: [{ value: 0, label: 'v' }, { value: 1, label: 'h' }], - default: 0, + default: 1, }, phase: { type: 'number' as const, - default: 50.0, - min: 0.0, - max: 100, + default: 0.0, + min: -1.0, + max: 1.0, step: 0.01, }, frequency: { type: 'number' as const, - default: 50, + default: 30, min: 0, max: 100, step: 0.1, }, strength: { type: 'number' as const, - default: 0.1, + default: 0.05, min: 0, max: 1, step: 0.01, }, }, main: ({ gl, u, params }) => { - gl.uniform1f(u.phase, params.phase / 10); + gl.uniform1f(u.phase, params.phase); gl.uniform1f(u.frequency, params.frequency); gl.uniform1f(u.strength, params.strength); gl.uniform1i(u.direction, params.direction);