var furnDim;
var tableDim;
var accDim;
var kitDim;
var fadeImageAni;
var loadedImages;
var copyLoadedImages = [];
var tableLoadedImages = [];
var accLoadedImages = [];
var furnLoadedImages = [];
var kitLoadedImages = [];
var loadedCopyImages = [];
var imageFadeCount = 0;
var imageFadeTimer;

var tableUnMasked = [0,633,286,0];
var tableMasked = [0,316,286,0];

var accUnMasked = [0,633,286,0];
var accMasked = [0,633,286,316];

var furnUnMasked = [0,312,569,0];
var furnMasked = [0,312,286,0];

var kitUnMasked = [0,334,384,0];
var kitMasked = [384,324,384,0];

var copyUnMasked = [0,312,569,0];
var copyMasked = [569,312,569,0];

var unMask;
var tableMask;
var accMask;
var currGallery;
var currOpen = "kit";

var path = '/assets/'; 
var tableImages = [
	path + 'tableani1.jpg',
	path + 'tableani2.jpg',	
	path + 'tableani3.jpg',		
	path + 'tableani4.jpg',
	path + 'tableani5.jpg'
];

var furnImages = [
	path + 'furnani11.jpg',
	path + 'furnani12.jpg',	 
	path + 'furnani13.jpg',
	path + 'furnani14.jpg',
	path + 'furnani15.jpg'
];

var accImages = [
	path + 'accani1.jpg',
	path + 'accani2.jpg', 
	path + 'accani3.jpg',
	path + 'accani4.jpg',
	path + 'accani5.jpg'	
];

var kitImages = [
	path + 'kitani11.jpg',
	path + 'kitani12.jpg', 
	path + 'kitani13.jpg',
	path + 'kitani14.jpg'
];

var furnBorder;
var kitBorder;
var accBorder;
var tableBorder;
var copyBorder;

var furnButton;
var kitButton;
var accButton;
var tableButton;
var copyButton;

var tableGalleryTop;
var accGalleryTop;
var furnGalleryTop;
var kitGalleryTop;
var copyGalleryTop;

var furnText;
var kitText;
var accText;
var tableText;
var copyText;

var furnHotSpot;
var kitHotSpot;
var accHotSpot;
var tableHotSpot;
var copyHotSpot;

var tableDet;
var tableCloseBtn;
var accDet;
var accCloseBtn;
var furnDet;
var furnCloseBtn;
var copyDet;
var copyCloseBtn;
var kitCloseBtn;
var kitDet;

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 copyOver(){
	buttonOver(copyHotSpot, copyText, copyBorder, false, 10);
}

function copyOut(){
	buttonOut(copyHotSpot, copyText, copyBorder);
}

function furnOver(){
	buttonOver(furnHotSpot, furnText, furnBorder, false, 10);
}

function furnOut(){
	buttonOut(furnHotSpot, furnText, furnBorder);
}

function kitOver(){
	buttonOver(kitHotSpot, kitText, kitBorder, true, 10);
}

function kitOut(){
	buttonOut(kitHotSpot, kitText, kitBorder, true);
}

function accOver(){
	buttonOver(accHotSpot, accText, accBorder, false, 10);
}

function accOut(){
	buttonOut(accHotSpot, accText, accBorder);
}

function tableOver(){
	buttonOver(tableHotSpot, tableText, tableBorder, false, 10);
}

function tableOut(){
	buttonOut(tableHotSpot, tableText, tableBorder);
}

function closeMask(maskName, noComplete){
	
	remCloseEvents();
		
	//alert(maskName);	
	var images = eval(maskName + "LoadedImages");
	var detail = eval(maskName + "Det");
	var mask = eval(maskName + "Masked");

	$clear(imageFadeTimer);
	
	if(noComplete){
		tableMask = detail.effect('clip', {duration: 500, transition: Fx.Transitions.Quad.easeInOut});
	}
	else{
		tableMask = detail.effect('clip', {duration: 500, transition: Fx.Transitions.Quad.easeInOut, onComplete: function(){hideImages(detail, images)}});
	}
	kitButton.addEvent('mouseenter', kitOver);
	kitButton.addEvent('mouseleave', kitOut);
	kitButton.addEvent('click', kitOpenMask);
	tableMask.start(mask);
	imageFadeCount = 0;
}

function hideImages(detail, images){
	var imgEffect = detail.effect('opacity', {duration: 500, onComplete: function(){
		detail.setStyle('visibility', 'hidden');
		images.each(function(image, i){
			if(image.parentNode){
				image.remove();
			}
		});
	}
	
	});
	imgEffect.start(0);
}

function kitImagesLoaded(){
	//alert('kit images loaded!');
	kitButton.addEvent('mouseenter', kitOver);
	kitButton.addEvent('mouseleave', kitOut);
	kitCloseBtn.addEvent('click', function(){
		kitButton.addEvent('mouseenter', kitOver);
		kitButton.addEvent('mouseleave', kitOut);
		kitButton.addEvent('click', kitOpenMask);
		closeMask("kit", false);
	});
	kitButton.addEvent('click', kitOpenMask);
}

function tableImagesLoaded(){
	tableButton.addEvent('mouseenter', tableOver);
	tableButton.addEvent('mouseleave', tableOut);
	tableCloseBtn.addEvent('click', function(){closeMask("table", false);});
	tableButton.addEvent('click', function(){
		if("table" != currOpen){
			closeMask(currOpen);
		}
		currOpen = "table"; 
		openMask(tableDet, tableUnMasked, tableLoadedImages, tableGalleryTop, 'tableOut()', '633px', '286px');
	});
}

function furnImagesLoaded(){
	furnButton.addEvent('mouseenter', furnOver);
	furnButton.addEvent('mouseleave', furnOut);
	furnCloseBtn.addEvent('click', function(){closeMask("furn", false);});
	furnButton.addEvent('click', function(){
		if("furn" != currOpen){
			closeMask(currOpen);
		}
		currOpen = "furn";
		openMask(furnDet, furnUnMasked, furnLoadedImages, furnGalleryTop, 'furnOut()', '633px', '286px');
	});
}

function accImagesLoaded(){
	accButton.addEvent('mouseenter', accOver);
	accButton.addEvent('mouseleave', accOut);
	accCloseBtn.addEvent('click', function(){closeMask("acc", false);});
	accButton.addEvent('click', function(){
		if("acc" != currOpen){
			closeMask(currOpen);
		}
		currOpen = "acc";
		openMask(accDet, accUnMasked, accLoadedImages, accGalleryTop, 'accOut()', '633px', '286px');}
	);
}

function remCloseEvents(){
	$('tableGalleryTop').removeEvents();
	$('tableHead').removeEvents();
	
	$('accGalleryTop').removeEvents();
	$('accHead').removeEvents();
	
	$('furnGalleryTop').removeEvents();
	$('furnHead').removeEvents();
	
	$('kitGalleryTop').removeEvents();
	$('kitHead').removeEvents();
	
	$('copyGalleryTop').removeEvents();
	$('copyHead').removeEvents();
}

function addCloseEvents(){
	$('tableGalleryTop').addEvent('click', function(){closeMask("table", false);});
	$('tableHead').addEvent('click', function(){closeMask("table", false);});
	
	$('accGalleryTop').addEvent('click', function(){closeMask("acc", false);});
	$('accHead').addEvent('click', function(){closeMask("acc", false);});
	
	$('furnGalleryTop').addEvent('click', function(){closeMask("furn", false);});
	$('furnHead').addEvent('click', function(){closeMask("furn", false);});
	
	$('kitGalleryTop').addEvent('click', function(){closeMask("kit", false);});
	$('kitHead').addEvent('click', function(){closeMask("kit", false);});
	
	$('copyHead').addEvent('click', function(){closeMask("copy", true);});
	$('copyGalleryTop').addEvent('click', function(){closeMask("copy", true);});
}

function openMask(detail, mask, images, gallery, outFunc, detailW, detailH){
		
	unMask = detail.effect('clip', {duration: 500, transition: Fx.Transitions.Quad.easeInOut, onComplete: addCloseEvents});
	
	eval(outFunc);
	
	if(window.ie){
		detail.setStyle('width', detailW);
		detail.setStyle('height', detailH);
	}
	
	detail.setStyle('opacity', 1);
	detail.setStyle('visibility', 'visible');
	gallery.setStyle('visibility','visible');
	
	unMask.start(mask);
	
	if(images != null){
		loadedImages = images;
		fadeImages(gallery);
	}
}


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

var fadeImage = function() {
	var image = loadedImages[imageFadeCount];
	image.setStyle('opacity', 0);
	image.injectInside(currGallery);
	fadeImageAni = new Fx.Styles(image, {duration:1000, wait:false});
	fadeImageAni.start({'opacity': 1});
	if((imageFadeCount + 1) == (loadedImages.length)){
		imageFadeCount = 0;
	}
	else{
		imageFadeCount++;
	}
}

function fadeImages(gallery) {
	currGallery = gallery;
	imageFadeCount = 0;
	var image = loadedImages[imageFadeCount];
	image.injectInside(gallery);
	image.setStyle('opacity', 1);
	imageFadeCount++;
	imageFadeTimer = fadeImage.periodical(4000);
}

function emailAdded(){
	emailThanks.setStyle('visibility', 'visible');
	emailThanksAni.start(emailThanksUnMasked);
}

function onWindowResize(){
	
	mainDim = main.getCoordinates();
	furnDim = furnHotSpot.getCoordinates();
	kitDim = kitHotSpot.getCoordinates();
	accDim = accHotSpot.getCoordinates();
	tableDim = tableHotSpot.getCoordinates();
//	signUpDim = signUp.getCoordinates();
	copyDim = copyHotSpot.getCoordinates();
	
	initBorder(furnBorder, furnDim);
	initBorder(kitBorder, kitDim);
	initBorder(accBorder, accDim);
	initBorder(tableBorder, tableDim);
	initBorder(copyBorder, copyDim);
	
	initButton(furnButton, furnDim);
	initButton(kitButton, kitDim);
	initButton(accButton, accDim);
	initButton(tableButton, tableDim);
	initButton(copyButton, copyDim);
	
	if(window.ie){
		initDet(tableDet, tableDim, 0, 1);
		initDet(furnDet, furnDim, 0, 1);
		initDet(kitDet, kitDim, -97, 317);
		initDet(accDet, accDim, 0, -317);
		initDet(copyDet, copyDim, -287, 1);
	}
	else if(window.webkit420){
		initDet(tableDet, tableDim, 0, 1);
		initDet(furnDet, furnDim, 0, 1);
		initDet(kitDet, kitDim, -97, 316);
		initDet(accDet, accDim, 0, -317);
		initDet(copyDet, copyDim, -287, 1);
	}
	else{
		initDet(tableDet, tableDim, 0, 0);
		initDet(furnDet, furnDim, 0, 0);
		initDet(kitDet, kitDim, -97, 316);
		initDet(accDet, accDim, 0, -317);
		initDet(copyDet, copyDim, -287, 0);
	}
	
	reposRem();
//	reposEmailThanks();
	initSubNav(mainDim);
	
	placeText(furnText, furnDim, 20);
	placeText(kitText, kitDim, 20);
	placeText(accText, accDim, 20);
	placeText(tableText, tableDim, 20);

}



function kitOpenMask(){
	kitButton.removeEvents();
	if("kit" != currOpen){
		closeMask(currOpen);
	}
	currOpen = "kit";
	remOut();
	openMask(kitDet, kitUnMasked, kitLoadedImages, kitGalleryTop, 'kitOut()', '318px', '384px');
}	

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

function getVersion(dataString, versionSearchString) {
	var index = dataString.indexOf(versionSearchString);
	if (index == -1) return;
	return parseFloat(dataString.substring(index+versionSearchString.length+1));
}

window.addEvent('load', function() {

	furnBorder = $('furnBorder');
	kitBorder = $('kitBorder');
	accBorder = $('accBorder');
	tableBorder = $('tableBorder');
	copyBorder = $('copyBorder');

	furnButton = $('furnButton');
	kitButton = $('kitButton');
	accButton = $('accButton');
	tableButton = $('tableButton');
	copyButton = $('copyButton');

	accCloseBtn = $('accCloseBtn');
	accGalleryTop = $('accGalleryTop');

	tableCloseBtn = $('tableCloseBtn');
	tableGalleryTop = $('tableGalleryTop');
	
	kitCloseBtn = $('kitCloseBtn');
	kitGalleryTop = $('kitGalleryTop');
	
	furnCloseBtn = $('furnCloseBtn');
	furnGalleryTop = $('furnGalleryTop');
	
	copyCloseBtn = $('copyCloseBtn');
	copyGalleryTop = $('copyGalleryTop');

	furnText = $('furnText');
	kitText = $('kitText');
	accText = $('accText');
	tableText = $('tableText');
	copyText = $('copyText');

	furnHotSpot = $('furnHotSpot');
	kitHotSpot = $('kitHotSpot');
	accHotSpot = $('accHotSpot');
	tableHotSpot = $('tableHotSpot');
	copyHotSpot = $('copyHotSpot');

	tableDet = $('tableDet');
	tableCloseBtn = $('tableCloseBtn');
	accDet = $('accDet');
	accCloseBtn = $('accCloseBtn');
	furnDet = $('furnDet');
	furnCloseBtn = $('furnCloseBtn');
	kitDet = $('kitDet');
	kitCloseBtn = $('kitCloseBtn');
	copyDet = $('copyDet');
	copyCloseBtn = $('copyCloseBtn');
	
	copyButton.addEvent('mouseenter', copyOver);
	copyButton.addEvent('mouseleave', copyOut);
	copyCloseBtn.addEvent('click', function(){closeMask("copy", true);});
	copyButton.addEvent('click', function(){
		if("copy" != currOpen){
			closeMask(currOpen);
		}
		currOpen = "copy"; 
		openMask(copyDet, copyUnMasked, null, copyGalleryTop, 'copyOut()', '633px', '286px');
	});
		
	
	
	
	
	new Asset.images(kitImages, {onComplete: kitImagesLoaded, onProgress: function(i){imgProgress(i, this, kitLoadedImages)}});
	new Asset.images(tableImages, {onComplete: tableImagesLoaded, onProgress: function(i){imgProgress(i, this, tableLoadedImages)}});
	new Asset.images(accImages, {onComplete: accImagesLoaded, onProgress: function(i){imgProgress(i, this, accLoadedImages)}});
	new Asset.images(furnImages, {onComplete: furnImagesLoaded, onProgress: function(i){imgProgress(i, this, furnLoadedImages)}});

	initCommon("about");
	$$('.subNav')[0].addClass('selected');  //replaced with Mootool equivalent, Prototype approach conflicted
	onWindowResize();
	
	initializeMask(tableDet, tableMasked, tableUnMasked);
	initializeMask(accDet, accMasked, accUnMasked);
	initializeMask(furnDet, furnMasked, furnUnMasked);
	initializeMask(kitDet, kitMasked, kitUnMasked);
	initializeMask(copyDet, copyMasked, copyUnMasked);
		

// end window load
});