$(document).ready(function() {
	_initInput('inp_name', 'Name');							   
	_initInput('inp_lastname', 'Last name');		
	_initInput('inp_email', 'e-mail');	
	_initInput('inp_country', 'Country');
	_initInput('txt_message', 'Message');
	
	// agrego la clase active para cambiar el color on focus
	$('.contact-form .inp_bg input').focus(function(){
		$(this).parent('.inp_bg').addClass('active');
	});
	$('.contact-form .inp_bg input').blur(function(){
		$(this).parent('.inp_bg').removeClass('active');
	});
	$('.contact-form .textarea_bg textarea').focus(function(){
		$(this).parent('.textarea_bg').addClass('active');
	});
	$('.contact-form .textarea_bg textarea').blur(function(){
		$(this).parent('.textarea_bg').removeClass('active');
	});
	
	// despliego el contacto
	
	// si es internet explorer menor que 8 no tiene transicion el efecto
	if($.browser.msie &&  $.browser.version < 8 ){
		$('#open-contact').click(function(){
			$('.contact-form').toggle();
		});
		$('#close-contact').click(function(){
			$('.contact-form').hide();
		});
		
		
	}else{
		$('#open-contact').click(function(){
			$('.contact-form').slideToggle('slow');
		});
		$('#close-contact').click(function(){
			$('.contact-form').slideUp('slow');
		});
		
	}

	$('.openContact').click(function(e){
		e.preventDefault();
		$('html, body').animate({scrollTop:0}, 'slow');
		$('#open-contact').click();
	});

	
	// view options
	$('#list-products').hide();
	$(".view-options a.show-detail").addClass('active');
	createCarouselNavigator($("#full-products"));
	
	$(".view-options a.show-detail").click(function(e){
		e.preventDefault();
		
		$(this).addClass('active');
		$(".view-options a.show-list").removeClass('active');
		if($("#list-products:visible")) {
			$('#list-products').hide();
		}
		$('#full-products').show();
		createCarouselNavigator($("#full-products"));
	});
	
	$(".view-options a.show-list").click(function(e){
		e.preventDefault();
		
		$(this).addClass('active');
		$(".view-options a.show-detail").removeClass('active');
		if($("#full-products:visible")) {
			$('#full-products').hide();
		}
		$('#list-products').show();
		createCarouselNavigator($("#list-products"));
	})

	$('.ProductDetail').live( 'click' , function(){
		var iID = $(this).parents('div.tef-mu').attr('id').split('_')[1];

		//Buscar la posicion del elemento del carousel con el mismo id
		var iPos = $('div#full-products ul li#productDetail_'+iID).index();
		
		$(".view-options a.show-detail").addClass('active');
		$(".view-options a.show-list").removeClass('active');
		$('#list-products').hide();

		if($.browser.msie){
			createCarouselNavigator($("#full-products"), 1 , 1, (iPos+1));
			$('#full-products').show();
		}else{
			$('#full-products').show();
			createCarouselNavigator($("#full-products"), 1 , 1, (iPos+1));
		}
		
	});

});


var progNum=0;
function onProgress(){
	return (progNum!=0)
}

function progress(){
	progNum++;
	document.body.style.cursor = 'wait';
}

function complete(){
	progNum--;

	if (progNum==0){
		document.body.style.cursor = '';
	}

}

function enviarContacto(){
	if (onProgress()) return;
	
	if (inputIsEmpty('inp_name')) {
		$('#inp_name').focus();
		$('#msg-error').html('You should complete your name.');
	}else if (inputIsEmpty('inp_lastname')) {
		$('#inp_lastname').focus();
		$('#msg-error').html('You should complete your last name.');
	}else if (inputIsEmpty('inp_email')) {
		$('#inp_email').focus();
		$('#msg-error').html('You should complete your e-mail.');
	}else if ( !is_email( $('#inp_email').val() ) ){
		$('#inp_email').focus();
		$('#msg-error').html('Your e-mail is not valid.');
	}else if (inputIsEmpty('inp_country')) {
		$('#inp_country').focus();
		$('#msg-error').html('You should complete your country.');
	}else if (inputIsEmpty('txt_message')) {
		$('#txt_message').focus();
		$('#msg-error').html('You should complete your message.');
	}else{
		
		$('#msg-error').html('Sending...');
		
		$.ajax({
			type: "POST",
			url: WEB_PATH + "app/ajax/contacto_enviar.php",
			data: $('#frmContacto').serialize(),
			async: false,
			beforeSend: function(){
				progress();
			},
			complete: function(){
				complete();
			},
			success: function(response){
				if (response==1){
					$('#msg-error').html("Message sent");
				}else{
					$('#msg-error').html("Error");
				}

				clean_form('frmContacto');
			},
			error:function (xhr, ajaxOptions, thrownError){
				$('#msg-error').html("Error");
            }
		});
	}
	
	
}


/* funciones para jCarousel */
/**
 * crea el menu de navegacion para el carousel
 * asigna la clase jcarousel al elemento especificado
 * @since 04/08/2010
 * @author Piblox
 * @param obj:object
 * @param scroll:int	numero de item a paginar en cada click
 * @param visible:int   cantidad de items que se van a mostrar
 * @param start:int		numero de item en el que se va a inicializar el carousel
 * @param auto:int		Specifies how many seconds to periodically autoscroll the content. If set to 0 (default) then autoscrolling is turned off.
 * @param wrap:string	Specifies whether to wrap at the first/last item (or both) and jump back to the start/end. Options are "first", "last", "both" or "circular" as string. If set to null, wrapping is turned off (default).
 */
function createCarouselNavigator(obj, visible , scroll, start , auto, wrap){

	/*
	if(obj.data('init')){
		return false;
	}
	 */
	
	auto=(auto) ? auto : 0;
	wrap=(wrap) ? wrap : '';
	visible=(visible) ? visible : 1;
	scroll=(scroll) ? scroll : 1;

	var ul = obj.find('ul').first()	;

	if(ul.children().length >1){
		//Eliminar los botoncitos que hayan
		obj.find('.jcarousel-control').html('');
		
		ul.children('li').each(function(h){
			obj.find('.jcarousel-control').append('<a href="javaScript:void(\'\');" class="page" rel="'+(h+1)+'"></a> ');
		});
	}

	obj.jcarousel({
		scroll:scroll ,
		auto:auto,
		visible: visible,
		start:start,
		wrap: wrap,
		initCallback: mycarousel_initCallback,
		itemFirstInCallback:  highlight,
		itemFirstOutCallback: removehighlight
	});
	
	obj.data('init', true);

}

/**
 * agrega eventos al los botones de navegacion del carousel especificado
 * @since 04/08/2010
 * @author Piblox
 * @param carousel obj jcarousel
 */
function mycarousel_initCallback(carousel) {

	var navigator = carousel.container.find('.jcarousel-control');
	navigator.children('a').bind('click', function() {
		$(this).parent().children().removeClass('active');
		$(this).addClass('active');
		carousel.scroll($.jcarousel.intval($(this).attr('rel')));
		//carousel.startAuto(0);
		return false;
	});
};

// agrega la clase active al boton de navegacion correspondiente a la imagen actual   <a>
// <a href="#">1</a> to <a href="#" class="selected">1</a>
function highlight(carousel, obejctli,liindex,listate){

	var navigator = carousel.container.find('.jcarousel-control');
	navigator.children('a:nth-child('+ liindex +')').attr("class","active");

	var sCarouselID = carousel.list.context.id;

	if(sCarouselID == 'full-products')
	{
		if($(obejctli).hasClass('apple')){
			 $('span.apple').parent().removeClass('off');
		}else{
			$('span.apple').parent().addClass('off');
		}

		if($(obejctli).hasClass('android')){
			$('span.android').parent().removeClass('off');
		}else{
			$('span.android').parent().addClass('off');
		}
	}else if (sCarouselID == 'list-products'){
		$('span.apple').parent().removeClass('off');
		$('span.android').parent().removeClass('off');
	}
}

// it will remove last active slide from <a>
// <a href="#" class="active">1</a> to <a href="#">1</a>
function removehighlight(carousel, obejctli,liindex,listate){
	var navigator = carousel.container.find('.jcarousel-control');
	navigator.children('a:nth-child('+ liindex +')').removeAttr("class","active");
}


/*function showProductDetail(){
	$(".view-options a.show-detail").addClass('active');
	$(".view-options a.show-list").removeClass('active');
	$('#list-products').hide();
	$('#full-products').show();

	createCarouselNavigator($("#full-products"), 1 , 1, 2)

}*/