var emailPage;
var emailPageInside;
var emailPageForm;
var emailPageLink;
var emailPageClose;
var formThanksLayer;

var formUnMasked = [0,635,569,0];
var formMasked = [0,635,0,0];
var unMaskAni;
var maskAni;
var formOuterAni;
var formInnerAni;
var formAni;
var thanksAni;
var linkOverAni;
var linkOutAni;
var innerDim;
var fieldLabelAni;
var fieldAni;
var formErrorAni;
var thanksAni;
var imageFadeTimer;
var leftImageFadeCount = 0;
var rightImageFadeCount = 0;
var leftLoadedImages = [];
var rightLoadedImages = [];
var leftFadeImageAni;
var rightFadeImageAni;
var leftLoadFlag = false;
var rightLoadFlag = false;

var path = '/assets/'; 

var leftImages = [
    path + 'stores1.jpg',
    path + 'stores2.jpg',
    path + 'stores3.jpg '
];

var rightImages = [
    path + '2008toronto.gif',
    path + '2009calgary.gif',
    path + '2010squareOne.gif'
];

function imgProgress(i, obj, imgHolder){
	obj.setStyles({
		'position': 'absolute',
		'opacity': 0
	});
	imgHolder[i] = obj;
}

function fadeImages() {
	var leftImage = leftLoadedImages[leftImageFadeCount];
	leftImage.setStyle('opacity', 0);
	leftImage.inject($('leftGallery'));
	leftFadeImageAni = new Fx.Styles(leftImage, {duration:1000, wait:false});
	leftFadeImageAni.start({'opacity': 1});
	
	var rightImage = rightLoadedImages[rightImageFadeCount];
	rightImage.setStyle('opacity', 0);
	rightImage.injectInside($('rightGallery'));
	rightFadeImageAni = new Fx.Styles(rightImage, {duration:1000, wait:false});
	rightFadeImageAni.start({'opacity': 1});
	
	
	if((rightImageFadeCount) == (rightLoadedImages.length - 1)){
		rightImageFadeCount = 0;
	}
	else{
		rightImageFadeCount++;
	}
	
	if((leftImageFadeCount) == (leftLoadedImages.length - 1)){
		leftImageFadeCount = 0;
	}
	else{
		leftImageFadeCount++;
	}
}

function submitEmailPageForm(e){
	new Event(e).stop();
	$('ePageForm').send({evalScripts:true});
}


function formThanks(){
	formOuterAni = new Fx.Styles(emailPage, {duration:500, wait:false});
	formInnerAni = new Fx.Styles(emailPageInside, {duration:500, wait:false});
	thanksAni = new Fx.Styles(formThanksLayer, {duration:500, wait:false});
	formAni = new Fx.Styles(emailPageForm, {duration:250, wait:false, onComplete: function(){
		emailPageForm.setStyle('display','none');
		formThanksLayer.setStyles({'visibility':'visible', 'display':'block'});
		thanksAni.start({'opacity': 1});
	}});
	
	formAni.start({'opacity': 0});
	//formOuterAni.start({'height':'125px'});
	formInnerAni.start({'height':'95px'});
}

function openMask(detail, mask){
	unMaskAni = detail.effect('clip', {duration: 500, transition: Fx.Transitions.Quad.easeInOut});	
	unMaskAni.start(mask);
}

function closeMask(detail, mask){		
	maskAni = detail.effect('clip', {duration: 500, transition: Fx.Transitions.Quad.easeInOut});
	maskAni.start(mask);
}

function onWindowResize(){
	
	//emailPage = $('emailPage');
	//emailPageInside = $('emailPageInside');
	//emailPageForm = $('emailPageForm');
	//emailPageLink = $('emailPageLink');
	//emailPageClose = $('emailPageClose');
	//formThanksLayer = $('formThanksLayer');
	mainDim = main.getCoordinates();
//	signUpDim = signUp.getCoordinates();
	//innerDim = emailPageInside.getCoordinates();
	
	//emailPage.setStyle('left', mainDim.left + mainDim.width - emailPage.getCoordinates().width);
	//emailPage.setStyle('top', mainDim.top + 102);
	//emailPage.setStyle('visibility', 'visible');
	
	/*
	emailPageLink.setStyle('left', mainDim.left + mainDim.width - emailPageLink.getCoordinates().width - 10);
	emailPageLink.setStyle('top', mainDim.top + 45);
	emailPageLink.setStyle('visibility', 'visible');
	
	emailPageLink.addEvent('mouseenter', function(){
		linkOverAni = new Fx.Styles(this, {duration:200, wait:false});
		linkOverAni.start({'color': '#1c7ec5'});
	});
	emailPageLink.addEvent('mouseleave', function(){
		linkOverAni = new Fx.Styles(this, {duration:200, wait:false});
		linkOverAni.start({'color': '#666666'});
	});
	emailPageLink.addEvent('click', function(){
		formThanksLayer.setStyles({'visibility':'hidden', 'display':'none'});
		emailPageForm.setStyle('display','block');
		emailPage.setStyles({'visibility':'visible'});
		emailPageInside.setStyles({'height':innerDim.height});
		emailPageForm.setStyle('opacity', 1);
		openMask(emailPage, formUnMasked);
	});
	
	emailPageClose.addEvent('click', function(){
		closeMask(emailPage, formMasked);
	});
	
	$('ePageForm').addEvent('submit', submitEmailPageForm);
	*/
		
	reposRem();
//	reposEmailThanks();
	initSubNav(mainDim);
	
}

function allLoaded(){
	if(leftLoadFlag && rightLoadFlag){
		startFade();
	}
}

function leftImagesLoaded(){
	leftLoadFlag = true;
	allLoaded();
}

function rightImagesLoaded(){
	rightLoadFlag = true;
	allLoaded();
}

function startFade(){
	fadeImages();
	imageFadeTimer = fadeImages.periodical(6000);
}

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

window.addEvent('load', function() {
	
	initCommon();
	onWindowResize();
	//initializeMask(emailPage, formMasked, formUnMasked);
	
	var lg = $('leftGallery');
	
	//alert(lg);
	
	if(lg != null){
		new Asset.images(leftImages, {onComplete: leftImagesLoaded, onProgress: function(i){imgProgress(i, this, leftLoadedImages)}});
		new Asset.images(rightImages, {onComplete: rightImagesLoaded, onProgress: function(i){imgProgress(i, this, rightLoadedImages)}});
	}
	
// end window load
});