var context;
var i_width;
var i_height;
var x_mouse;
var y_mouse;
var x_offset=0;
var y_offset=0;
var x_onew=0;
var y_onew=0;
var x_diff=0;
var y_diff=0;
var COLOR="#e3001b";
var PROXIMITY=75;
var SCALE_FACTOR=3;
var LOGO_X=-6;
var LOGO_Y=589;
var delay=0;
var ldelay=0;
var logoBalls=new Array();
var spires=new Array(spire1,spire2,spire3,spire4,spire5);
var introObj;
var introDone=false;
var capture={x:0,y:0};

function initBalls() {
	for(i in logo) {
		logo[i].reverse();
	}
	// Various rules reguarding the direction that the balls animate in
	if(page==2)spire1.reverse();
	spire2.reverse();
	if(page!=0)spire3.reverse();
	if(page==3){
		spire4.reverse();
		introDone=true;
	}else{
		introObj=getLocation(window.location.hash,true);
		introObj.x=LOGO_X;
		introObj.y=LOGO_Y;
		introObj.a=0;
		introObj.r=1;
	}
	if(page==2)spire5.reverse();
	
	context=$("#canvas")[0].getContext('2d');
	
	// Set various properties for animation
	for(j in spires) {
		setBallAlpha(spires[j],true);
		setBalls(spires[j],true);
	}
	for(k in logo) setBallAlpha(logo[k]);
	setLogoBalls(logo[page]);
	setBalls(logoBalls);
	
	setInterval(renderBalls,33);
}

function setBallAlpha(set,spire) {
	for(i in set) {
		var b=set[i];
		if(spire){
			// If balls in the spire are within the bounds of the page content boxes
			// set the alpha to .55,else set to 1
			var xbox=((b.x-b.r>220&&b.x+b.r<1076)||(b.x-b.r>1238&&b.x+b.r<2094)||(b.x-b.r>2258&&b.x+b.r<3116)) ? true : false;
			var ybox=((b.y-b.r>220&&b.y+b.r<708)||(b.y-b.r>990&&b.y+b.r<1470)) ? true : false;
			if(xbox&&ybox)b.a=.10;
			else b.a=.90;
		}else{
			// Logo balls are calcutated relative to the window,vs. relative to the content position
			if((b.x>-430&&b.x<430)&&(b.y>56&&b.y<540)&&(i!=(set.length-1)))b.a=.10;
			else b.a=1;
		}
	}
}

function setBalls(set,spire) {
	for(i in set) {
		var b=set[i];
		// Calculate radius delta to create a "pulse" effect
		b.d=(b.r/400)+Math.floor((Math.random()*50)/100);
		// Calculate radius offest (maximum radius a pulse can reach)
		b.o=(Math.floor((b.r/6)*10)/50)+(Math.floor(Math.random()*10)/10);
		// Calculate starting current radius (init to 1/4 the size of the target radius)
		b.rad=b.r/4;
		// Calculate starting current alpha (init to 0)
		b.alp=0;
		// Calculate current wiggle along the x-axis (init to target x)
		b.wx=b.x;
		// Calculate wiggle x offset
		b.wxo=Math.random()*5;
		// Calculate wiggle x delta to create a "wiggle" effect
		b.wxd=.09-((Math.random()*8)/100);
		// Calculate current wiggle along the y-axis (init to target y)
		b.wy=b.y;
		// Calculate wiggle y offset
		b.wyo=Math.random()*3;
		// Calculate wiggle y delta to create a "wiggle" effect
		b.wyd=.09-((Math.random()*8)/100);
		// Set intro state to false until each ball has animated in
		b.intro=false;
	}
}

function setLogoBalls(s) {
	logoBalls=new Array();
	for(i in s) {
		// Set initial animation point for logo balls
		var initObj;
		if(i==(s.length-1)){
			var initObjx=-(LOGO_X+Number($("#mainContent").css("left").replace('px',''))+OFFSET_X);
			var initObjy=-(Number($("#mainContent").css("top").replace('px',''))+OFFSET_Y)+LOGO_Y;
			initObj={x:initObjx,y:initObjy,r:3,a:0};
		}
		else initObj={x:LOGO_X,y:LOGO_Y,r:3,a:0};
		logoBalls.push(initObj);
	}
	ldelay=0;
}

function renderBalls(a) {
	context.clearRect(0,0,$("#canvas").attr("width"),$("#canvas").attr("height"));
	x_onew=Number($("#mainContent").css("left").replace('px',''))+OFFSET_X;
	y_onew=Number($("#mainContent").css("top").replace('px',''))+OFFSET_Y;
	x_diff=(x_offset-x_onew);
	y_diff=(y_offset-y_onew);
	if(x_offset==0||y_offset==0){
		x_diff=0;
		y_diff=0;
	}
	x_offset=Number($("#mainContent").css("left").replace('px',''))+OFFSET_X;
	y_offset=Number($("#mainContent").css("top").replace('px',''))+OFFSET_Y;
	for(i in spires) {
		renderSpire(spires[i]);
	}
	renderLogo();
}

function renderSpire(s) {
	for(i in s) {
		var b=s[i];
		b.wx=b.wx+(x_diff*(Math.random()*10))+(y_diff*((Math.random()*10)-5));
		b.wy=b.wy+(y_diff*(Math.random()*5))+(x_diff*((Math.random()*4)-2));
		b.pRad+=(x_diff*10)+(y_diff*20);
		var pX=((i_width/2)+(b.wx+x_offset));
		var pY=(b.wy+y_offset);
		var prox=getProximity((i_width/2)+(b.wx+x_offset),b.wy+y_offset);
		var pRad;
		// IF the mouse is within proximity of orb,scale the orb up by a factor of 1/SCALE_FACTOR the set radius times a percentage of the proximity boundry
		if(prox<PROXIMITY)
			pRad=b.rad+(SCALE_FACTOR * Math.abs((prox-PROXIMITY) / PROXIMITY));
		else
			pRad=b.rad;
		if((pX>(0-pRad)&&pX<(i_width+pRad))&&(pY>0&&pY<i_height)){
			drawBall(b.alp,pX,pY,pRad);
		}
			
		if(b.intro){
			if(b.rad>=(b.r+b.o)||(b.rad<=(b.r-(b.o/4))||b.rad<=1))b.d=-b.d;
			b.rad+=b.d;
			// Adjust value for x
			if(b.wx>(b.x+b.wxo))b.wxd=-Math.abs(b.wxd);
			else if(b.wx<(b.x-b.wxo))b.wxd=Math.abs(b.wxd);
			if(b.wx>(b.x+(b.wxo*2))||b.wx<(b.x-(b.wxo*2)))b.wx+=(b.wxd * Math.abs((b.wx-(b.x))*15));
			else b.wx+=b.wxd;
			// Adjust value for y
			if(b.wy>(b.y+b.wyo))b.wyd=-Math.abs(b.wxd);
			else if(b.wy<(b.y-b.wyo))b.wyd=Math.abs(b.wyd);
			if(b.wy>(b.y+(b.wyo*2))||b.wy<(b.y-(b.wyo*2)))b.wy+=b.wyd * Math.abs((b.wy-(b.y))*15);
			else b.wy+=b.wyd;
		}else{
			if(i<=delay){
				b.rad+=(b.r/16);
				if(b.alp<b.a)b.alp+=.15;
				else b.alp=b.a;
			}
			// If ball has reached it's final position and and alpha
			if(b.rad>=b.r&&b.alp>=b.a){
				b.intro=true;
				b.alp=b.a;
				b.rad=b.r;
			}
		}
	}
	// Only iterate delay if it's within the bounds of the longest array
	if(!introDone||delay<=spire1.length)delay+=2;
}
function renderLogo() {
	for(i in logoBalls) {
		var b=logoBalls[i];
		var pX;
		var pY;
		if(i==(logoBalls.length-1)){
			b.wx=b.wx+(x_diff*(Math.random()*800))+(y_diff*((Math.random()*10)-5));
			b.wy=b.wy+(y_diff*(Math.random()*800))+(x_diff*((Math.random()*4)-2));
			pX=((i_width/2)+(b.wx+x_offset));
			pY=(b.wy+y_offset);
		}else{
			pX=(i_width/2)+(b.wx);
			pY=b.wy;
		}
		var prox;
		if(i==(logoBalls.length-1))prox=getProximity((i_width/2)+(b.wx+x_offset),b.wy+y_offset);
		else prox=getProximity((i_width/2)+(b.wx),b.wy);
		var pRad;
		// IF the mouse is within proximity of orb,scale the orb up by a factor of 1/SCALE_FACTOR the set radius times a percentage of the proximity boundry
		if(prox<PROXIMITY)
			pRad=b.r+(SCALE_FACTOR * Math.abs((prox-PROXIMITY) / PROXIMITY));
		else
			pRad=b.r;
		drawBall(b.a,pX,pY,pRad);
		
		if(b.intro){
			if(b.r>(logo[page][i].r+b.o)||(b.r<(logo[page][i].r-(b.o/4))||b.r<=1))b.d=-b.d;
			b.r-=b.d;
			if(b.wx>(logo[page][i].x+b.wxo)||b.wx<(logo[page][i].x-b.wxo))b.wxd=-b.wxd;
			if(i==(logoBalls.length-1)&&(b.wx>(logo[page][i].x+(b.wxo*2))||b.wx<(logo[page][i].x-(b.wxo*2))))b.wx+=(b.wxd * Math.abs((b.wx-(b.x))*15));
			else b.wx+=b.wxd;
			if(b.wy>(logo[page][i].y+b.wyo)||b.wy<(logo[page][i].y-b.wyo))b.wyd=-b.wyd;
			b.wy+=b.wyd;
		}else{
			if(i<ldelay){
				b.intro=true;
				if(b.wx<logo[page][i].x){
					b.wx=Math.floor(b.wx);
					b.wx+=(Math.floor(Math.abs(logo[page][i].x-b.wx)/4)+1);
					b.intro=false;
				}
				else if(b.wx>logo[page][i].x){
					b.wx=Math.floor(b.wx);
					b.wx-=(Math.floor(Math.abs(logo[page][i].x-b.wx)/4)+1);
					b.intro=false;
				}
			
				if(b.wy<logo[page][i].y){
					b.wy=Math.floor(b.wy);
					b.wy+=(Math.floor(Math.abs(logo[page][i].y-b.wy)/4)+1);
					b.intro=false;
				}
				else if(b.wy>logo[page][i].y){
					b.wy=Math.floor(b.wy);
					b.wy-=(Math.floor(Math.abs(logo[page][i].y-b.wy)/4)+1);
					b.intro=false;
				}
			
				if(b.a!=logo[page][i].a){
					b.a=logo[page][i].a;
					b.intro=false;
				}
			
				if(b.r<(logo[page][i].r-b.o)){
					b.r=Math.floor(b.r);
					b.r+=1;
					b.intro=false;
				}
				else if(b.r>logo[page][i].r){
					b.r=Math.floor(b.r);
					b.r-=1;
					b.intro=false;
				}
			}
		}
	}
	if(ldelay<logoBalls.length)ldelay++;
}

function drawBall(a,x,y,r) {
	context.beginPath();
	context.fillStyle=COLOR;
	context.globalAlpha=a;
	context.arc(x,y,r,0,Math.PI*2,true);
	context.closePath();
	context.fill();
}

function resetIntro() {
	for(i in logoBalls) logoBalls[i].intro=false;
}

function setMousePos(e) {
	if(IE){
		x=event.clientX+document.body.scrollLeft;
		y=event.clientY+document.body.scrollTop;
	}else{
		x_mouse=e.pageX;
		y_mouse=e.pageY;
	}
	if(x_mouse<0)x_mouse=0;
	if(y_mouse<0)y_mouse=0;
}

// REMOVE: Debug script for laying out balls
function startMouseCapture(e) {
	capture.x=x_mouse;
	capture.y=y_mouse;
}
function getMousePos(e) {
	var mxDrag=75;
	var myDrag=100;
	var newPage=page;
	if((x_mouse-capture.x)>mxDrag){
		if(page!=0&&page!=(pages.length/2)){
			newPage=newPage-1;
		}
	}
	else if((x_mouse-capture.x)<-mxDrag){
		if(page!=(pages.length/2)-1&&page!=pages.length-1){
			newPage=newPage+1;
		}
	}
	if((y_mouse-capture.y)>myDrag){
		if(page>=pages.length/2){
			newPage=newPage-2;
		}
	}
	else if((y_mouse-capture.y)<-myDrag){
		if(newPage<pages.length/2){
			newPage=newPage+2;
		}
	}
	if(page!=newPage){
		window.location.hash=pages[newPage];
		moveContent(450);
	}
}
// REMOVE: Debug script for laying out balls

function getProximity(x,y) {
	var a=Math.abs(x-x_mouse);
	var b=Math.abs(y-y_mouse);
	var c=Math.sqrt((a*a)+(b*b));
	return c;
}

function resizeCanvas() {
	i_width=window.innerWidth;
	i_height=window.innerHeight;
	$("#canvas").attr("width",i_width);
	$("#canvas").attr("height",i_height);
	$("#canvas").attr("style","left:"+(-(i_width/2))+"px;");
}

function adjustBalls(up) {
	for(i in logoBalls) {
		if(i<logoBalls.length-8){
			if(up){
				logoBalls[i].a=logo[3][i].a;
			}else{
				logoBalls[i].a=.15;
			}
		}
	}
}