function theRotator() {

    $('.banner-rotator ul li').css({ opacity: 0.0 }); //Set the opacity of all images to 0
    $('.banner-rotator ul li:first').css({ opacity: 1.0 }); //Get the first image and display it (gets set to full opacity)    
    setInterval('rotate()', 4000);
}
function rotate() {    
    var current = ($('.banner-rotator ul li.show') ? $('.banner-rotator ul li.show') : $('.banner-rotator ul li:first'));//Get the first image
    if (current.length == 0) 
        current = $('.banner-rotator ul li:first');    
        
    var next = ((current.next().length) ? ((current.next().hasClass('show')) ? $('.banner-rotator ul li:first') : current.next()) : $('.banner-rotator ul li:first')); //Get next image, when it reaches the end, rotate it back to the first image
    //Un-comment the 3 lines below to get the images in random order
    //var sibs = current.siblings();
    //var rndNum = Math.floor(Math.random() * sibs.length );
    //var next = $( sibs[ rndNum ] );
        
    next.css({ opacity: 0.0 }).addClass('show').animate({ opacity: 1.0 }, 1000);//Set the fade in effect for the next image, the show class has higher z-index
    current.animate({ opacity: 0.0 }, 1000).removeClass('show');//Hide the current image
};

function willRotator() {
    $('.rotate-will-type ul li').css({ opacity: 0.0 }); //Set the opacity of all images to 0
    $('.rotate-will-type ul li:first').css({ opacity: 1.0 }); //Get the first image and display it (gets set to full opacity)    
    setInterval('rotateWill()', 6000);
}
function rotateWill() {
    var current = ($('.rotate-will-type ul li.show') ? $('.rotate-will-type ul li.show') : $('.rotate-will-type ul li:first')); //Get the first image
    if (current.length == 0)
        current = $('.rotate-will-type ul li:first');

    var next = ((current.next().length) ? ((current.next().hasClass('show')) ? $('.rotate-will-type ul li:first') : current.next()) : $('.rotate-will-type ul li:first')); //Get next image, when it reaches the end, rotate it back to the first image    
    next.css({ opacity: 0.0 }).addClass('show').animate({ opacity: 1.0 }, 1000); //Set the fade in effect for the next image, the show class has higher z-index
    current.animate({ opacity: 0.0 }, 1000).removeClass('show'); //Hide the current image
};

$(document).ready(function() { //Load the slideshow    
    theRotator(); willRotator();
    $('.banner-rotator').fadeIn(1500);
    $('.banner-rotator ul li').fadeIn(1500); // tweek for IE
    $('.rotate-will-type').fadeIn(2500);
    $('.rotate-will-type ul li').fadeIn(2500); // tweek for IE
});
