(function($) {
    /*
     * THE PLAN OF ATTACK
     * UL is given a width of 1094px * number of elements 
     * keep track of current one, animate it & shizzle
     * when we get to the last one, animate all the way to to end
     * then add arrows
     * PARTY LIKE IT'S FRIDAY
     */

    var allDivs = $(".client-work"),
        divCount = allDivs.length,
        currentDivIndex = 0,
        theUl = $("#client-slider-wrap").find("ul#slider-ul");
        currentTimeout = undefined;
    theUl.width(1094*divCount + 500 + "px");
    generateLinks();
    setUp();
    function generateLinks() {
        for(var i = 0; i < divCount; i++) {
            var link = "<li><a id='slide-" + i + "'>" + (i+1) + "</a></li>";
            $("#slider-controls").find("ul").append(link);
        }
    }

    function setUp() {
        var average = (divCount % 2 == 0) ? divCount/2 : (divCount+1)/2;
        currentDivIndex = average-1;
        var currentDiv = allDivs.eq(currentDivIndex);
        currentDiv.addClass("active-project").css("opacity", 1);
        updateNumbers();
        theUl.css({
            'margin-left' : -1094 * currentDivIndex
        });
    }

    function updateNumbers() {
        $("#slider-controls").find("li").removeClass("active-project-num").eq(currentDivIndex).addClass("active-project-num");
    }


    function pullLeft() {
        if(currentDivIndex == allDivs.length-1) {
            currentDivIndex = 0;
            theUl.find("li").animate({
                'opacity' : '0.1'
            }, 1000, function() {
                $(".active-project").removeClass("active-project")
            });
            theUl.find("li").eq(0).animate({
                'opacity' : '1'
            }, 1000, function() {
                $(this).addClass("active-project");
            });
            theUl.animate({
                'margin-left' : '0px'
            }, 2000);
        } else {
            currentDivIndex += 1;
            $(".active-project").animate({
                'opacity' : '0.1'
            }, 500, function() {$(this).removeClass("active-project") }).next("li").animate({
                'opacity' : '1',
            }, 2000, function() {$(this).addClass("active-project")});
            theUl.animate({
                "margin-left" : "-=1094px"
            }, 2000);
        }
        updateNumbers();
        currentTimeout = setTimeout(pullLeft, 8000);
    }
    function pullRight() {
        if(currentDivIndex == 0) {
            currentDivIndex = allDivs.length-1;
            theUl.find("li").animate({
                'opacity' : '0.1'
            }, 1000, function() {
                $(".active-project").removeClass("active-project");
            });
            theUl.find("li").eq(currentDivIndex).animate({
                'opacity' : '1'
            }, 1000, function() {
                $(this).addClass("active-project");
            });
            theUl.animate({
                'margin-left' :  -1094*(divCount-1) + "px"
            }, 2000);
        } else {
            currentDivIndex -= 1;
            $(".active-project").animate({
                'opacity' : '0.1'
            }, 500, function() {$(this).removeClass("active-project") }).prev("li").animate({
                'opacity' : '1',
            }, 2000, function() {$(this).addClass("active-project")});
            theUl.animate({
                "margin-left" : "+=1094px"
            }, 2000);
        }
        updateNumbers();
        currentTimeout = setTimeout(pullRight, 8000);

    }

    function stopAllAnimations() {
        $(".active-project").stop(true, true);
        theUl.stop(true,true);
        theUl.find("li").stop(true, true);
    }
                
    function moveToIndex(i) {
        
        if(currentDivIndex == i) return false;
        stopAllAnimations();
        clearTimeout(currentTimeout);
        currentDivIndex = i;
        $(".active-project").animate({
            'opacity' : '0.1'
        }, 500, function() {$(this).removeClass("active-project") });
        var newItem = allDivs.eq(i);
        newItem.animate({
            'opacity' : '1',
        }, 2000, function() {$(this).addClass("active-project") });
        theUl.animate({
            "margin-left" : (-1094)*i + "px"
        }, 2000);
        updateNumbers();
        currentTimeout = setTimeout(pullLeft, 8000);
    }

    
    
    
    $("#slider-controls ul").delegate("a", "click", function() {
        stopAllAnimations();
        var theId = this.id; 
        var allItems = theId.split("-");
        var slideIndex = allItems[1];
        moveToIndex(slideIndex);
        return false;
    });

    currentTimeout = setTimeout(function() {
        pullLeft();
    }, 8000);

    $("#move-left, #move-right").click(function(e) {
        e.preventDefault();
        clearTimeout(currentTimeout);
        if(this.id === "move-left") {
            pullLeft();
        } else {
            pullRight();
        }
    });
    

})(jQuery);