var canvas = document.getElementById("canvas");
var ctx=canvas.getContext("2d");

var W=400;
var H=400;

draw();
function canvasInit(){
	setInterval(draw,10000); 
}

function draw(){
	$("#canvas").css({"opacity":1,"display":"block"});
	var star = new Array(10);
	
	for( i=0; i<star.length; i++ ){
		star[i] = new Array(7);
		star[i][0] = Math.random()*W;
		star[i][1] = Math.random()*H;
		star[i][2] = Math.random()*W/3 + W/14;
		var r = Math.random()*255>>0;
		var g = Math.random()*255>>0;
		var b = Math.random()*255>>0;
		r = Math.ceil(r);
		g = Math.ceil(g);
		b = Math.ceil(b);
		star[i][4] = r;
		star[i][5] = g;
		star[i][6] = b;
	}
	
	//reset
	ctx.globalCompositeOperation = "source-over";
	ctx.fillStyle = "rgba(0, 0, 0, 1)";
	ctx.fillRect(0, 0, W, H);
	
	ctx.globalCompositeOperation = "lighter";
	
	//point
	for(i=0; i<star.length; i++){
		ctx.beginPath();
		var edgecolor1 = "rgba(" + star[i][4] + "," + star[i][5] + "," + star[i][6] + ",0.93)";
		var edgecolor2 = "rgba(" + star[i][4] + "," + star[i][5] + "," + star[i][6] + ",0.6)";
		var edgecolor3 = "rgba(" + star[i][4] + "," + star[i][5] + "," + star[i][6] + ",0.1)";
		var edgecolor4 = "rgba(" + star[i][4] + "," + star[i][5] + "," + star[i][6] + ",0)";
		var gradblur = ctx.createRadialGradient(star[i][0], star[i][1], 0, star[i][0], star[i][1], star[i][2]);
		gradblur.addColorStop(0,edgecolor1);
		gradblur.addColorStop(0.4,edgecolor1);
		gradblur.addColorStop(0.7,edgecolor2);
		gradblur.addColorStop(0.9,edgecolor3);
		gradblur.addColorStop(1,edgecolor4);
		ctx.fillStyle = gradblur;
		ctx.arc(star[i][0], star[i][1], star[i][2], 0, Math.PI*2, false);
		ctx.fill();
	}
	$("#canvas").fadeTo(500,.8);
}