function bannerRotator(selector, scrollTime, pauseTime) {
    //default values of scroll time and pause time if nothing is set
    if (scrollTime == null) {
        scrollTime = 400;
    }
    if (pauseTime == null) {
        pauseTime = 5000;
    }

    $(selector + " li:first").css("display", "block"); //show the first list item
    $(selector + " li").each(function (intIndex) {
        $(this).attr('rel', (intIndex + 1));   //add the list position to the rel of each of our nav items
    });

    //create navigation buttons for each banner in the list
    var count = $(selector + " li").size(); //get total number of list items
	
	
    var i = 1;
    $(selector).append("<div id='bannerNav'></div>");
    while (i <= count) {
        if (i == $(selector + " li:visible").attr('rel')) {  //if its the nav item that belongs to the visible image, mark it as the active nav item
            $('#bannerNav').append("<a class='active' rel='" + i + "' href='#'></a> ");
        }
        else {
            $('#bannerNav').append("<a rel='" + i + "' href='#'></a> ");
        }
        i++;
    }

	if(count > 1){ scrollImages(count, selector, scrollTime, pauseTime); } //start the images scrolling if theres more than one image

    //handle navigation by clicking
    $("#bannerNav a").click(function () {
        $("#bannerNav a.active").removeClass('active');
        $(this).addClass('active'); //move the active nav item to this item

        var currentClassName = $(selector + " li:visible").attr('rel');
        var nextClassName = $(this).attr('rel');
        var storedTimeoutID = $("#bannerNav").attr('timeoutID');

        clearTimeout(storedTimeoutID); //stop the images from looping when a nav button is pressed
        $("span.pause").hide();
        $("span.play").show();

        if (nextClassName != currentClassName) { //if they click on the button for the image they are already viewing... do nothing.	
            $('#bannerVid').empty();
            $(selector + " li:visible").fadeOut(scrollTime);
            $(selector + " li[rel=" + nextClassName + "]").fadeIn(scrollTime);
        }
        return false; //stop the link from going to where the href attribute tells it
    });

    //print a pause/play button
    $('#bannerNav').append("<span class='pause'></span> ");
    $('#bannerNav').append("<span href='#' class='play' style='display:none;'></span> ");

    //stop the images looping on pause click
    $("span.pause").click(function () {
        var storedTimeoutID = $("#bannerNav").attr('timeoutID');
        clearTimeout(storedTimeoutID);
        $("span.pause").hide();
        $("span.play").show();
    });

    //start the images looping on play click
    $("span.play").click(function () {
        $('#bannerVid').empty();
        scrollImages(count, selector, scrollTime, pauseTime);
        $("span.play").hide();
        $("span.pause").show();
    });

    //display options when you hover over banner
    $("#bannerRotator").hover(
    function () {
        $("#bannerRotator li div").fadeIn("fast");
        $("#bannerOverlay").fadeIn("slow");
    },
	function () {
	    $("#bannerRotator li div").hide();
	    $("#bannerOverlay").hide();
	}
  );

    //pause the banners and bring the video to top when you click 'watch video'
    $("a.video").click(function () {
        var storedTimeoutID = $("#bannerNav").attr('timeoutID');
        clearTimeout(storedTimeoutID);
        $("span.pause").hide();
        $("span.play").show();
        $("#bannerVid").fadeIn("fast");
        var vidID = $(this).attr('vid');
        playerEmbed(vidID)
        return false;
    });
}

function scrollImages(count, selector, scrollTime, pauseTime) {
    currentClass = $(selector + " li:visible").attr('rel'); //get the list position of the image that we save to the rel attribute on page load
    nextClass = $(selector + " li:visible").attr('rel'); //open a new variable for the next class
    if (currentClass == count) { nextClass = 1; } //if you've reached the end of the images... start from number 1 again
    else { nextClass++; } //if not just add one to the last number
    var timeout = setTimeout(function () {
        $(selector + " li[rel=" + currentClass + "]").fadeOut(scrollTime) //fade out old image
        $("#bannerNav a.active").removeClass('active'); //remove active class from our nav
        $("#bannerNav a[rel=" + nextClass + "]").addClass('active'); //add new active class to the next nav item
        $(selector + " li[rel=" + nextClass + "]").fadeIn(scrollTime, scrollImages(count, selector, scrollTime, pauseTime)) //fade in the new image and start the loop again
    }, pauseTime);
    $("#bannerNav").attr('timeoutID', timeout); //save the timeout id as an attribute of that LI so we can cancel the loop later if a nav button is pressed
    timeout; //loop again
}

//function to embed flash player
function playerEmbed(id) {

    var w = $('#bannerRotator').width();
    var h = $('#bannerRotator').height();
    var player = "<object width='" + w + "' height='" + h + "'>";
    player += "<param name='allowfullscreen' value='true' />";
    player += "<param name='allowscriptaccess' value='always' />";
    player += "<param name='wmode' value='transparent' />";
    player += "<param name='movie' value='http://vimeo.com/moogaloop.swf?clip_id=" + id + "&amp;server=vimeo.com&amp;show_title=0&amp;show_byline=0&amp;show_portrait=0&amp;color=&amp;fullscreen=1' />";
    player += "<embed src='http://vimeo.com/moogaloop.swf?clip_id=" + id + "&amp;server=vimeo.com&amp;show_title=0&amp;show_byline=0&amp;show_portrait=0&amp;color=&amp;fullscreen=1'";
    player += "type='application/x-shockwave-flash' allowfullscreen='true' allowscriptaccess='always' wmode='transparent' width='" + w + "' height='" + h + "'>";
    player += "</embed></object>";
    $('#bannerVid').append(player);
}