1// This shader computes the chromatic aberration effect
2
3// Since post processing is a fullscreen effect, we use the fullscreen vertex shader provided by bevy.
4// This will import a vertex shader that renders a single fullscreen triangle.
5//
6// A fullscreen triangle is a single triangle that covers the entire screen.
7// The box in the top left in that diagram is the screen. The 4 x are the corner of the screen
8//
9// Y axis
10//  1 |  x-----x......
11//  0 |  |  s  |  . ´
12// -1 |  x_____x´
13// -2 |  :  .´
14// -3 |  :´
15//    +---------------  X axis
16//      -1  0  1  2  3
17//
18// As you can see, the triangle ends up bigger than the screen.
19//
20// You don't need to worry about this too much since bevy will compute the correct UVs for you.
21#import bevy_core_pipeline::fullscreen_vertex_shader::FullscreenVertexOutput
22
23@group(0) @binding(0) var screen_texture: texture_2d<f32>;
24@group(0) @binding(1) var texture_sampler: sampler;
25
26struct FullScreenEffect {
27    intensity: f32,
28#ifdef SIXTEEN_BYTE_ALIGNMENT
29    // WebGL2 structs must be 16 byte aligned.
30    _webgl2_padding: vec3<f32>
31#endif
32}
33
34@group(0) @binding(2) var<uniform> settings: FullScreenEffect;
35
36@fragment
37fn fragment(in: FullscreenVertexOutput) -> @location(0) vec4<f32> {
38    // Chromatic aberration strength
39    let offset_strength = settings.intensity;
40
41    // Sample each color channel with an arbitrary shift
42    return vec4<f32>(
43        textureSample(screen_texture, texture_sampler, in.uv + vec2<f32>(offset_strength, -offset_strength)).r,
44        textureSample(screen_texture, texture_sampler, in.uv + vec2<f32>(-offset_strength, 0.0)).g,
45        textureSample(screen_texture, texture_sampler, in.uv + vec2<f32>(0.0, offset_strength)).b,
46        1.0
47    );
48}
49
50