var timer = "";
 $(document).ready(function(){
   //Count number of images in ul
   $('#slideshow li').each(function(i){ 
     //append number into #imgSelect
	 if (i == 0){
	   $('#imgSelect').append('<li class="active" id="'+i+'"></li>');
	 }
	 else{
	   $('#imgSelect').append('<li id="'+i+'"></li>');
     }
   });
   
   
   $("#imgSelect li").click(function(){

     var clickedImg = $(this).attr("id");
      $("#imgSelect li, #slideshow li").removeClass("active");
	  $(this).addClass("active");
	  
      $("#slideshow li:eq("+clickedImg+")").addClass("active");
	 clearInterval(timer);

   });
 });

/*** 
    Simple jQuery Slideshow Script
    Released by Jon Raasch (jonraasch.com) under FreeBSD license: free to use or modify, not responsible for anything, etc.  Please link out to me if you like it :)
***/

function slideSwitch() {

    var $active = $('#imgSelect li.active, #slideshow li.active');

    if ( $active.length == 0 ) $active = $('#imgSelect li:last, #slideshow li:last');

    // use this to pull the images in the order they appear in the markup
    var $next =  $active.next().length ? $active.next()
        : $('#imgSelect li:first, #slideshow li:first');
     
    $active.addClass('last-active');

    $next.css({opacity: 0.0})
        .addClass('active')
        .animate({opacity: 1.0}, 200, function() {
            $active.removeClass('active last-active');
        });
   
}

$(function() {
	 timer = setInterval( "slideSwitch()", 5000 );	
});