var photo1Det;
var photoHotSpot1;
var photoButton1;
var photoText1;

var currOpen = "photo1";

var theMask;
var unMaskAni;

var photo1UnMasked = [0,950,286,0];
var photo1Masked = [0,950,286,950];

var photo2UnMasked = [0,950,286,0];
var photo2Masked = [0,0,286,0];

var photo3UnMasked = [0,950,286,0];
var photo3Masked = [0,950,286,950];

var photoBorder1;
var photoBorder2;
var photoBorder3;
var photoCloseBtn1;
var photoCloseBtn2;
var photoCloseBtn3;
var photo1Det;
var photo2Det;
var photo3Det;
var photoHotSpot2;
var photoHotSpot3;
var photoButton2;
var photoButton3;
var photoText2;
var photoText3;



function closeMask(maskName){		
	var detail = eval(currOpen + "Det");
	var mask = eval(currOpen + "Masked");
	
	theMask = detail.effect('clip', {duration: 500, transition: Fx.Transitions.Quad.easeInOut, onComplete: function(){detail.setStyle('visibility', 'hidden');}});
	theMask.start(mask);
}

function openMask(detail, mask, outFunc, detailW, detailH){
	unMaskAni = detail.effect('clip', {duration: 500, transition: Fx.Transitions.Quad.easeInOut});
	
	eval(outFunc);
	
	if(window.ie6){
		detail.setStyle('width', detailW);
		detail.setStyle('height', detailH);
	}
	
	detail.setStyle('opacity', 1);
	detail.setStyle('visibility', 'visible');
	
	unMaskAni.start(mask);
}

function placeText(txt, dim, x, y){
	txt.setStyle('left', dim.left + x);
	txt.setStyle('top', dim.top + y);
	txt.setStyle('opacity', 0);
	txt.setStyle('visibility', 'visible');
}

function rollOver(imgID, imgName)
{
	if (navigator.appName== "Netscape" && parseInt(navigator.appVersion) >= 3)
		document.images[imgID].src = "/assets/" + imgName;
	else if (navigator.appName != "Netscape" && parseInt(navigator.appVersion) >= 4) 
		document.images[imgID].src = "/assets/" + imgName;
}

function buttonOver1(){
	buttonOver(photoHotSpot1, photoText1, photoBorder1, false, 10, true);
}

function buttonOut1(){
	buttonOut(photoHotSpot1, photoText1, photoBorder1, false, true);
}

function buttonOver2(){
	buttonOver(photoHotSpot2, photoText2, photoBorder2, false, 10, true);
}

function buttonOut2(){
	buttonOut(photoHotSpot2, photoText2, photoBorder2, false, true);
}

function buttonOver3(){
	buttonOver(photoHotSpot3, photoText3, photoBorder3, false, 10, true);
}

function buttonOut3(){
	buttonOut(photoHotSpot3, photoText3, photoBorder3, false, true);
}


function onWindowResize(){
	
	mainDim = main.getCoordinates();
	//signUpDim = signUp.getCoordinates();
	photoDim1 = photoHotSpot1.getCoordinates();
	photoDim2 = photoHotSpot2.getCoordinates();
	photoDim3 = photoHotSpot3.getCoordinates();
	
	initButton(photoButton1, photoDim1);
	initBorder(photoBorder1, photoDim1);
	placeText(photoText1, photoDim1, 624, 1);
	
	initButton(photoButton2, photoDim2);
	initBorder(photoBorder2, photoDim2);
	placeText(photoText2, photoDim2, 1, 1);
	
	initButton(photoButton3, photoDim3);
	initBorder(photoBorder3, photoDim3);
	placeText(photoText3, photoDim3, 624, 0);
	
	if(window.ie){
		initDet(photo3Det, photoDim3, 1, 1);
		initDet(photo2Det, photoDim2, 1, 1);
		initDet(photo1Det, photoDim1, 1, 1);
	}
	else{
		initDet(photo3Det, photoDim3, 1, 1);
		initDet(photo2Det, photoDim2, 1, 1);
		initDet(photo1Det, photoDim1, 1, 1);
	}
	
		
	reposRem();
//	reposEmailThanks();
	initSubNav(mainDim);
	
}

window.addEvent('resize', function(){
	onWindowResize();
});

window.addEvent('load', function() {
	photo1Det = $('photo1Det');
	photoHotSpot1 = $('photoHotSpot1');
	photoButton1 = $('photoButton1');
	photoBorder1 = $('photoBorder1');
	photoText1 = $('photoText1');
	photoCloseBtn1 = $('photoCloseBtn1');
	
	photo2Det = $('photo2Det');
	photoHotSpot2 = $('photoHotSpot2');
	photoButton2 = $('photoButton2');
	photoBorder2 = $('photoBorder2');
	photoText2 = $('photoText2');
	photoCloseBtn2 = $('photoCloseBtn2');
	
	photo3Det = $('photo3Det');
	photoHotSpot3 = $('photoHotSpot3');
	photoButton3 = $('photoButton3');
	photoBorder3 = $('photoBorder3');
	photoText3 = $('photoText3');
	photoCloseBtn3 = $('photoCloseBtn3');
	
	photoButton1.addEvent('mouseenter', buttonOver1);
	photoButton1.addEvent('mouseleave', buttonOut1);
	photoCloseBtn1.addEvent('click', function(){closeMask("photo1");});
	photoButton1.addEvent('click', function(){
		if("photo1" != currOpen){
			closeMask(currOpen);
		}
		currOpen = "photo1";
		openMask(photo1Det, photo1UnMasked, 'buttonOut1()', '633px', '286px');
	});
	
	photoButton2.addEvent('mouseenter', buttonOver2);
	photoButton2.addEvent('mouseleave', buttonOut2);
	photoCloseBtn2.addEvent('click', function(){closeMask("photo2");});
	photoButton2.addEvent('click', function(){
		if("photo2" != currOpen){
			closeMask(currOpen);
		}
		currOpen = "photo2";
		openMask(photo2Det, photo2UnMasked, 'buttonOut2()', '633px', '286px');
	});
	
	photoButton3.addEvent('mouseenter', buttonOver3);
	photoButton3.addEvent('mouseleave', buttonOut3);
	photoCloseBtn3.addEvent('click', function(){closeMask("photo3");});
	photoButton3.addEvent('click', function(){
		if("photo3" != currOpen){
			closeMask(currOpen);
		}
		currOpen = "photo3";
		openMask(photo3Det, photo3UnMasked, 'buttonOut3()', '633px', '286px');
	});
	
	$('photo1Det').addEvent('click', function(){closeMask("photo1");});
	$('photo2Det').addEvent('click', function(){closeMask("photo2");});
	$('photo3Det').addEvent('click', function(){closeMask("photo3");});
	
	initializeMask(photo1Det, photo1Masked, photo1UnMasked);
	initializeMask(photo2Det, photo2Masked, photo2UnMasked);
	initializeMask(photo3Det, photo3Masked, photo3UnMasked);
	
	initCommon("about");
	$$('.subNav')[1].addClass('selected');  //replaced with Mootool equivalent, Prototype approach conflicted
	onWindowResize();
// end window load
});