var pagerContainer;
var pagerItems;
var outerContainer;
var innerContainer;
var dataItems;
var currentIndex;
var interval;
var rtl;
var cloneWidth;



var init = function () {
    rtl = $('Body').hasClass('Rtl');
    pagerContainer = $('.HPintro-pager');
    pagerItems = pagerContainer.find('IMG');
    outerContainer = $('.ContainerOuter');
    innerContainer = $('.ContainerInner');
    dataItems = innerContainer.find('.innerDiv');
    cloneWidth= dataItems.first().outerWidth();
    currentIndex = 0;

    pagerItems.each(function (index) {
        $(this).click(function () { select(index); });
        $(this).data('dataItem', dataItems.eq(index));

    });

    setInt();

}


var select = function (index) {
    pagerItems.eq(index).attr('src', '/images/HPintro/hebrew/icon_pager_01.png').siblings().attr('src', '/images/HPintro/hebrew/icon_pager.png')


    var requiredOffset = -index * dataItems.eq(index).width();
    clearInterval(interval);
    innerContainer.stop().animate({ 'left': requiredOffset }, 1000, function () {


        setInt();


    });
    var thisIndex = currentIndex;
    dataItems.eq(currentIndex).fadeOut(1000, function () {
        dataItems.eq(thisIndex).show();


    });
    currentIndex = index;




}

var setInt = function () {
    interval = setInterval(function () {
        var nextIndex = currentIndex + 1;
        if (nextIndex >= dataItems.length) {
            nextIndex = 0;
            clearInterval(interval);
            var clone = dataItems.first().clone();
            clone.insertAfter(dataItems.last());
            innerContainer.width(innerContainer.width() + cloneWidth);
            pagerItems.eq(0).attr('src', '/images/HPintro/hebrew/icon_pager_01.png').siblings().attr('src', '/images/HPintro/hebrew/icon_pager.png')
            var thisIndex = currentIndex;
            dataItems.eq(currentIndex).fadeOut(1000, function () {
                dataItems.eq(thisIndex).show();


            });
            innerContainer.animate({ 'left': ('-=' + cloneWidth) }, 1000, function () {
                clone.remove();
                innerContainer.width(innerContainer.width() - cloneWidth);
                innerContainer.animate({ 'left': 0 }, 0);
                currentIndex = 0;
                setInt();

            });
            return;
        }
        else
            select(nextIndex);


    }, 3000);

}


$(init);