Sepia.glsl

Sepia.glsl

#ifdef GL_ES
    precision mediump float;
#endif

// Текстура сцени для який будемо робити хроматичну аберацію
uniform sampler2D u_texture_0;

// Атрібути UV-координат текстури
varying vec2 v_texcoord;

uniform float u_time;

// Функція відхилення uv-координат
vec2 getOffsetUV(vec2 center_pos, vec2 uv, float offset)
{
    // Відхилиня від фокусу
    vec2 offsetUV = uv - center_pos;

    // Помножуємо на коєфіцієнт відхилення
    offsetUV *= offset;

    // Вираховуємо відхилення uv-координат
    return uv - offsetUV;
}

// Функція трансформації кольору у сепію
vec3 sepia(vec3 color, float adjust)
{
    // Сила трансформації не може бути меншою за 0, та більше 1
    adjust = clamp(adjust, .0, 1.);

    // Отримуємо значення RGB
    float r = color.r;
    float g = color.g;
    float b = color.b;

    // Коефіцієнти трансформації червоного значення кольору (R)
    float rA = 1. - (.607 * adjust);
    float rB = (.769 * adjust);
    float rC = (.189 * adjust);

    // Коефіцієнти трансформації зеленого значення кольору (G)
    float gA = (.349 * adjust);
    float gB = 1. - (.314 * adjust);
    float gC = (.168 * adjust);

    // Коефіцієнти трансформації синього значення кольору (B)
    float bA = (.272 * adjust);
    float bB = (0.534 * adjust);
    float bC = 1.0 - (0.869 * adjust);

    // Трансформуємо червоне значення кольору (R)
    r = r * rA + g * rB + b * rC;
    // Трансформуємо зелене значення кольору (G)
    g = r * gA + g * gB + b * gC;
    // Трансформуємо синє значення кольору (G)
    b = r * bA + g * bB + b * bC;

    // Значення каналів RGB не може бути менше 0 чи більше 1
    r = clamp(r, .0, 1.);
    g = clamp(g, .0, 1.);
    b = clamp(b, .0, 1.);

    // Повертаємо змінені значення RGB
    return vec3(r, g, b);
}

// Не розгорнута версія функції трансформації кольору у сепію
vec3 sepia2(vec3 color, float adjust ) {
    adjust = clamp(adjust, .0, 1.);
    color.r = min(1.0, (color.r * (1.0 - (0.607 * adjust))) + (color.g * (0.769 * adjust)) + (color.b * (0.189 * adjust)));
    color.g = min(1.0, (color.r * (0.349 * adjust)) + (color.g * (1.0 - (0.314 * adjust))) + (color.b * (0.168 * adjust)));    
    color.b = min(1.0, (color.r * (0.272 * adjust)) + (color.g * (0.534 * adjust)) + (color.b * (1.0 - (0.869 * adjust))));
    return color;
}

void main()
{
    // Позиція фокуса
    vec2 center_pos = vec2(.5 , .5);

    // UV-координати текстури
    vec2 uv = v_texcoord;

    // Отримуємо аберацію (відхилення) для кожного каналу RGB
    vec2 uvRed = getOffsetUV(center_pos, uv, .02);
    vec2 uvGreen = getOffsetUV(center_pos, uv, .0);
    vec2 uvBlue = getOffsetUV(center_pos, uv, .01);

    // Вибираемо RBG значення з текстури
    float r = texture2D(u_texture_0, uvRed).r;
    float g = texture2D(u_texture_0, uvGreen).g;
    float b = texture2D(u_texture_0, uvBlue).b;

    // Хроматична аберація
    vec3 chromaticAberration = vec3(r, g, b);

    // Трансформуємо зображення з хроматичною аберацією в сепію
    // з силою трансформації 80%
    vec3 sepiaColor = sepia2(chromaticAberration, 0.8);
    
    // Визуализумо хроматичну аберацію + сепія
    vec3 finalColor = vec3(sepiaColor);

    // Виводимо обчислений колір пікселя
    gl_FragColor = vec4(finalColor, 1.);
}