summaryrefslogtreecommitdiff
path: root/packages/frontend/src/utility/image-effector/fxs/chromaticAberration.ts
blob: 4adb7ce91e8d5e6217fd7bb27dca379268e67d03 (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
/*
 * SPDX-FileCopyrightText: syuilo and misskey-project
 * SPDX-License-Identifier: AGPL-3.0-only
 */

import { defineImageEffectorFx } from '../ImageEffector.js';
import { i18n } from '@/i18n.js';

const shader = `#version 300 es
precision mediump float;

in vec2 in_uv;
uniform sampler2D in_texture;
uniform vec2 in_resolution;
out vec4 out_color;
uniform float u_amount;
uniform float u_start;
uniform bool u_normalize;

void main() {
	int samples = 64;
	float r_strength = 1.0;
	float g_strength = 1.5;
	float b_strength = 2.0;

	vec2 size = vec2(in_resolution.x, in_resolution.y);

	vec4 accumulator = vec4(0.0);
	float normalisedValue = length((in_uv - 0.5) * 2.0);
	float strength = clamp((normalisedValue - u_start) * (1.0 / (1.0 - u_start)), 0.0, 1.0);

	vec2 vector = (u_normalize ? normalize(in_uv - vec2(0.5)) : in_uv - vec2(0.5));
	vec2 velocity = vector * strength * u_amount;

	vec2 rOffset = -vector * strength * (u_amount * r_strength);
	vec2 gOffset = -vector * strength * (u_amount * g_strength);
	vec2 bOffset = -vector * strength * (u_amount * b_strength);

	for (int i = 0; i < samples; i++) {
		accumulator.r += texture(in_texture, in_uv + rOffset).r;
		rOffset -= velocity / float(samples);

		accumulator.g += texture(in_texture, in_uv + gOffset).g;
		gOffset -= velocity / float(samples);

		accumulator.b += texture(in_texture, in_uv + bOffset).b;
		bOffset -= velocity / float(samples);
	}

	out_color = vec4(vec3(accumulator / float(samples)), 1.0);
}
`;

export const FX_chromaticAberration = defineImageEffectorFx({
	id: 'chromaticAberration',
	name: i18n.ts._imageEffector._fxs.chromaticAberration,
	shader,
	uniforms: ['amount', 'start', 'normalize'] as const,
	params: {
		normalize: {
			label: i18n.ts._imageEffector._fxProps.normalize,
			type: 'boolean',
			default: false,
		},
		amount: {
			label: i18n.ts._imageEffector._fxProps.amount,
			type: 'number',
			default: 0.1,
			min: 0.0,
			max: 1.0,
			step: 0.01,
		},
	},
	main: ({ gl, u, params }) => {
		gl.uniform1f(u.amount, params.amount);
		gl.uniform1i(u.normalize, params.normalize ? 1 : 0);
	},
});