document.bgColor="#000";for(var b=document.getElementById("c"),c=b.getContext("2d"),d=b.width=460,e=b.height=460,f=c.getImageData(0,0,d,e),g=[],h=Math.random,i=0,j=Math.sin;g.length<5E4;)g.push({x:h()*d|0,y:h()*e|0,a:0,b:0});setInterval(function(){for(i=0;i<5E4;i++){var a=g[i];if(a.x>=0&&a.x<d&&a.y>=0&&a.y<e)f.data[((a.x|0)+(a.y|0)*d)*4+3]=0;a=g[i];a.x+=a.a;a.y+=a.b;if(a.x<0)a.x=d+a.x;else if(a.x>=d)a.x-=d;if(a.y<0)a.y=e+a.y;else if(a.y>=e)a.y-=e;a.b=j(a.x/100)-0.5;a.a=j(a.y/100)-0.5;a=g[i];if(a.x>=0&&a.x<d&&a.y>=0&&a.y<e){a=((a.x|0)+(a.y|0)*d)*4;f.data[a+0]=255;f.data[a+1]=255;f.data[a+2]=255;f.data[a+3]=255}}c.putImageData(f,0,0)},10);
document.bgColor = '#000';
var canvas = document.getElementById( 'c' );
var context = canvas.getContext( '2d' );
var width = canvas.width = 460;
var height = canvas.height = 460;
var img_data = context.getImageData( 0, 0, width , height );
var max_particles = 50000;
var particles = [];
var rnd = Math.random;
var max = Math.max;
var i = 0;
while ( particles.length < max_particles )
{
particles.push( { x: ( rnd() * width ) | 0, y: ( rnd() * height ) | 0, vx: 0, vy: 0 });
}
function erase( index )
{
var p = particles[ i ];
if ( p.x >= 0 && p.x < width && p.y >= 0 && p.y < height )
{
var idx = ( ( p.x | 0) + ( p.y | 0) * width ) * 4;
img_data.data[ idx + 3 ] = 0;
}
}
function x_movement_fn( particle )
{
return Math.sin( particle.y / 100 ) - 0.5;
}
function y_movement_fn( particle )
{
return Math.sin( particle.x / 100 ) - 0.5;
}
function update( index )
{
var p = particles[ i ];
p.x += p.vx;
p.y += p.vy;
if ( p.x < 0 )
{
p.x = width + p.x;
}
else if ( p.x >= width )
{
p.x -= width;
}
if ( p.y < 0 )
{
p.y = height + p.y;
}
else if ( p.y >= height )
{
p.y -= height;
}
// updates acceleration
p.vy = y_movement_fn( p );
p.vx = x_movement_fn( p );
}
function draw( index )
{
var p = particles[ i ];
if ( p.x >= 0 && p.x < width && p.y >= 0 && p.y < height )
{
var idx = ( ( p.x | 0 ) + ( p.y | 0 ) * width ) * 4;
img_data.data[ idx + 0 ] = 255;
img_data.data[ idx + 1 ] = 255;
img_data.data[ idx + 2 ] = 255;
img_data.data[ idx + 3 ] = 255;
}
}
setInterval(
function()
{
for ( i = 0; i < max_particles; i++ )
{
erase( i );
update( i );
draw( i );
}
context.putImageData( img_data, 0, 0 );
},
10
)