Permalink
Find file
Fetching contributors…
Cannot retrieve contributors at this time
148 lines (139 sloc) 4.04 KB
<html>
<script src="../../lib/colormaps.js"></script>
<script src="../../lib/gpgpu.js"></script>
<script src="../../lib/gpugaussian.js"></script>
<script src="../../lib/gpurand.js"></script>
<script id="retinalmap" type="x-shader/x-fragment">
uniform sampler2D data;
#define over2pi 0.15915494309189533576888376337
void main() {
vec2 z = gl_FragCoord.xy/vec2(W,H);
// convert position to point in complex plane
z = z*2.-1.;
// complex logarithm
vec2 u;
u.x = atan(z.y,z.x);
u.y = log(length(z));
gl_FragColor = texture2D(data,u*over2pi);
}
</script>
<script id="draw-input" type="x-shader/x-fragment">
void main() {
float cx = mod(floor(gl_FragCoord.x/64.),2.);
float cy = mod(floor(gl_FragCoord.y/64.),2.);
float chex = mod(cx+cy,2.);
gl_FragColor = vec4(chex,chex,chex,1);
}
</script>
<script id="colormap" type="x-shader/x-fragment">
uniform sampler2D Uin;
float DecodeFloatXY( vec2 xy ) {
return dot( xy, vec2(1.,1./255.) );
}
void main() {
vec2 XY = gl_FragCoord.xy/vec2(W,H);
vec4 U = texture2D(Uin ,XY);
float Ue = DecodeFloatXY(U.rg);
float Ui = DecodeFloatXY(U.ba);
gl_FragColor = vec4(Ue,Ui,abs(Ue-Ui)*3.0,1.);
}
</script>
<script id="wc" type="x-shader/x-fragment">
uniform sampler2D Uin;
uniform sampler2D Uconv;
uniform float s;
#define dt 1.0
#define Te 10.0
#define Ti 20.0
#define DE (dt/Te)
#define DI (dt/Ti)
// firing nonlinearity
float F(float x) {
return 1./(1.+exp(-x));
}
vec2 EncodeFloatXY( float v ) {
vec2 enc = vec2(1.0, 255.0) * v;
enc = fract(enc);
enc -= enc.yy * vec2(1./255.,0.);
return enc;
}
float DecodeFloatXY( vec2 xy ) {
return dot( xy, vec2(1.,1./255.) );
}
void main() {
float Aei = 12.;
float Aii = 3.;
float Aee = 10.5;
float Aie = 8.5;
float Hi = 3.5;
float He = 2.;
vec2 XY = gl_FragCoord.xy/vec2(W,H);
vec4 U = texture2D(Uin ,XY);
vec4 Uc = texture2D(Uconv ,XY);
float Ue = DecodeFloatXY(U.rg);
float Ui = DecodeFloatXY(U.ba);
float Uec = DecodeFloatXY(Uc.rg);
float Uic = DecodeFloatXY(Uc.ba);
float Ve = F(Aee*Uec-Aie*Uic-He+s);
float Vi = F(Aei*Uec-Aii*Uic-Hi);
Ue += (Ve-Ue)*DE;
Ui += (Vi-Ui)*DI;
gl_FragColor = vec4(
EncodeFloatXY(Ue),
EncodeFloatXY(Ui)
);
}
</script>
<script>
// This is the main script that will run when the website loads
function main()
{
// Retrieve a handle to the canvas element
var canvas = $("maincanvas");
// Create a WebGL context on the canvas, abort if fail
var gl = getRasterGL(canvas);
if (!gl) OUT;
// we're running at 256 because my macbook is slow, but make it
// bigger anyway
canvas.style.width = canvas.style.height = 512
var render = getRasterProgram(gl,'draw-input');
var map = getRasterProgram(gl,'retinalmap');
var wc = getRasterProgram(gl,'wc');
var color = getRasterProgram(gl,'colormap');
var copy = GPUcopy(gl);
var blur = GPUGaussianMultiBlur(gl,1,1,2,2);
console.log(blur.kernel)
var noise = GPUNoise(gl);
var temp = newBasicFramebuffer(gl,{wrap : gl.REPEAT});
var U = newBasicFramebuffer(gl,{wrap : gl.REPEAT});
var UC = newBasicFramebuffer(gl,{wrap : gl.REPEAT});
noise.randomize( U );
var t = 0;
function animate() {
setTimeout(function(){
for (var i=0; i<1; i++) {
blur(U,temp,UC);
wc({
s :
//.5*(Math.sign(Math.sin(t*3.1415926*34/500.))+1),
//.3*(Math.sign(Math.sin(t*3.1415926*6.85/500.))+1),
.2*(Math.sign(Math.sin(t*3.1415926*6/500.))+1),
Uin :U,
Uconv :UC,
},temp);
copy(temp,U);
}
color({Uin:temp});
//copy(temp);
//map({data:temp})
t += 1;
requestAnimationFrame(animate);
},0);
}
animate();
}
</script>
<body onload="javascript:main()">
<canvas id='maincanvas' style="width:256px;height:256px;"></canvas>
</body>
</html>