function expand(box) {
	if (!expanded) {
		expanded = true;
		fadeOut("box"+(box+1)%3, .5);
		fadeOut("box"+(box+2)%3, .5);
		$('box'+box).align = "left";
		scale('box'+box, .5, 514, 288);
		fadeOut('title'+box, .5);
		moveBy('box'+box, box*-260, 0);
		moveFooter(435);
		fadeOut('contentFooter', .2);
		setTimeout("$('title"+box+"').style.display = 'none';", 500);
		setTimeout("fadeIn('content"+box+"sub0', .5)", 500);
		// need to load seperate sub boxes for each area
		setTimeout("fadeIn('box"+box+"sub0', .5)", 500);
		setTimeout("fadeIn('box"+box+"sub1', .5)", 700);
		setTimeout("fadeIn('box"+box+"sub2', .5)", 900);
	}
}

function subhide(main) {
	for (var i=0; $('box'+main+'sub'+i) != null; i++) {
		$('box'+main+'sub'+i).className = 'subbox';
		$('content'+main+'sub'+i).style.display = 'none';
	}
}

function subexpand(main, sub) {
	subhide(main);
	$('box'+main+'sub'+sub).className = 'subboxSelected';
	$('content'+main+'sub'+sub).style.display = 'block';
}

function scale(element, duration, toWidth, toHeight) {
	if (toWidth != null) { // xscale
		// get original x value, take off any non-numeric characters
		fromWidth =$(element).style.width;
		fromWidth = fromWidth.replace("px", "");
		xscale = (toWidth/fromWidth)*100;
		new Effect.Scale(element, xscale, { scaleY:false, scaleContent:false, duration: duration, scaleMode: { originalWidth: fromWidth } } );
	}
	if (toHeight != null) { // yscale
		fromHeight =$(element).style.height;
		fromHeight = fromHeight.replace("px", "");
		yscale = (toHeight/fromHeight)*100;
		new Effect.Scale(element, yscale, { scaleX:false, scaleContent:false, duration: duration, scaleMode: { originalHeight: fromHeight } } );
	}
}

function moveFooter(top) {
	curY =$('footerLeft').style.top;
	curY = curY.replace("px", "");
	moveY = top-curY;
	scale('contentback', .5, null, top-145);
	moveBy('footerLeft', 0, moveY);
	moveBy('footerRight', 0, moveY);
	moveBy('footerLineTop', 0, moveY);
	moveBy('footerLineBottom', 0, moveY);
}

function fadeIn(element, duration) {
	setOpacity(element, 0);
	$(element).style.display = 'block';
	new Effect.Opacity(element,
	{ duration: duration,
	  transition: Effect.Transitions.linear,
	  from: 0, to: 1.0 });	
}

function fadeOut(element, duration) {
	new Effect.Opacity(element,
	{ duration: duration,
	  transition: Effect.Transitions.linear,
	  from: 1.0, to: 0 });
	setTimeout("$('"+element+"').style.display='none';", duration*1000);
}

function move(element, toX, toY) {
	if (toX != null) {
		fromX =$(element).style.left;
		fromX = fromX.replace("px", "");
		moveX = toX-fromX;
	} else
		moveX = 0;
	if (toY != null) {
		fromY =$(element).style.top;
		fromY = fromY.replace("px", "");
		moveY = toY-fromY;
	}
	moveBy(element, moveX, moveY);
}

function moveBy(element, moveX, moveY) {
	new Effect.MoveBy(element,
	 moveY, moveX,
	 { duration: .5 }
	);
}

function setOpacity(element, value) {
  element= $(element);
  if (value == 0)
	element.style.display = 'none';
  else
	element.style.display = 'block';

  if (element) {
	  if (value == 1){
		element.setStyle({ opacity:
		  (/Gecko/.test(navigator.userAgent) && !/Konqueror|Safari|KHTML/.test(navigator.userAgent)) ?
		  0.999999 : 1.0 });
		if(/MSIE/.test(navigator.userAgent) && !window.opera)
		  element.setStyle({filter: Element.getStyle(element,'filter').replace(/alpha\([^\)]*\)/gi,'')});
	  } else {
		if(value < 0.00001) value = 0;
		element.setStyle({opacity: value});
		if(/MSIE/.test(navigator.userAgent) && !window.opera)
		  element.setStyle(
			{ filter: element.getStyle('filter').replace(/alpha\([^\)]*\)/gi,'') +
				'alpha(opacity='+value*100+')' });
	  }
  }
  return element;
}

expanded = false;
function collapse(box) {
	if (expanded) {
		expanded = false;
		fadeOut('box'+box+'sub2', .5);
		setTimeout("fadeOut('box"+box+"sub1', .5)", 100);
		setTimeout("fadeOut('box"+box+"sub0', .5)", 200);
		fadeOut('content'+box+"sub0", .5);
		fadeOut('content'+box+"sub1", .5);
		fadeOut('content'+box+"sub2", .5);
		setTimeout("scale('box"+box+"', .5, 255, 94);", 500);
		setTimeout("moveBy('box"+box+"', "+(box*260)+", 0);", 500);
		setTimeout("moveFooter(315);", 500);
		setTimeout("$('box"+box+"sub0').style.display = 'none';", 1000);
		setTimeout("$('box"+box+"sub1').style.display = 'none';", 1000);
		setTimeout("$('box"+box+"sub2').style.display = 'none';", 1000);
		setTimeout("fadeIn('box"+(box+2)%3+"', .5);", 1000);
		setTimeout("fadeIn('box"+(box+1)%3+"', .5);", 1000);
		setTimeout("fadeIn('title"+box+"', .5)", 500);
		setTimeout("fadeIn('contentFooter', .2);", 1000);
	}
}

function loadPage(page) {
	refreshMenu(page);
	fadeCurrent();
	/*fadeOut('box0');
	fadeOut('box1');
	fadeOut('box2');
	fadeOut('contentFooter', .2);*/
	//setTimeout("setOpacity('content', 0);", 900);
	//if ($('content').style.display == 'none');
	//	setTimeout("fadeIn('content', .2);", 900);
	//setTimeout("new Effect.Opacity('content', { duration: .2, transition: Effect.Transitions.linear, from: 0, to: 1 });", 900);
	setTimeout("loadContent('"+page+"');", 1100);
}

function fadeCurrent() {
	expanded = false;
	/*divs = $('page').childNodes;
	for(i=0; i<divs.length; i++) {
		alert(divs[i]+":"+divs[i].id);
	}*/
	if ($('home').style.display != 'none') {
		fadeOut('home', .4);
		fadeOut('contentFooter', .4);
		setTimeout("fadeIn('content', .2);", 400);
	} else {
		fadeOut('contentText', .2);
		setTimeout("scale('content', .5, 255, 94);", 200);
		if ($('content').style.left != "260px")
			setTimeout("moveBy('content', 260, null);", 200);
		setTimeout("fadeIn('contentLoading', .2);", 700);
	}
	setTimeout("moveFooter(241);", 200);
	//setTimeout("$('content').style.width = 255;", 400);
	//setTimeout("$('content').style.height = 94;", 400);
	//setTimeout("$('content').style.left = 260;", 400);
}

function refreshMenu(page) {
	params = "Selected="+page;
	var ajax = new Ajax.Updater(
		"menu",
		"/menu.php",
		{
			parameters: params
		}
	);
}

function showHome() {
	fadeCurrent();
	refreshMenu('home');
	setTimeout("fadeOut('content', .4);", 900);
	setTimeout("fadeIn('home', .4);", 900);
	resetBox(0);
	resetBox(1);
	resetBox(2);
	//setTimeout("fadeIn('box1', .4);", 900);
	//setTimeout("fadeIn('box2', .4);", 900);
	setTimeout("fadeIn('contentFooter', .4);", 900);
	setTimeout("moveFooter(315)", 900);
}

function register() {
	params = "action=Register&Username="+$F('Username')+"&Password="+$F('Password')+"&Subdomain="+$F('Subdomain')+"&FirstName="+$F('FirstName')+"&LastName="+$F('LastName')+"&Email="+$F('Email')+"&Street1="+$F('Street1')+"&Street2="+$F('Street2')+"&City="+$F('City')+"&State="+$F('State')+"&Zip="+$F('Zip');
	if ($('Agree').checked)
		params += "&Agree=1";
	//alert(params);
	var ajax = new Ajax.Updater(
		"content0sub2",
		"/register.php",
		{
			method: 'post',
			parameters: params
		}
	);
}

function resetBox(box) {
	setOpacity('box'+box, 100);
	setOpacity('box'+box+"sub0", 0);
	setOpacity('box'+box+"sub1", 0);
	setOpacity('box'+box+"sub2", 0);
	setOpacity('title'+box, 100);
	setOpacity('content'+box, 0);
	$('box'+box).style.width = 255;
	$('box'+box).style.height = 94;
	$('box'+box).style.left = 260*box;
}

function loadContent(page) {
	var ajax = new Ajax.Request(
		"/"+page+"/index.php",
		{
			onComplete: function(request) {
				$('contentText').innerHTML = request.responseText;
				showPage();
			}
		}
	);
}

function showLogin() {
	fadeCurrent();
	var ajax = new Ajax.Request(
		"/login.php",
		{
			onComplete: function(request) {
				$('contentText').innerHTML = request.responseText;
				setTimeout("scale('content', .5, null, 120);", 900);
				setTimeout("moveFooter(268);", 900);
				setTimeout("fadeOut('contentLoading', .4);", 900);
				setTimeout("fadeIn('contentText', .4);", 1300);
				setTimeout("$('Username').focus();", 1700);
			}
		}
	);
}

function showPage() {
	// reset box
	//$('content').style.left = "260px";
	scale('content', .5, 775, 448);
	moveBy('content', -260, null);
	//scale('contentback', .5, null, 450);
	moveFooter(595);
	setTimeout("fadeOut('contentLoading', .2);", 200);
	setOpacity('contentText', 0);
	setTimeout("fadeIn('contentText', .4);", 400);
}

function showMemberPage() {
	scale('content', .5, 775, 423);
	moveBy('content', -260, 25);
	moveFooter(595);
	setTimeout("fadeOut('contentLoading', .2);", 200);
	setOpacity('contentText', 0);
	setTimeout("fadeIn('contentText', .4);", 400);
	setTimeout("fadeIn('contentTabs', .4);", 400);
}

// keep track of current visible items in an array (push and pop) and then be able to fade just the current content.