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