function swapImages()
{
      var $active = $('div.image_thumb ul li.active');
      var $next = ($active.next().length > 0) ? $active.next() : $('div.image_thumb ul li:first');
      $active.removeClass('active');
      $next.addClass(function(){
      	onHover($(this));
      	return 'active';
      });

}

function onHover(o){
    var $img = $(o).find('img');
    var imgAlt = $img.attr("alt"); //Get Alt Tag of Image
    var imgSrc = $img.attr("src");

    var img_str = imgSrc.split("=");
    var str = img_str[1].split("&");
    imgSrc = str[0];
    
    var $a = $(o).find('a');
    var aHref = $a.attr("href");
   	var imgDesc = $(o).find('.block').html();  //Get HTML of the "block" container
   	var imgDescHeight = $("div.main_image").find('.block').height(); //Find the height of the "block"
    if ($(o).is(".active")) {  //If the list item is active/selected, then...
       	return false; // Don't click through - Prevents repetitive animations on active/selected list-item
   	} 
   	else { //If not active then...
       //Animate the Description
       $("div.main_image .block").animate({ opacity: 0, marginBottom: -imgDescHeight }, 250 , function() { //Pull the block down (negative bottom margin of its own height)
        	$(this).html(imgDesc).animate({ opacity: 0.85,  marginBottom: "0" }, 250 ); //swap the html of the block, then pull the block container back up and set opacity
            $("div.main_image img").attr({ src: imgSrc , alt: imgAlt}); //Switch the main image (URL + alt tag)
            $("div.main_image a").attr({ href: aHref}); //go to this link when the image is clicked
        	});
    	}
    //Show active list-item
    	$("div.image_thumb ul li").removeClass('active'); //Remove class of 'active' on all list-items
    	$(o).addClass('active');  //Add class of 'active' on the selected list
    	return false;
}


$(document).ready(function(){
	var timerID = setInterval("swapImages()", 6000);
	$("div.main_image .desc").show(); //Show Banner
	$("div.main_image .block").animate({ opacity: 0.85 }, 1 ); //Set Opacity
	
	//Add the active class (highlights the very first list item by default)
	$("div.image_thumb ul li:first").addClass('active');
	
	//on hover event handler
    $("div.image_thumb ul li").hover(function(){
    	onHover($(this));
    	clearInterval(timerID);
	}, function() {
		timerID = setInterval("swapImages();",6000);
	});

});
