/* =========================================================================================================
Name: flagSlider content slider
Date created: 11th October 2010
Copyright: Flag
Author(s): Tom Hare
========================================================================================================= */

$(document).ready(function () {

    //declare variables for total width and positions array
    var totalWidth = 0;
    var slidePositions = new Array();
    var current = 0;
    var canScroll = true;

    //loop through each slide...
    $('.flagSlider .slidesHolder .slide').each(function (i) {
        //add current totalWidth value to array as this is how far from the left edge the current slide is
        slidePositions[i] = totalWidth;
        //add current slide width to totalWidth
        totalWidth += $(this).width();

        //little test
        if (!$(this).width()) {
            alert("can't get width. set dimensions on the images fool!");
            return false;
        }
    });

    //set the slidesHolder to the width of total cumulative slide widths
    $('.flagSlider .slidesHolder').width(totalWidth);

    //on load, add the active class to the first slide link
    $('.flagSlider .sliderNav ul li:first').addClass('active first');
    $('.flagSlider .sliderNav ul li:last').addClass('last');

    //when mouse is over slider area then pause autoScroll, restart (from current interval!) when mouse is removed
    $('.flagSlider').mouseenter(function () {
        canScroll = false;
    }).mouseleave(function () {
        canScroll = true;
    });

    //when a nav link is clicked...
    $('.flagSlider .sliderNav ul li a').click(function (th, autoScroll) {
        //remove active class from all li then add active class to parent li
        $('.flagSlider .sliderNav ul li').removeClass('active');
        $(this).parent('li').addClass('active');

        //get the current position by counting the previous ones
        var currPos = $(this).parent().prevAll().length;

        //set 'current' variable
        current = currPos;

        //animate the slider to the right slide
        $('.flagSlider .slidesHolder').stop(/*hammertime*/).animate({ marginLeft: -slidePositions[currPos] + 'px' }, 500);

        //stop the auto-scroll if a link has been clicked by clearing the timer interval
        if (!autoScroll) clearInterval(timer);

        return false;
    });

    //when the next arrow is clicked...
    $('.flagSlider a.next').click(function () {
        current++;
        $('.flagSlider .sliderNav ul li a').eq(current % $('.flagSlider .sliderNav ul li a').length).trigger('click', [false]);
        return false;
    });
    //when the prev arrow is clicked...
    $('.flagSlider a.prev').click(function () {
        current--;
        $('.flagSlider .sliderNav ul li a').eq(current % $('.flagSlider .sliderNav ul li a').length).trigger('click', [false]);
        return false;
    });

    //autoScroll through slides until one is clicked
    function autoScroll() {
        if (canScroll) {
            current++;
            $('.flagSlider .sliderNav ul li a').eq(current % $('.flagSlider .sliderNav ul li a').length).trigger('click', [true]);
        }
    }
    //set the timer in seconds
    var timerInterval = 6;
    var timer = setInterval(function () { autoScroll() }, timerInterval * 1000);
});