$(function() {
    var mIndex = 0;
    var mCount = $("#mainSlide ul.imgRolling li").length;
    var mTimer;


    function mainInit() {
        var wrapWidth = $("#mainSlide ul.imgRolling li").width();
        $("#mainSlide ul.imgRolling").css('left', -(mIndex * wrapWidth) + 'px');
    }


    function mainSlide() {
        var mSize = $("#mainSlide ul.imgRolling li:first").width();


        if (mIndex >= mCount) {
            mIndex = 0;
        } else if (mIndex < 0) {
            mIndex = mCount - 1;
        }
        $("#mainSlide ul.imgRolling").stop(true, false).animate({left: -(mSize * mIndex) + 'px'}, 800, 'easeInCubic');
        $("#mainSlide .indicator .inner a").removeClass('active');
        $("#mainSlide .indicator .inner a").eq(mIndex).addClass('active');
    }


    mTimer = setInterval(function() { mIndex++; mainSlide(); }, 4000);


    $("#mainSlide .indicator .inner > a").click(function() {
        var $idx = $(this).index();
        if (!$("#mainSlide ul.imgRolling").is(':animated')) {
            clearInterval(mTimer);
            mTimer = setInterval(function() { mIndex++; mainSlide(); }, 4000);
            mIndex = $idx;
            mainSlide();
        }
    });


    $("#mainSlide .left-arrow").click(function() {
        if (!$("#mainSlide ul.imgRolling").is(':animated')) {
            clearInterval(mTimer);
            mIndex--;
            mainSlide();
            mTimer = setInterval(function() { mIndex++; mainSlide(); }, 4000);
        }
    });


    $("#mainSlide .right-arrow").click(function() {
        if (!$("#mainSlide ul.imgRolling").is(':animated')) {
            clearInterval(mTimer);
            mIndex++;
            mainSlide();
            mTimer = setInterval(function() { mIndex++; mainSlide(); }, 4000);
        }
    });


    mainInit();
    $(window).resize(function() {
        mainInit();
    });
});