// JavaScript Document

var bannersIntervalId;
jQuery.noConflict();
jQuery(document).ready(function() {
	jQuery.ajax({
		url: "../home/BannerCapaJSON.asp",
		dataType: 'json',
		data: "",
		success: function(data){
			// banners principais
			var banners = "";
			var classe = "";
			var ultimaLegenda = "";
			jQuery(data.banner_g).each(function(i, item){
				var legenda = item.legenda;
				ultimaLegenda = legenda;
				var arquivo = item.arquivo;
				var target = item.target;
				var url = item.link;
				classe = i==0 ? "show-image " : "";
				banners += "<a href=\""+url+"\" class=\""+classe+"banner-g\" id=\"banner-"+(i+1)+"\" target=\""+target+"\"><img src=\""+arquivo+"\" alt=\"\" title=\"\" width=\"498\" height=\"220\" rel=\""+legenda+"\"/></a>";
			});
			jQuery("#gallery").prepend(banners);
			if (data.banner_g.length>1) {
				slideShow();
			} else {
				jQuery('.caption .content').html(ultimaLegenda);
			}
			
			// banners menores
			var banners = "";
			jQuery(data.banner_p).each(function(i, item){
				var legenda = item.legenda;
				var arquivo = item.arquivo;
				var url = item.link;
				banners += "<li><a href=\""+url+"\" title=\""+legenda+"\"><img src=\""+arquivo+"\" /></a></li>";
			});
			
			jQuery("#carrocel-destaques").prepend(banners).jcarousel({wrap: 'circular'});
		}
	});
	
});

function slideShow(id_banner) {
	//Set the opacity of all images to 0
	jQuery('#gallery a.banner-g').css({opacity: 0.0});
	
	if (!id_banner) {
		//Get the first image and display it (set it to full opacity)
		jQuery('#gallery a.banner-g:first').css({opacity: 1.0});
	
		//Get the caption of the first image from REL attribute and display it
		jQuery('#gallery .content').html(jQuery('#gallery a.banner-g:first').find('img').attr('rel'));

		var banners_total = jQuery("#gallery a.banner-g").length;
		for (var i=1; i<=banners_total; i++) {
			jQuery("#menu-galeria ul").append("<li id='menu-item-"+i+"'><a href='javascript:trocar_banner("+i+")'>"+i+"</a></li>");
		}
		jQuery("#menu-galeria li:first").addClass('selecionado');
		
	} else {
		jQuery('#gallery a#banner-'+id_banner).css({opacity: 1.0});
		jQuery('#gallery .content').html(jQuery('#gallery a#banner-'+id_banner).find('img').attr('rel'));
		jQuery('#gallery a.show-image').removeClass("show-image");
		jQuery('#gallery a#banner-'+id_banner).addClass("show-image");
		jQuery('#menu-galeria li.selecionado').removeClass('selecionado');
		jQuery('#menu-item-'+id_banner).addClass('selecionado');
	}
		
	//Call the gallery function to run the slideshow, 6000 = change to next image after 6 seconds
	bannersIntervalId = setInterval('gallery()',4000);
}

function gallery() {
	
	//if no IMGs have the show class, grab the first image
	var current = (jQuery('#gallery a.show-image')?  jQuery('#gallery a.show-image') : jQuery('#gallery a.banner-g:first'));

	//Get next image, if it reached the end of the slideshow, rotate it back to the first image
	var next = ((current.next().length) ? ((current.next().hasClass('caption')) ? jQuery('#gallery a.banner-g:first') : current.next()) : jQuery('#gallery a.banner-g:first'));	
	
	//Get next image caption
	var caption = next.find('img').attr('rel');
	
	//Set the fade in effect for the next image, show class has higher z-index
	next.css({opacity: 0.0})
		.addClass('show-image')
		.animate({opacity: 1.0}, 1000);
		
	jQuery('#gallery .caption .content').fadeOut(150, function(){
			//Display the content
			jQuery('#gallery .content').html(caption);
			jQuery(this).fadeIn(850);
			
		});
	//Hide the current image
	current.animate({opacity: 0.0}, 1000)
	.removeClass('show-image');
	var current_imenu = jQuery("#menu-galeria li.selecionado").removeClass('selecionado').next().addClass('selecionado');
	if (!jQuery("#menu-galeria li.selecionado").length) jQuery("#menu-galeria li:first").addClass("selecionado");
	

}

function trocar_banner(id_banner){
	clearInterval(bannersIntervalId);
	slideShow(id_banner);
}
