Flare3D FLSL Post Effect demo "Swirl Effect"

To view this page ensure that Adobe Flash Player version 11.1.0 or greater is installed.

Swirl Effect

Post Processing Effects in stage3d made by Flare3D shading language.

Instructions

• Click on the photo to next image.
• Rotational strength changes according to the time which is clicking the mouse.
• Animation easing and the speed changes randomly.

Credit

• Made on Flare3D FLSL and Tween24
• Reference of Swirl Post Processing Filter in GLSL
• Authoring by orange-suzuki.com

Creater

• http://orange-suzuki.com/blog
• http://twitter.com/orangesuzuki

Update

• created at 2013.01.11

FLSL code

use namespace flare;
use namespace flare.transforms;
use namespace flare.filters;

param SIN_TIME stime;
param COS_TIME ctime;
param TIME time;
param MOUSE mouse;
input UV0 uv;
interpolated float2 iUV = uv;

// swirl effect parameters
const float radius = 400;

// arguments from AS
sampler2D texture;
sampler2D texture2;
param float input_sin = 0;
param float input_theta = 0;
param float input_power = 40;

/**
 * Swirl Effect
 */
float4 postFX(sampler2D tex, float2 _uv)
{
	// calculate distance from center
	float2 center = float2(mouse.x, mouse.y);
	float2 texSize = float2(800, 530);
	float2 tc = _uv * texSize;
	tc -= center;
	float dist = length(tc);

	// move color
	#if( dist < radius)
	{
		float percent = (radius - dist) / radius;
		float theta = percent * percent * input_power * input_sin;
		float s = sin(theta);
		float c = cos(theta);
		tc = float2(dot(tc, float2(c, -s)), dot(tc, float2(s, c)));
	}
	tc += center;
	
	// return only one color
	//float3 color = sampler2D(tex, tc/texSize).rgb;
	
	// return mix color
	float4 ratio = input_theta/PI;
	float4 color = sampler2D(texture, tc/texSize);
	float4 color2 = sampler2D(texture2, tc/texSize);
	float4 color3 = color*(1-ratio) + color2 * ratio;
	
	return color3;
}

/**
 * main
 */
technique main
{
	float2 uvs = float2(iUV.x, iUV.y);
	output vertex = transform();
	output fragment = postFX(texture, uvs);
}