feature (post): add color presets

This commit is contained in:
FMS-Cat
2021-03-31 19:07:00 +09:00
parent a99bd28c9b
commit d5ff4134aa
2 changed files with 35 additions and 22 deletions

View File

@@ -3,6 +3,7 @@ import { Entity } from '../heck/Entity';
import { Material } from '../heck/Material';
import { Quad } from '../heck/components/Quad';
import { RenderTarget } from '../heck/RenderTarget';
import { auto } from '../globals/automaton';
import { dummyRenderTarget } from '../globals/dummyRenderTarget';
import { quadGeometry } from '../globals/quadGeometry';
import { randomTexture } from '../globals/randomTexture';
@@ -14,6 +15,19 @@ export interface PostOptions {
target: RenderTarget;
}
const colorPresets = [
{
lift: [ -0.07, 0.02, 0.03, 0.01 ],
gamma: [ 0.0, -0.02, 0.07, 0.02 ],
gain: [ 1.20, 0.95, 0.92, 1.0 ],
},
{
lift: [ -0.03, 0.01, 0.08, 0.0 ],
gamma: [ -0.04, 0.02, -0.05, 0.0 ],
gain: [ 1.04, 0.98, 1.04, 1.0 ],
},
];
export class Post extends Entity {
public constructor( options: PostOptions ) {
super();
@@ -37,10 +51,19 @@ export class Post extends Entity {
}
}
this.components.push( new Quad( {
const quad = new Quad( {
target: options.target,
material,
name: process.env.DEV && 'Post/quad',
} ) );
} );
this.components.push( quad );
// -- auto -------------------------------------------------------------------------------------
auto( 'Post/colorPreset', ( { value } ) => {
const preset = colorPresets[ value ];
material.addUniform( 'colorLift', '4f', ...preset.lift );
material.addUniform( 'colorGamma', '4f', ...preset.gamma );
material.addUniform( 'colorGain', '4f', ...preset.gain );
} );
}
}

View File

@@ -19,6 +19,9 @@ out vec4 fragColor;
uniform float time;
uniform vec2 resolution;
uniform vec4 colorLift;
uniform vec4 colorGamma;
uniform vec4 colorGain;
uniform sampler2D sampler0;
uniform sampler2D samplerRandom;
@@ -35,27 +38,14 @@ vec3 barrel( float amp, vec2 uv ) {
return texture( sampler0, vec2( p.x, p.y ) ).xyz;
}
vec3 aces( vec3 rgb ) {
const float a = 2.51;
const float b = 0.03;
const float c = 2.43;
const float d = 0.59;
const float e = 0.14;
return saturate( ( rgb * ( a * rgb + b ) ) / ( rgb * ( c * rgb + d ) + e ) );
vec3 aces( vec3 x ) {
return saturate( ( x * ( 0.45 * x + 0.02 ) ) / ( x * ( 0.45 * x + 0.07 ) + 0.2 ) );
}
vec3 liftGammaGain( vec3 rgb ) {
const vec4 lift = vec4( -0.07, 0.02, 0.03, 0.01 );
const vec4 gamma = vec4( 0.0, -0.02, 0.07, 0.02 );
const vec4 gain = vec4( 1.20, 0.95, 0.92, 1.0 );
vec4 liftt = 1.0 - pow( 1.0 - colorLift, log2( colorGain + 1.0 ) );
// const vec4 lift = vec4( 0.02, -0.01, 0.09, 0.0 );
// const vec4 gamma = vec4( -0.05, 0.02, -0.08, 0.0 );
// const vec4 gain = vec4( 1.06, 0.96, 1.10, 1.0 );
vec4 liftt = 1.0 - pow( 1.0 - lift, log2( gain + 1.0 ) );
vec4 gammat = gamma.rgba - vec4( 0.0, 0.0, 0.0, dot( LUMA, gamma.rgb ) );
vec4 gammat = colorGamma.rgba - vec4( 0.0, 0.0, 0.0, dot( LUMA, colorGamma.rgb ) );
vec4 gammatTemp = 1.0 + 4.0 * abs( gammat );
gammat = mix( gammatTemp, 1.0 / gammatTemp, step( 0.0, gammat ) );
@@ -63,11 +53,11 @@ vec3 liftGammaGain( vec3 rgb ) {
float luma = dot( LUMA, col );
col = pow( col, gammat.rgb );
col *= pow( gain.rgb, gammat.rgb );
col *= pow( colorGain.rgb, gammat.rgb );
col = max( mix( 2.0 * liftt.rgb, vec3( 1.0 ), col ), 0.0 );
luma = pow( luma, gammat.a );
luma *= pow( gain.a, gammat.a );
luma *= pow( colorGain.a, gammat.a );
luma = max( mix( 2.0 * liftt.a, 1.0, luma ), 0.0 );
col += luma - dot( LUMA, col );
@@ -98,8 +88,8 @@ void main() {
vec4 seed = texture( samplerRandom, uv );
prng( seed );
prng( seed );
col = aces( max( 2.0 * col, 0.0 ) ) / aces( vec3( 11.2 ) );
col += ( pow( prng( seed ), 2.2 ) - 0.25 ) * 0.002;
col = aces( saturate( col ) );
col = pow( saturate( col ), vec3( 0.4545 ) );
col = liftGammaGain( col );