// JavaScript Document

//- RESIZE ---------------------------------
$(window).bind('resize', function() {
	margen();
});
$('body').blur( function (){
	margen();
});

//- Calcular y asignar margenes ------------
function margen() {
	var wAlt = $(window).height();
	var wAnc = $(window).width();
	var margen = (wAlt-720)/2;
	var valor = margen+"px";
	$("#contenedor").css("margin-top",valor);
	/*$("#cabeza").css("margin-left",(wAnc-1280)/2+"px");
	$("#contenido").css("left",(wAnc-1280)/2+"px");*/
};

//una sencilla función para hacer clic en el siguiente enlace / un temporizador llamará a esta función, y comenzará la rotación
function rotate() {
	$('#anima').click();
}

//---
function init(vQui) {
	var on  = parseInt(vQui);
	var qui = 0;
	var qua = parseInt($('.carrousel li').length);
	var pX_Ini = parseInt(1600-(qua*800)) + 'px';

//- REPOSICIONAR ELEMENTOS -----------------
	$('.izq, .der').css('display','inline');
	$('#pie').css('top','-48px');
	$('.carrousel').css('left','-1360px');
	//-
	$('.carrousel li').each(function(i, n) {
		if(i >= qua-2) $(this).css({'left':pX_Ini});
		else           $(this).css({'left':'1600px'});
		if(i != 0)   $(this).animate({opacity: 0.5});
	});
	//-
	$('.carrousel li p').css({'opacity':1});
	//- $('.carrousel li .degrada a').css('background-color','none');
	//-
	if(on >= 0) {
		$('#submenu-inf ul').each(function(i) {
			if(parseInt(on)==i) $(this).css("display","block");
			else $(this).css("display","none");
		});
		$('#submenu-inf').css('top','-128px');
		$('#submenu-inf').css('display','block');
		
	}
	
	$('.n2 li:last-child').css('background-image','none');
	
	//$('#menu ul li:last-child').after('<li class="ocultar" style="float:right;"><a href="#">Ocultar el menú</a></li>');

//- MOUSE OVER -----------------------------
	$('#menu ul li, .menuInf li, .izq, .der').hover(
		function(event) {
			if(!$(this).hasClass('activo')) {
				$(this).css({cursor:'pointer'});
				$(this).animate({opacity: 0.5});
			}
		},
		function(event) {
			if(!$(this).hasClass('activo')) {
				$(this).css({cursor:'pointer'});
				$(this).animate({opacity: 1});
			}
		}
	);

//- MENU CLICK ----------------------------
	$('#menu ul li').click(function() {
		var valor = parseInt($(this).index());
		$('.cocina,.bany,.armaris,.contract').css("display","none");
		if(valor == 0)      $('.cocina').css("display","block");
		else if(valor == 2) $('.bany').css("display","block");
		else if(valor == 4) $('.armaris').css("display","block");
		else if(valor == 6) $('.contract').css("display","block");
		//-
		var este = this;
		$('#menu ul li').each(function() {
			if(este != this) $(this).removeClass('activo');
			$(this).animate({opacity: 1});
		});
		//- Ocultar submenu
		if($('#submenu').css('display')!='block' || $(this).attr('class') == 'activo') $('#submenu').slideToggle();
		//-
		if($(this).attr('class') == 'activo') $(this).removeClass('activo');
		else $(this).addClass('activo');
	});

//- OCULTAR SUBMENU -----------------------
	$('.ocultar').click(function() {
		$('#submenu').slideUp();
		$('#menu ul li').each(function() {
			$(this).removeClass('activo');
			$(this).animate({opacity: 1});
		});
	});

//- MENU INFERIOR CLICK -------------------
	$('.menuInf li:even').click(function() {
		var valor = parseInt($(this).index());
		$('#submenu-inf ul').each(function(ii) {
			if(parseInt(valor/2)==ii) $(this).css("display","block");
			else $(this).css("display","none");
		});
		//-
		var este = this;
		$('.menuInf li').each(function() {
			if(este != this) $(this).removeClass('activo');
			$(this).animate({opacity: 1});
		});
		//- Ocultar submenu
		if($('#submenu-inf').css('display')!='block') {
			$('.menuInf').css('z-index','102');
			$('#submenu-inf').css('top','-128px');
			$('#submenu-inf').show();
		}
		else {
		//$('#submenu-inf').hide('slow');
		}
		if($(this).attr('class') == 'activo') {
			$('#submenu-inf').hide();
		}
		//-
		if($(this).attr('class') == 'activo') $(this).removeClass('activo');
		else $(this).addClass('activo');
	});

//- OCULTAR SUBMENU -----------------------
	$('.ocultarInf').click(function() {
		$('#submenu-inf').hide();
		$('.menuInf li').each(function() {
			$(this).removeClass('activo');
			$(this).animate({opacity: 1});
		});
	});

//- CARRUSEL -----------------------------

//- izquierda ---
	$('.der').click(function() {
		if(on == -1) clearInterval(run);
		if(on == 100) endZoom();
		$('.carrousel li').each(function(i, n) {
			var quien = this;
			var posX = parseInt(parseInt($(this).css('left').split('px')[0]) - 800) + 'px';
			if(i == qui)
				pX = posX;
			$(quien).animate(
				{left:posX},
				1000,
				function(){
					if(i == qua-1)
						dondeEsta('i',pX);
				}
			);
		});
		//cancelar el comportamiento del enlace
		return false;
	});

//- derecha ---
	$('.izq').click(function() {
		if(on == -1) clearInterval(run);
		if(on == 100) endZoom();
		$('.carrousel li').each(function(i, n) {
			var quien = this;
			var posX = parseInt(parseInt($(this).css('left').split('px')[0]) + 800) + 'px';
			if(i == qui) pX = posX;
			$(quien).animate(
				{left:posX},
				1000,
				function(){
					if(i == qua-1)
						dondeEsta('d',pX);
				}
			);
		});
		//cancelar el comportamiento del enlace
		return false;
	});

//- mover imágenes ---
	var dondeEsta = function(desde,pX) {
		var q = qui;

	//- izquierda ---
		if(desde == 'i') {
			qui++;
			posInicial = parseInt(pX.split('px')[0]);
			if(q > 1) posInicial += parseInt(qua*800);
		}
	//- derecha ---
		else if(desde == 'd') {
			qui--;
			posInicial = parseInt(pX.split('px')[0]);
			if(q < 1) posInicial -= parseInt(qua*800);
		}
		$('.carrousel li').each(function(i, n) {
			//- izquierda ---
			if(desde == 'i') {
				if(q == qua-1) {
					qui = 0;
					if(i >= qua-2)               $(this).css({'left':pX_Ini});
					else                         $(this).css({'left':'1600px'});
				}
				else if(q == 0) { if(i < qua-2)  $(this).css('left',posInicial+'px'); }
				else if(q == 1) {                $(this).css('left',posInicial+'px'); }
				else if(q > 1)  { if(i < q)      $(this).css('left',posInicial+'px'); }
			}
			//- derecha ---
			else if(desde == 'd') {
				if(q == 0) {
					qui = qua-1;
					if(i > 1)                    $(this).css('left',posInicial+'px');
				}
				else if(q == 2)     { if(i > 2)  $(this).css('left',parseInt(parseInt(pX_Ini.split('px')[0])-800)+'px'); }
				else if(q < qua-1)  { if(i < q)  $(this).css('left',posInicial+'px'); }
			}

			if(i != qui) $(this).animate({opacity:0.5});
			else {
				if(on == 100)	$(this).animate(
									{opacity:1.0},
									100,
									function(){
										$('.carrousel').zoom({
											divName:'#viewport',
											selected:qui,
											drag:false,
											loupe:false,
											cursor: 'url(js/plus.cur), crosshair',
											movingCursor: 'url(js/minus.cur), move'
										});
									}
								);
				else			$(this).animate({opacity:1.0});
			}
		});
		//cancelar el comportamiento del enlace
		return false;
	}

//- ANIMACIÓN ----------------------------- http://www.webmasterio.com/2010/03/16/como-crear-un-sencillo-carrusel-infinito-con-jquery/
	$('#anima').click(function() {
		$('.carrousel li').each(function(i, n) {
			var quien = this;
			var posX = parseInt(parseInt($(this).css('left').split('px')[0]) - 800) + 'px';
			if(i == qui)
				pX = posX;
			$(quien).animate(
				{left:posX},
				1000,
				function(){
					if(i == qua-1)
						dondeEsta('i',pX);
				}
			);
		});
		//cancelar el comportamiento del enlace
		return false;
	});
	//velocidad de rotación y temporizador
	if(on == -1) {
		var speed = 4000;
		var run = setInterval('rotate()', speed);
	}
	margen();
}