d=document.getElementById("c");d.style.cssText="position:absolute;left:0;top:0";w=d.width=innerWidth;h=d.height=innerHeight;M=Math;A=M.abs;c=d.getContext("2d");c.strokeStyle="#f0f";G=[];J=[];function r(n){return M.floor(M.random()*n)}function n(a,b,c){return a<b?a+c:a-c}function p(x,y,v){return{x:x,y:y,v:v||1,to:function(t){var s=this,x=s.x,y=s.y,v=s.v,q=t.x,z=t.y,a=A(x-q),b=A(y-z),k=b/a,vk=a>=b?v*k:v/k;if(a<=v&&b<=v)return 1;if(a>=b){s.x=n(x,q,v);s.y=n(y,z,vk)}else{s.x=n(x,q,vk);s.y=n(y,z,v)}return 0},rt:function(t){var s=this,a=t.x-s.x,b=t.y-s.y,o=M.PI/0.3,w=M.cos(o),z=M.sin(o);return s.to(p(a*w-b*z+t.x,a*z+b*w+t.y))}}}for(i=0;i<500;i++){var x=r(w),y=r(h);G.push(p(x,y,2+r(10)));J.push(p(x,y,G[i].v))}u=p(f=w/2,o=h/2,4);q=p(f,o);(function L(){c.fillRect(0,0,w,h);c.beginPath();if(u.rt(q)){q.x=r(w);q.y=r(h)}for(i=0;++i<500;){var a=G[i],b=J[i],x=a.x-b.x,y=a.y-b.y;if(M.sqrt(x*x+y*y)>=10)b.to(a);if(a.rt(u)){b.x=a.x=r(w);b.y=a.y=r(h)}c.moveTo(a.x,a.y);c.lineTo(b.x,b.y)}c.closePath();c.stroke();setTimeout(L,33)})();
(function () {
var canvas = document.getElementById('c'),
ctx = canvas.getContext('2d'),
w = canvas.width = innerWidth,
h = canvas.height = innerHeight,
M = Math,
A = M.abs,
line_num = 500,
line_len = 10,
heads = [],
tails = [],
hole, hole_target;
function r(n) {
return M.floor(M.random() * n);
}
function n(a, b, c) {
return a < b ? a + c : a - c;
}
function p(x, y, v) {
return {
x: x,
y: y,
v: v || 1,
dist: function (t) {
var s = this,
dx = s.x - t.x,
dy = s.y - t.y;
return M.sqrt(dx * dx + dy * dy);
},
move_to: function (t) {
var s = this,
x = s.x,
y = s.y,
v = s.v,
q = t.x,
z = t.y,
a = A(x - q),
b = A(y - z),
k = b / a,
vk = a >= b ? v * k : v / k;
if (a <= v && b <= v) return true;
if (a >= b) {
s.x = n(x, q, v);
s.y = n(y, z, vk)
}
else {
s.x = n(x, q, vk);
s.y = n(y, z, v)
}
return false;
},
chase: function (t, d) {
var s = this;
if (s.dist(t) >= d) return s.move_to(t);
return false;
},
rotate_to: function (t) {
var s = this,
a = t.x - s.x,
b = t.y - s.y,
o = M.PI / 0.3,
w = M.cos(o),
z = M.sin(o);
return s.move_to(p(a * w - b * z + t.x, a * z + b * w + t.y));
}
};
}
function loop() {
ctx.fillRect(0, 0, w, h);
ctx.beginPath();
if (hole.rotate_to(hole_target)) {
hole_target.x = r(w);
hole_target.y = r(h);
}
for (var i = 0; i < heads.length; i++) {
var head = heads[i],
tail = tails[i];
tail.chase(head, line_len);
if (head.rotate_to(hole)) {
head.x = tail.x = r(w);
head.y = tail.y = r(h);
}
ctx.moveTo(head.x, head.y);
ctx.lineTo(tail.x, tail.y);
}
ctx.closePath();
ctx.stroke();
setTimeout(loop, 33);
}
//Initialization
(function () {
canvas.style.cssText = "position:absolute;left:0;top:0";
ctx.strokeStyle = '#f0f';
hole = p(w / 2, h / 2, 4);
hole_target = p(w / 2, h / 2);
for (var i = 0; i < line_num; i++) {
var x = r(w),
y = r(h);
heads.push(p(x, y, 2 + r(10)));
tails.push(p(x, y, heads[i].v));
}
loop();
})();
})();
