$(document).ready(function() {
    passaImagemBanner();
});
vetAut = 0;
nItens = 0;
vetImagem = new Array();
vetURL = new Array();
function addImagem(tbn, img, url) {
    vetImagem[nItens] = img;
    vetURL[nItens] = url;


    if(nItens==0) {
        html = '<a href="'+vetURL[itemAtual]+'"><img src="imagens/banner/'+img+'" /></a>';
        $("#bannerPrincipal div").html(html);
    } else if(nItens == 1) {
        $("#bannerPrincipal div").css("background-image", "url('imagens/banner/"+img+"')");
    }
    
    html = '<li style="background-image: url(\'imagens/banner/'+tbn+'\');" rel="'+nItens+'">';
    if($("#banner ul li").length<=0) {
        html+= "<a href='"+vetURL[itemAtual]+"'><img src='imagens/banner-bg-on.png' /></a></li>";
    }
    else
        html+= "<a href='"+vetURL[itemAtual]+"'><img src='imagens/banner-bg-off.png' /></a></li>";
    
    objLI = $(html).click(function() {

        itemAtual = $(this).attr("rel");
        $("#banner ul li").html("<img src='imagens/banner-bg-off.png' /></li>");
        $(this).html("<img src='imagens/banner-bg-on.png' /></li>");
        $("#bannerPrincipal div").css("background-image", "url('imagens/banner/"+vetImagem[itemAtual]+"')");
        $("#bannerPrincipal div img").fadeOut(800, function() {
            html = '<a href="'+vetURL[itemAtual]+'"><img src="imagens/banner/'+vetImagem[itemAtual]+'" /></a>';
            $("#bannerPrincipal div").html(html);
            clearTimeout(vetAut);
            passaImagemBanner();
        });
        

    });
    $("#banner ul").append(objLI);
    nItens++;
}
var itemAtual = 0;
var proxItem = 0;
function passaImagemBanner() {
    vetAut = setTimeout(function() {
        itemAtual = itemAtual == 2 ? 0 : itemAtual+1;
        $("#bannerPrincipal div img").fadeOut(800, function() {
            $("#banner ul li").html("<img src='imagens/banner-bg-off.png' /></li>");
            $("#banner ul li[rel="+itemAtual+"]").html("<img src='imagens/banner-bg-on.png' /></li>");
            html = '<a href="'+vetURL[itemAtual]+'"><img src="imagens/banner/'+vetImagem[itemAtual]+'" /></a>';
            proxItem = itemAtual+1 > 2? 0 : itemAtual+1;
            $("#bannerPrincipal div").css("background-image", "url('imagens/banner/"+vetImagem[proxItem]+"')");
            $("#bannerPrincipal div").html(html);
            passaImagemBanner();
        });

    }, 5000);
}