$(document).ready(function(){
	initCanvas();
	initLogo();
	initSlider();
	initTabs();
	initBox();
	initScroll();
	//initParagraph();
});

var G_vmlCanvasManager;
var canvasEl;

function initCanvas(){
	canvasEl = document.getElementById('canvas');
	if (typeof(G_vmlCanvasManager) != 'undefined')
	canvasEl = G_vmlCanvasManager.initElement(canvasEl);
}
function initBox(){
	$('#boxes').masonry({
	columnWidth: 50, 
	itemSelector: '.box'
});
	
//$('#boxes').masonry({ columnWidth: 200 });
}

function initLogo(){
  if (!$('#nav').length) return;
	$("h2.logo span.number").animate({opacity: 0.4}, 3000);
	$("h2.logo span.welcome,#page div.description").animate({color: "#ffffff"}, 3000 );
	initLines();
	setTimeout(function() {
		$("#page ul.images").fadeIn(3000);
	}, 3000); 
}

function initSlider(){
	$('#sidebar div.slides').cycle({
		fx:'fade',
		speed:500,
		timeout:4000
	});
	$('#main div.container div.slides-image').cycle({
		fx:'fade',
		speed:2000,
		timeout:2000
	});
};

function initTabs(){
	$("#main:not(.inner #main)").tabs({fx: { opacity: 'toggle' }});
}
function initParagraph(){
	$('#main div.container div.text p:even').addClass('even');
}

	var dx,dy;
	var x =new Array();
	var y =new Array();
	var interval=new Array();

	
	
	var lines = [{'color':'#a2c6dc','x0':373,'y0':230,'xend':490,'yend':165,'text_sel':'#nav li.item7', msie: 50}, 
	{'color':'#a2c6dc','x0':358.5,'y0':213,'xend':410,'yend':133,'text_sel':'#nav li.item6', msie: 30}, 
	{'color':'#a2c6dc','x0':334,'y0':212,'xend':367,'yend':70,'text_sel':'#nav li.item5', msie: 40}, 
	{'color':'#a2c6dc','x0':303,'y0':226,'xend':303,'yend':17,'text_sel':'#nav li.item4', msie: 30}, 
	{'color':'#a2c6dc','x0':275,'y0':212,'xend':233,'yend':70,'text_sel':'#nav li.item3', msie: 30}, 
	{'color':'#a2c6dc','x0':256,'y0':215,'xend':190,'yend':133,'text_sel':'#nav li.item2', msie: 20}, 
	{'color':'#a2c6dc','x0':247,'y0':231,'xend':120,'yend':165,'text_sel':'#nav li.item1', msie: 20}];
	var line_index = 0;		
	var line_segments = 200;
	//if( $.browser.msie ) line_segments = 20;
	
	
	function initLines(){
		for(line_index=0;line_index < lines.length;line_index++){
			animateLine(lines[line_index].color,lines[line_index].x0,lines[line_index].y0,lines[line_index].xend,lines[line_index].yend,line_index);
		}
		
	}
	
	function animateLine(color,x0,y0,xend,yend,line_index){
		x[line_index] = x0;
		y[line_index] = y0;
		interval[line_index] = setInterval(function(){drawLine(color,x0,y0,xend,yend,line_index);}, 3);

	}
	
	function drawLine(color,x0,y0,xend,yend,line_index) {
		var ctx = canvasEl.getContext('2d');
		
		// calculate dx/dy
		var _linesegm = line_segments;
		if( $.browser.msie ) _linesegm = lines[line_index].msie;
			
		dx = (xend - x0) / _linesegm;
		dy = (yend - y0) / _linesegm;
		
		// remove previous line
		ctx.beginPath();
		ctx.lineWidth = 1; 
		ctx.strokeStyle = "#5898bc";
		ctx.fillStyle = "#5898bc";
		ctx.moveTo(x0,y0);	
		ctx.lineTo(x[line_index], y[line_index]);
		ctx.stroke();
		//ctx.save();
		ctx.closePath();
		
		// remove rect
		ctx.beginPath();
		ctx.strokeStyle = "#5898bc";
		ctx.fillStyle = "#5898bc";
		ctx.fillRect(x[line_index]-4.5, y[line_index]-4.5, 9, 9);
		//ctx.save();
		ctx.closePath();
		
		// increase new coordinates
		y[line_index] = y[line_index] + dy;
		x[line_index] = x[line_index] + dx;
		
		if( (xend > x0 && x[line_index] > xend) || (xend < x0 && x[line_index] < xend) ) x[line_index] = xend;
		if( (yend > y0 && y[line_index] > yend) || (yend < y0 && y[line_index] < yend) ) y[line_index] = yend;

		// draw new line
		//ctx.restore();
		ctx.beginPath();
		ctx.lineWidth = 1; 
		ctx.strokeStyle = color;
		ctx.fillStyle = color;
		ctx.moveTo(x0,y0);	
		ctx.lineTo(x[line_index], y[line_index]);
		ctx.stroke();
		//ctx.save();
		ctx.closePath();
		
		// draw rect
		//ctx.restore();
		ctx.beginPath();
		ctx.fillRect(x[line_index]-4, y[line_index]-4, 8, 8);
		ctx.save();
		ctx.closePath();
		
		// fade text, run next line
		if(y[line_index] <= yend){
			clearInterval(interval[line_index]);
			$(lines[line_index].text_sel).fadeIn(500);

			/*if(line_index < lines.length-1){
				line_index++;
				animateLine(lines[line_index].color,lines[line_index].x0,lines[line_index].y0,lines[line_index].xend,lines[line_index].yend);
			}*/
		}
		
	}
	
function howerLine(line_index,color){
		var ctx = canvasEl.getContext('2d');
		
		var l = lines[line_index];
		
		// remove line
		ctx.beginPath();
		ctx.lineWidth = 3; 
		ctx.strokeStyle = "#5898bc";
		ctx.fillStyle = "#5898bc";
		ctx.moveTo(l.x0, l.y0);	
		ctx.lineTo(l.xend, l.yend);
		ctx.stroke();
		//ctx.save();
		ctx.closePath();
		
		// remove rect
		ctx.beginPath();
		ctx.strokeStyle = "#5898bc";
		ctx.fillStyle = "#5898bc";
		ctx.fillRect(l.xend-4.5, l.yend-4.5, 9, 9);
		//ctx.save();
		ctx.closePath();
		
		// show line
		//ctx.restore();
		ctx.beginPath();
		ctx.lineWidth = 2; 
		ctx.strokeStyle = color;
		ctx.fillStyle = color;
		ctx.moveTo(l.x0, l.y0);	
		ctx.lineTo(l.xend, l.yend);
		ctx.stroke();
		//ctx.save();
		ctx.closePath();
		
		// show rect
		ctx.beginPath();
		ctx.strokeStyle = color;
		ctx.fillStyle = color;
		ctx.fillRect(l.xend-4, l.yend-4, 8, 8);
		ctx.save();
		ctx.closePath();
	}

function initScroll(){
	$('#main div.text,#boxes,#main div.studies').jScrollPane({
		showArrows: true
	});
}