// CAROUSEL (o como sea que se escriba)
//
// Muestra diferentes imagenes en un area de la pagina
// dependiendo de del boton que se presione
// estilos en: HomePageStyles.css
// Created by: Hugo Giusti & the zombie hunters
// Modified by: Marcela Martinez

var lastSelectedBtn;
var lastSelectedImg;
var lastSelectedInfo;
var j = 1;
var timer;
var slideShowSpeed = 5000;

$(document).ready(function () {
    initialize();
    if ($(".Imgclass").length > 1) {
        changeInfo(j);
    } else {
        var texto = $($("#slider-images > input[type='hidden']")[0]).val();
        $(".imgTitle").text(texto);
    }

    $(".slider_bullets > a").click(function () {
        if ($(".ButtonImage").length > 1) {
            var position = $(this).text();
            j = parseInt(position);
            clearTimeout(timer);
            changeInfo(position);
        }
        return false;
    });

    $("#slider-images > a").click(function () {
        if ($(this).attr("href") !== "#")
            return true;
        return false;
    });
});
 
 //inicializa el carousel
function initialize()
{ 
    $('#slider-images > a > img').each(function(i) {
        if(i == 0)
            $(this).fadeIn(0);
        else
            $(this).css("display","none");
    });    
}

//cambia la info mostrada dependiendo del boton que se apreta
function changeInfo(clickedBtn)
{
    var button = $($(".ButtonImage")[clickedBtn-1]);
    
    //bajar el boton que estaba seleccionado
    if (lastSelectedBtn !== undefined) {
        lastSelectedBtn.animate({ paddingTop: "2px", paddingBottom: "2px", paddingRight: "5px", paddingLeft: "5px" }, 400);
    }
    
    var texto = $($("#slider-images > input[type='hidden']")[clickedBtn-1]).val();
    $(".imgTitle").text(texto);

    //resaltar boton a mostrar
    button.animate({ paddingTop: "4px", paddingBottom: "4px", paddingRight: "8px", paddingLeft: "8px" }, 400);
    
    lastSelectedBtn = button;
    changeSlide(j);
    
    var n = $(".Imgclass").length;
    j = j + 1;
    if (j > n) j = 1;
    var method = "changeInfo(" + j + ")";
    timer = setTimeout(method, slideShowSpeed);
}

//cambia la foto en el carousel
function changeSlide(slideName)
{
    if (lastSelectedImg !== undefined)
    {
        $(lastSelectedImg).fadeOut(400, function(){
            $($(".Imgclass")[slideName-1]).fadeIn(400);
        });
    }else{
        $($(".Imgclass")[slideName-1]).fadeIn(400);
    }
    lastSelectedImg = $($(".Imgclass")[slideName-1]);
}