var productToOpen = -1;
var productToClose = -1;

var splashImgOpen = 1;
function openProducts(selected,open){
	var products = $$('.productContainer');
	var productFx = new Fx.Elements(products, {wait: false, duration: 400, transition: Fx.Transitions.quadOut, onComplete: nextProducts});
	var productFx2 = new Fx.Elements(products, {wait: false, duration: 400, transition: Fx.Transitions.quadIn, onComplete: nextProducts});
	
	var splashImg = $$('.splashImg');
	var splashFx = new Fx.Elements(splashImg, {wait: false, duration: 450, transition: Fx.Transitions.quadOut, onComplete: nextProducts});
	
	var clipper = $$('.clipper');
	var clipperFx = new Fx.Elements(clipper, {wait: false, duration: 400, transition: Fx.Transitions.quadOut});
	
	productToOpen = selected;
	//productToClose = open;
	
	var obj = {};
	var splobj = {};
	if(selected == -1){
		obj[productToClose] = {
			'width': [products[productToClose].getStyle('width').toInt(), 0]
		};
		productFx.start(obj);
		//productToClose = -1;
	}else{
		if(splashImgOpen == 1) {
			
			splobj[0] = {
				'width' : [splashImg[0].getStyle('width').toInt(), 0]
			};
			splashFx.start(splobj);
			splashImgOpen = 0;
			productToClose = selected;
			
		} else if(productToClose == -1){
			products[selected].setStyle('display', 'block');
			
			obj[selected] = {
				'width': [products[selected].getStyle('width').toInt(), 640]
			};
			productFx.start(obj);
			productToClose = selected;
		}else{
			obj[productToClose] = {
				'width': [products[productToClose].getStyle('width').toInt(), 0]
			};
			clipper[productToClose].setStyle('display','none');
			productFx2.start(obj);
			//productToClose = -1;
		}
	}
}

function nextProducts(){
	var products = $$('.productContainer');
	var productFx = new Fx.Elements(products, {wait: false, duration: 400, transition: Fx.Transitions.quadOut, onComplete: setClipperTrue});
	
	var splashImg = $$('.splashImg');
	var splashFx = new Fx.Elements(splashImg, {wait: false, duration: 450, transition: Fx.Transitions.quadOut});
	
	var clipper = $$('.clipper');
	var clipperFx = new Fx.Elements(clipper, {wait: false, duration: 400, transition: Fx.Transitions.quadOut});
	
	if(splashImgOpen == 0) {
		splashImg[0].setStyle('display','none');
	}
	
	if(productToClose != -1){
		clipper[productToClose].setStyle('display', 'none');
		products[productToClose].setStyle('display', 'none');
		productToClose = -1;
	
		if(productToOpen != -1){
			clipper[productToOpen].setStyle('display', 'none');
			products[productToOpen].setStyle('display', 'block');
		
			var obj = {};
			obj[productToOpen] = {
				'width': [products[productToOpen].getStyle('width').toInt(), 640]
			};
			productFx.start(obj);
			productToClose = productToOpen;
		}
	} 
}

function setClipperTrue() {
	var clipper = $$('.clipper');
	
	if(productToClose == productToOpen) {
		clipper[productToOpen].setStyle('display','block');
	}
}