Babylon.js/Babylon/Shaders/depthOfField.fragment.fx

/*
	BABYLON.JS Depth-of-field GLSL Shader
	Author: Olivier Guyot
	Does depth-of-field blur, edge blur, highlights enhancing
	Inspired by Francois Tarlier & Martins Upitis
*/

#ifdef GL_ES
precision highp float;
#endif


// samplers
uniform sampler2D textureSampler;
uniform sampler2D depthSampler;
uniform sampler2D grainSampler;

// uniforms
uniform float grain_amount;
uniform bool pentagon;
uniform float maxZ;
uniform bool blur_noise;
uniform float screen_width;
uniform float screen_height;
uniform float distortion;
uniform float focus_depth;
uniform float aperture;
uniform float gain;
uniform float threshold;
uniform float edge_blur;

// varyings
varying vec2 vUV;

// constants
#define PI 3.14159265
const int RING_1_SAMPLES = 4;
const int RING_2_SAMPLES = 6;
const int RING_3_SAMPLES = 9;
const int RING_4_SAMPLES = 12;
const int RING_5_SAMPLES = 16;
//const int RING_6_SAMPLES = 15;
const float RING_STEP_DIST = 0.4;			// a new blur ring is added each time this distance is passed
const float PENTAGON_ANGLE_SUB = 1.2566;		// 2PI / 5
const float PENTAGON_ANGLE_SUB_HALF = 0.6283;	// 2PI / 10

// common calculations
vec2 centered_screen_pos;
float radius2;
float radius;


// applies edge distortion on texture coords
vec2 getDistortedCoords(vec2 coords) {

	if(distortion == 0.0) { return coords; }

	vec2 direction = 1.0 * normalize(centered_screen_pos);
	vec2 dist_coords = vec2(0.5, 0.5);
	dist_coords.x = 0.5 + direction.x * radius2 * 1.0;
	dist_coords.y = 0.5 + direction.y * radius2 * 1.0;
	float dist_amount = clamp(distortion*0.23, 0.0, 1.0);

	dist_coords = mix(coords, dist_coords, dist_amount);

	return dist_coords;
}

// picks either original screen color or highlights only
vec4 getColor(vec2 coords, bool highlight) {

	vec4 color = texture2D(textureSampler, coords);

	if(highlight) {
		float luminance = dot(color.rgb, vec3(0.2125, 0.7154, 0.0721));
		float lum_threshold;
		if(threshold > 1.0) { lum_threshold = 0.94 + 0.01 * threshold; }
		else { lum_threshold = 0.5 + 0.44 * threshold; }
		if(luminance < lum_threshold) {
			color.rgb = vec3(0.0, 0.0, 0.0);
			color.a = 1.0;
		}
	}

	return color;
}

// returns a modifier to be applied on the radius, in order to simulate a pentagon
float pentagonShape(float angle) {
    float a1 = mod(angle, PENTAGON_ANGLE_SUB) / PENTAGON_ANGLE_SUB - 0.5;
    float a2 = 0.5 - a1 * a1;
    return 1.35 - 0.94 * a2;
}

// returns original screen color after blur
vec4 getBlurColor(vec2 coords, float size, bool highlight) {

	float w = (size/screen_width);
	float h = (size/screen_height);

	vec4 col = getColor(coords, highlight);
	if(size == 0.0) { return col; }

	float s = 1.0;
	float pw;			// sample x relative coord
	float ph;			// sample y relative coord
	float bias = 0.65;	// inner/outer ring bias
	if(highlight) { bias = 0.95; }
	float sample_angle;
	float ratio_rings;
	float ring_radius;
	float penta;		// pentagon shape modifier

	int ring_count;
	if(size >= 6.0 * RING_STEP_DIST) { ring_count = 6; }
	else if(size >= 5.0 * RING_STEP_DIST) { ring_count = 5; }
	else if(size >= 4.0 * RING_STEP_DIST) { ring_count = 4; }
	else if(size >= 3.0 * RING_STEP_DIST) { ring_count = 3; }
	else if(size >= 2.0 * RING_STEP_DIST) { ring_count = 2; }
	else { ring_count = 1; }
	
	// RING 1
	if(size > RING_STEP_DIST) {
		ring_radius = size / float(ring_count);
		ratio_rings = 1.0 / float(ring_count);
		for(int i = 0; i < RING_1_SAMPLES; i++) {
			sample_angle = PI *2.0 * float(i) / float(RING_1_SAMPLES);
			if(pentagon) { penta = pentagonShape(sample_angle); }
			else { penta = 1.0; }
			pw = cos( sample_angle ) * penta * ring_radius;
			ph = sin( sample_angle ) * penta * ring_radius;
			col += getColor(coords + vec2(pw*w,ph*h), highlight) * mix( 1.0, ratio_rings, bias );
			s += 1.0 * mix(1.0, ratio_rings, bias);
		}
	}	

	// RING 2
	if(size > RING_STEP_DIST * 2.0) {
		ring_radius = 2.0 * size / float(ring_count);
		ratio_rings = 2.0 / float(ring_count);
		for(int i = 0; i < RING_2_SAMPLES; i++) {
			sample_angle = PI *2.0 * float(i) / float(RING_2_SAMPLES);
			if(pentagon) { penta = pentagonShape(sample_angle); }
			else { penta = 1.0; }
			pw = cos( sample_angle ) * penta * ring_radius;
			ph = sin( sample_angle ) * penta * ring_radius;
			col += getColor(coords + vec2(pw*w,ph*h), highlight) * mix( 1.0, ratio_rings, bias );
			s += 1.0 * mix(1.0, ratio_rings, bias);  
		}
	}	

	// RING 3
	if(size > RING_STEP_DIST * 3.0) {
		ring_radius = 3.0 * size / float(ring_count);
		ratio_rings = 3.0 / float(ring_count);
		for(int i = 0; i < RING_3_SAMPLES; i++) {
			sample_angle = PI *2.0 * float(i) / float(RING_3_SAMPLES);
			if(pentagon) { penta = pentagonShape(sample_angle); }
			else { penta = 1.0; }
			pw = cos( sample_angle ) * penta * ring_radius;
			ph = sin( sample_angle ) * penta * ring_radius;
			col += getColor(coords + vec2(pw*w,ph*h), highlight) * mix( 1.0, ratio_rings, bias );
			s += 1.0 * mix(1.0, ratio_rings, bias);  
		}
	}	

	// RING 4
	if(size > RING_STEP_DIST * 4.0) {
		ring_radius = 4.0 * size / float(ring_count);
		ratio_rings = 4.0 / float(ring_count);
		for(int i = 0; i < RING_4_SAMPLES; i++) {
			sample_angle = PI *2.0 * float(i) / float(RING_4_SAMPLES);
			if(pentagon) { penta = pentagonShape(sample_angle); }
			else { penta = 1.0; }
			pw = cos( sample_angle ) * penta * ring_radius;
			ph = sin( sample_angle ) * penta * ring_radius;
			col += getColor(coords + vec2(pw*w,ph*h), highlight) * mix( 1.0, ratio_rings, bias );
			s += 1.0 * mix(1.0, ratio_rings, bias);  
		}
	}	

	// RING 5
	if(size > RING_STEP_DIST * 5.0) {
		ring_radius = 5.0 * size / float(ring_count);
		ratio_rings = 5.0 / float(ring_count);
		for(int i = 0; i < RING_5_SAMPLES; i++) {
			sample_angle = PI *2.0 * float(i) / float(RING_5_SAMPLES);
			if(pentagon) { penta = pentagonShape(sample_angle); }
			else { penta = 1.0; }
			pw = cos( sample_angle ) * penta * ring_radius;
			ph = sin( sample_angle ) * penta * ring_radius;
			col += getColor(coords + vec2(pw*w,ph*h), highlight) * mix( 1.0, ratio_rings, bias );
			s += 1.0 * mix(1.0, ratio_rings, bias);  
		}
	}	

	col /= s;		// scales color according to samples taken
	col.a = 1.0;

	return col;
}

// on-the-fly constant noise
vec2 rand(vec2 co)
{
	float noise1 = (fract(sin(dot(co ,vec2(12.9898,78.233))) * 43758.5453));
	float noise2 = (fract(sin(dot(co ,vec2(12.9898,78.233)*2.0)) * 43758.5453));
	return clamp(vec2(noise1,noise2),0.0,1.0);
}

void main(void)
{

	// Common calc
	centered_screen_pos = vec2(vUV.x-0.5, vUV.y-0.5);
	radius2 = centered_screen_pos.x*centered_screen_pos.x + centered_screen_pos.y*centered_screen_pos.y;
	radius = sqrt(radius2);

	vec4 final_color;
	vec2 distorted_coords = getDistortedCoords(vUV);
	vec2 texels_coords = vec2(vUV.x * screen_width, vUV.y * screen_height);	// varies from 0 to SCREEN_WIDTH or _HEIGHT

	// blur from depth of field effect
	float dof_blur_amount = 0.0;
	if(focus_depth != -1.0) {
		vec4 depth_sample = texture2D(depthSampler, distorted_coords);
		float depth = depth_sample.r;
		dof_blur_amount = abs(depth - focus_depth) * aperture * 3.5;
		if(dof_blur_amount < 0.05) { dof_blur_amount = 0.0; }				// no blur at all
		else if( depth - focus_depth < 0.0 ) { dof_blur_amount *= 2.0; }	// blur more when close to camera
		dof_blur_amount = clamp(dof_blur_amount, 0.0, 1.0);
	}

	// blur from edge blur effect
	float edge_blur_amount = 0.0;
	if(edge_blur > 0.0) {
		edge_blur_amount = clamp( ( radius*2.0 - 1.0 + 0.15*edge_blur ) * 1.5 , 0.0 , 1.0 ) * 1.3;
	}

	// total blur amount
	float blur_amount = max(edge_blur_amount, dof_blur_amount);

	// apply blur if necessary
	if(blur_amount == 0.0) {
		gl_FragColor = getColor(distorted_coords, false);
	} else {
		gl_FragColor = getBlurColor(distorted_coords, blur_amount * 1.7, false)
					   + gain * blur_amount*getBlurColor(distorted_coords, blur_amount * 2.75, true);

		if(blur_noise) {
			// we put a slight amount of noise in the blurred color
			vec2 noise = rand(distorted_coords) * 0.01 * blur_amount;
			vec2 blurred_coord = vec2(distorted_coords.x + noise.x, distorted_coords.y + noise.y);
			gl_FragColor = 0.04 * getColor(blurred_coord, false) + 0.96 * gl_FragColor;
		}
	}

	if(grain_amount > 0.0) {
		vec4 grain_color = texture2D(grainSampler, texels_coords*0.003);
		gl_FragColor.rgb += ( -0.5 + grain_color.rgb ) * 0.20;
	}
}