var focused = true;
var topA;
var leftA;

$(function () {

    //////////////////////////////////////////////////////////////////
    /// CHROME BUG FIX                                             ///
    //////////////////////////////////////////////////////////////////
    var is_chrome = navigator.userAgent.toLowerCase().indexOf('chrome') > -1;

    if (is_chrome) {

        if (!window.addEventListener) {
        } else {

            window.addEventListener('focus', function () {

                focused = true;

                window.clearInterval(currentTimeout);
                window.clearInterval(currentTimeoutVacatures);
                window.clearInterval(currentTimeoutNieuws);

                currentTimeout = setTimeout("Rotate()", 1000);
                if (slideVacatures) { currentTimeoutVacatures = setTimeout("RotateVacatures()", 1000); }
                if (slideNieuws) { ccurrentTimeoutNieuws = setTimeout("RotateNieuws()", 1000); }
            }, false);

            window.addEventListener('blur', function () {

                focused = false;

                window.clearInterval(currentTimeout);
                window.clearInterval(currentTimeoutVacatures);
                window.clearInterval(currentTimeoutNieuws);

            }, false);
        }
    }


    //////////////////////////////////////////////////////////////////
    /// ETALAGE                                                    ///
    //////////////////////////////////////////////////////////////////
    $('.etalage>ul>li:eq(0)').addClass("active");
    $('.etalage>div>img').css('z-index', '1');
    $('.etalage>div>img:eq(0)').css('z-index', '3');
    $('.etalage>div>img:eq(1)').css('z-index', '2');
    $('.etalage>a:first').addClass("visible");

    if ($(".BTNopensollhome").offset() != null) {
        topA = $(".BTNopensollhome").offset().top;
        leftA = $(".BTNopensollhome").offset().left + 150 + 48;
        $('.etalage>a:first').offset({ top: topA, left: leftA });
    }

    currentTimeout = setTimeout("Rotate()", 4000);

    $('.etalage>ul>li').click(function () {
        lastClicked = $(this).index();
        focusSlide($(this).index());
    });

    //////////////////////////////////////////////////////////////////
    /// VACATURE SLIDER                                            ///
    //////////////////////////////////////////////////////////////////
    var vacaturesBlockHeightpx = $('.vacaturesrecent>div').css('height').replace('px', '');
    vacaturesBlockHeight = parseInt(vacaturesBlockHeightpx);

    var numElementsVacatures = $('.vacaturesrecent>div>div').size();

    //Zitten er meer dan 3 elementen in maar minder dan 6
    if (numElementsVacatures > 3 && numElementsVacatures < 6) {

        //Aanvullen tot er meer dan 6 zijn
        for (var i = 0; i < numElementsVacatures; i++) {
            $('.vacaturesrecent>div>div:nth-child(' + (i + 1) + ')').clone().appendTo($('.vacaturesrecent>div'));
        }

    }

    //Tops berekenen
    $('.vacaturesrecent>div>div').each(function () {

        $(this).css('top', vacaturesTotalHeight + 'px');
        vacaturesTotalHeight += 80;

    });

    //Zitten er meer dan 3 in -> animeren
    if ($('.vacaturesrecent>div>div').size() > 3) {

        slideVacatures = true;
        currentTimeoutVacatures = setTimeout("RotateVacatures()", 4000);
    }

    //////////////////////////////////////////////////////////////////
    /// NIEUWS SLIDER                                              ///
    //////////////////////////////////////////////////////////////////
    var nieuwsBlockHeightpx = $('.nieuwsrecent>div').css('height').replace('px', '');
    nieuwsBlockHeight = parseInt(nieuwsBlockHeightpx);

    var numElementsNieuws = $('.nieuwsrecent>div>div').size();

    //Zitten er meer dan 3 elementen in maar minder dan 6
    if (numElementsNieuws > 3 && numElementsNieuws < 6) {

        //Aanvullen tot er meer dan 6 zijn
        for (var i = 0; i < numElementsNieuws; i++) {
            $('.nieuwsrecent>div>div:nth-child(' + (i + 1) + ')').clone().appendTo($('.nieuwsrecent>div'));
        }

    }

    //Tops berekenen
    $('.nieuwsrecent>div>div').each(function () {

        $(this).css('top', nieuwsTotalHeight + 'px');
        nieuwsTotalHeight += 80;

    });

    //Zitten er meer dan 3 in -> animeren
    if ($('.nieuwsrecent>div>div').size() > 3) {

        slideNieuws = true;
        currentTimeoutNieuws = setTimeout("RotateNieuws()", 4000);
    }

});


//////////////////////////////////////////////////////////////////
/// ETALAGE                                                    ///
//////////////////////////////////////////////////////////////////
var currentSlideNr = 0;
var currentTimeout;
var lastClicked;

function Rotate() {

    var numSlides = $('.etalage>div>img').size();
    var nextSlideNr = (currentSlideNr + 1) % numSlides;

    $('.etalage>ul>li:eq(' + currentSlideNr + ')').removeClass("active");
    $('.etalage>ul>li:eq(' + nextSlideNr + ')').addClass("active");

    $('.etalage>div>img').css('z-index', '1');
    $('.etalage>div>img:eq(' + currentSlideNr + ')').css('z-index', '2');
    $('.etalage>div>img:eq(' + nextSlideNr + ')').css('z-index', '3');
    $('.etalage>div>img:eq(' + nextSlideNr + ')').css('top', '-228px');

    $('.etalage>div>img:eq(' + nextSlideNr + ')').animate({ 'top': '0px' }, 500);

    $('.etalage>a').removeClass("visible");
    $('.etalage>a:eq(' + nextSlideNr + ')').addClass("visible");

    if ($(".BTNopensollhome").offset() != null) {
        topA = $(".BTNopensollhome").offset().top;
        leftA = $(".BTNopensollhome").offset().left + 150 + 48;
        $('.etalage>a:first').offset({ top: topA, left: leftA });
    }
    
    currentSlideNr = nextSlideNr;
    if (focused) {
        currentTimeout = setTimeout("Rotate()", 5000);
    }
}

function focusSlide(index) {
 
    clearTimeout(currentTimeout);

    $('.etalage>ul>li:eq(' + currentSlideNr + ')').removeClass("active");
    $('.etalage>ul>li:eq(' + index + ')').addClass("active");

    $('.etalage>div>img:eq(' + index + ')').css('z-index', '4');
    $('.etalage>div>img:eq(' + index + ')').css('top', '-228px');

    currentSlideNr = index;

    $('.etalage>div>img:eq(' + index + ')').animate({ 'top': '0' }, 500);

    $('.etalage>div>img').not($('.etalage>div>img:eq(' + index + ')')).css('top', '0px');
    $('.etalage>div>img').not($('.etalage>div>img:eq(' + index + ')')).css('z-index', '1');

    $('.etalage>a').removeClass("visible");
    $('.etalage>a:eq(' + index + ')').addClass("visible");

    if ($(".BTNopensollhome").offset() != null) {
        topA = $(".BTNopensollhome").offset().top;
        leftA = $(".BTNopensollhome").offset().left + 150 + 48;
        $('.etalage>a:first').offset({ top: topA, left: leftA });
    }
    
    if (lastClicked == index) {
        currentTimeout = setTimeout("Rotate()", 7000);
    }

}

//////////////////////////////////////////////////////////////////
/// VACATURE SLIDER                                            ///
//////////////////////////////////////////////////////////////////
var slideVacatures = false;
var currentTimeoutVacatures;
var vacaturesBlockHeight;
var vacaturesTotalHeight = 0;

function RotateVacatures() {

    clearTimeout(currentTimeoutVacatures);

    $('.vacaturesrecent>div>div').each(function () {

        var currentTop = $(this).css("top");
        var currentTopNumeric = parseInt($(this).css("top").replace("px", ""));

        //Is de vacature boven uit beeld verdwenen?
        if (currentTopNumeric < 0) {

            //Onderin weer toevoegen
            var newTop = currentTopNumeric + vacaturesTotalHeight;
            $(this).css('top', newTop + 'px');
        }

        $(this).animate({ 'top': '-=' + 80 }, 500);
        //$(this).animate({ 'top': '-=' + vacaturesBlockHeight }, 500);

    });

    if (focused) {
        currentTimeoutVacatures = setTimeout("RotateVacatures()", 5000);
    }
}

//////////////////////////////////////////////////////////////////
/// NIEUWS SLIDER                                              ///
//////////////////////////////////////////////////////////////////
var slideNieuws = false;
var currentTimeoutNieuws;
var nieuwsBlockHeight;
var nieuwsTotalHeight = 0;

function RotateNieuws() {

    clearTimeout(currentTimeoutNieuws);

    $('.nieuwsrecent>div>div').each(function () {

        var currentTop = $(this).css("top");
        var currentTopNumeric = parseInt($(this).css("top").replace("px", ""));

        //Is de vacature boven uit beeld verdwenen?
        if (currentTopNumeric < 0) {

            //Onderin weer toevoegen
            var newTop = currentTopNumeric + nieuwsTotalHeight;
            $(this).css('top', newTop + 'px');
        }

        $(this).animate({ 'top': '-=' + 80 }, 500);
        //$(this).animate({ 'top': '-=' + nieuwsBlockHeight }, 500);

    });

    if (focused) {
        currentTimeoutNieuws = setTimeout("RotateNieuws()", 5000);
    }
}