var i, a = 0, b = 0, c = 0, d = 0;
var r1, r2, x, y;
var tunnelVars = function() {
	this.color = [ 255, 0, 255, 0.1 ];
	this.a = 0.031;
	this.b = 0.025;
	this.c = -1.0;
	this.movex = 211;
	this.movey = 174;
	this.segments = 60;
};

var tunnel = new tunnelVars();
function playTunnel(){
	ctx.lineWidth = 10;
	animateTunnel();
}
function animateTunnel() {
	for (i = 0; i < 50; i++) {
		r1 = tunnel.movex + i * Math.sin(a);
		r2 = tunnel.movey + i * Math.cos(b);
		x = W / 2 + Math.cos(a + i * 0.1) * r1;
		y = H / 2 + Math.sin(b + i * 0.1) * r2;

		ctx.fillStyle = 'rgba(' + Math.round(tunnel.color[0]) + ',' + Math.round(tunnel.color[1]) + ',' + Math.round(tunnel.color[2]) + ',' + (Math.sin(i + c + beat) * 0.4 + 0.6) * (i * 0.05) + ')';
		for (var j = 0; j < tunnel.segments; j++) {
			ctx.beginPath();
			ctx.arc(x + Math.cos(Math.PI * 2 / tunnel.segments * j) * i * 28, y + Math.sin(Math.PI * 2 / tunnel.segments * j) * i * 28, i * 0.5, 0, Math.PI * 2, true);
			ctx.fill();
		}
	}
	a += tunnel.a;
	b += tunnel.b;
	c += tunnel.c;
	
	addIntroText(x-300, y);

	if (beat > 26)
	{
		fade(0.01);
		if (fade < 1.0)
		{
			tunnelStart = false;
			treeStart = true;
			console.log(treeStart);
			alpha = 0;
		}
	}
}

function addIntroText(x, y){
	var text1  = "An";
	ctx.font = "50pt Arial";
	ctx.fillStyle = "#FFF";
	ctx.fillText(text1, x-60, y);

	var text = "Indigo";
	ctx.save();
	ctx.font = "100pt Arial";
	ctx.fillStyle = "#FFF";
	if (beat > 7)
		ctx.scale(Math.max(0.5, Math.abs((Math.sin(beat)*1.5))), Math.max(1, Math.abs((Math.sin(beat)*1.5))));
	ctx.fillText(text, x, y);
	ctx.restore();

	var text2 = "Production";
	ctx.font = "50pt Arial";
	ctx.fillStyle = "#FFF";
	ctx.fillText(text2, x+345, y-40);

	if (/*Math.floor(beat) % 2 == 1 && */beat > 5)
	{
		var text3 = "Weboholics";
		ctx.font = "100pt Arial";
		ctx.fillStyle = "#FFF";
		ctx.fillText(text3, x+13, y+103);
	}
}