$(document).ready(function(){
	
	//Inicializamos fancybox
    $("#imagenes .sombra a").fancybox({ 
        'overlayShow': true, //Lo activamos para que queden bloqueados los elementos de la galería
        'overlayOpacity':0, //Cero opacidad del fondo
        'onComplete':   function() { 
                            if (facebook){
                                $("#fancybox-wrap").css({ 
                                    'top':'10px', 
                                    'left':'10px'
                                });
                            }
                        }
    }); 
    $('td.mhthanombre a').fancybox({'overlayShow': true,'overlayOpacity':0});
    
        
	//Inicializamos la galeria thumbs
	$('ul#thumbs li:first-child').addClass('first-child');
	$('ul#thumbs').width($('ul#thumbs li').length*107); // 107 es el tamaño total que ocupa un LI incluyendo sus margenes
	
	//Añadimos efecto a los controles
	$('#ant').click(function(){
		var position = $('#thumbs').position();
		$('#ant').hide();
		$('#thumbs').stop().animate({
			left: '+=107'
			},200,function(){
				$('#sig').fadeIn("fast");
				var first_child = $('#thumbs li.first-child');
				$(first_child).removeClass('first-child');
				$(first_child).prev().addClass('first-child');
				if ($('#thumbs li.first-child').index() > $('#thumbs li:first-child').index()) $('#ant').fadeIn("fast");
			});
	});
	$('#sig').click(function(){
		var position = $('#thumbs').position();
		$('#sig').hide();
		$('#thumbs').stop().animate({
			left: '-=107'
			},200,function(){
				$('#ant').fadeIn("fast");
				var first_child = $('#thumbs li.first-child');
				$(first_child).removeClass('first-child');
				$(first_child).next().addClass('first-child');
				if ($('#thumbs li.first-child').index() + 4 < $('#thumbs li:last-child').index()) $('#sig').fadeIn("fast");
			});
	});

	//Seteamos los efectos de la galería, sus methotos y sus atributos
	$('#imagenes').cycle({ 
		fx: 'fade', //Efecto de la galería
		speed: 500, //Velocidad del efecto
		timeout: 0, //Tiempo entre transiciones
		pager: '#navegacion', //Identificador de la navegación
		pagerAnchorBuilder: function(idx, slide) {
			return '#navegacion li:eq(' + idx + ') div'; //Asignamos la navegacion a los elementos dentro de #navegacion
		},
		before: function(currSlideElement, nextSlideElement, options, forwardFlag){		
			var element = $(nextSlideElement).find('.marco-img');
			if ($(element).css('background-image') == "none"){
				//$('#cargando_galeria').show();
			}
		},
		after: function (currSlideElement, nextSlideElement, options, forwardFlag) {
			var element = $(nextSlideElement).find('.marco-img');
			if ($(element).css('background-image') == "none"){
				$('#cargando_galeria').show();
				var imgPreload = $('#preload');
				var idElement = $(element).attr('id');
				idElement = idElement.replace('_', '.');
				$(imgPreload)
					.attr('src', URLstl+idElement)
					.load(function (){
						setTimeout(function(){
							$('#cargando_galeria').hide();
							$(element).hide();
							$(element).css('background-image', 'url('+URLstl+idElement+')');
							$(element).fadeIn("slow");
						}, 800);
					});
			}
		}
	});

	//Por default se oculta la galeria al principio mientras se cargan las imagenes
	//qui se mandan a mostrar, ya que es cuando se han cargado complentamente en el documento
	$('#galeria').css('visibility','visible');
	$('#cargando_galeria').hide();
	//verificamos si hay mas imagenes para mostrar y asi colocar la flecha de sig
	if ($('#thumbs li.first-child').index() + 4 < $('#thumbs li:last-child').index()) $('#sig').fadeIn("fast");
});