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.
21import 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    // WebGL2 structs must be 16 byte aligned.
29    @if(SIXTEEN_BYTE_ALIGNMENT)
30    _webgl2_padding: vec3<f32>
31}
32
33@group(0) @binding(2) var<uniform> settings: FullScreenEffect;
34
35@fragment
36fn fragment(in: FullscreenVertexOutput) -> @location(0) vec4<f32> {
37    // Chromatic aberration strength
38    let offset_strength = settings.intensity;
39
40    // Sample each color channel with an arbitrary shift
41    return vec4<f32>(
42        textureSample(screen_texture, texture_sampler, in.uv + vec2<f32>(offset_strength, -offset_strength)).r,
43        textureSample(screen_texture, texture_sampler, in.uv + vec2<f32>(-offset_strength, 0.0)).g,
44        textureSample(screen_texture, texture_sampler, in.uv + vec2<f32>(0.0, offset_strength)).b,
45        1.0
46    );
47}