$(document).ready(function () {
    var max = 21;

    var cur = $('#hero img:first').attr('data-first');

    var current = parseInt(cur) + 1;


    var timeoutId = setInterval(playSlideshow, 7000);

    callLoadImage();

    function playSlideshow() {
        if (current > max) {
            current = 1;
        }
        if (checkImage(current)) {

            $current = $('.heroImage.current');
            $current.fadeOut('2000');
            $current.removeClass('current');

            $('#heroItem' + current).addClass('current').fadeIn('2000');

            current++;
        }
    }

    function callLoadImage() {
        for (var i = cur; i < max + 1; i++) {
            loadImages(i);
        };

        for (var z = 1; z < cur; z++) {
            loadImages(z);
        };
    }
    function loadImages(cur) {
        var img = new Image();

        $(img)
            .load(function () {

                $(this).hide();

                $('#hero').append(this);
            })

            .error(function () {
                console.log("Darn you error")
            })

            .attr('src', '/Content/images/home-hero/' + cur + '.png')
            .addClass("heroImage")
            .attr('id', 'heroItem' + cur);

    }

    function checkImage(num) {
        var img = $('#heroItem' + num);

        if (img.length === 0)
            return false;
        else
            return true;
    }

});