/*** 
    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 :)
	Completely rewritten by Ken Reiss (portone.com)
***/

// Home Page
function slideSwitch1() {
	var $active = $('#slideshow1 IMG.active');

    if ( $active.length == 0 ) $active = $('#slideshow1 IMG:last');

    // use this to pull the images in the order they appear in the markup
    var $next =  $active.next('IMG').length ? $active.next('IMG')
        : $('#slideshow1 IMG:first');

    // uncomment the 3 lines below to pull the images in random order
    
    // var $sibs  = $active.siblings();
    // var rndNum = Math.floor(Math.random() * $sibs.length );
    // var $next  = $( $sibs[ rndNum ] );

    $active.addClass('last-active').animate({opacity: 0.0}, 1000);

	// 2009-09-20 KR Remove display:none, which we put in during init for IE8 bug fix
	$next.css('display', 'block');

    // 2009-09-20 KR Set interval specific to this image or default if 0
	var $interval = $next.attr('displayTime') ? $next.attr('displayTime') * 1000 : 5000;
	if ($interval < 3000) $interval = 3000;
	setTimeout( "slideSwitch1()",  $interval);

	$next.css({opacity: 0.0})
		.css('left', ($('#slideshow1').width()-$next.width())/2 + 'px')
        .addClass('active')
        .animate({opacity: 1.0}, 1000, function() {
            $active.removeClass('active last-active');
        });

	// 2009-09-21 KR fill description - animate down, fill text, then animate back up - used animate vs fadin/out due to bug on 2nd fadein
	var $desc = $('#slideshow1 #description');
	$desc.animate({opacity: 0.0}, 200, function () {
		$desc.html($next.attr('description'));
	    $desc.animate({opacity: 1.0}, 800);
     });
}

// 2010-07-05 KR Must be inside doc ready, or nothing is even there yet
$(document).ready(function() {
	// 2010-07-05 KR After 1st image loads, then begin slide show so its width is ready allowing its left to be set below (so we don't see a jump after it loads)
	$('#slideshow1 IMG:first').one("load", function() {
		// 2009-08-18 KR Start with ALL (2010-07-05) images as 'hide' class, then unhide them all when we start. 
		$('#slideshow1 IMG').removeClass('hide');
	//alert($('#slideshow1 IMG').width());
		// 2010-07-05 KR Resize first image, then make it active and turn off display: hide.  This ay it won't appear in the wrong place (since left was not set) while loding
		$('#slideshow1 IMG:first').css('left', ($('#slideshow1').width()-$('#slideshow1 IMG').width())/2 + 'px').addClass('active').css('display', 'block');
	
		// 2009-09-20 KR Allow image-specific timeout for 1st pic
		var $interval = $('#slideshow1 IMG:first').attr('displayTime') ? $('#slideshow1 IMG:first').attr('displayTime') * 1000 : 5000;
		if ($interval < 2000) $interval = 2000;
		setTimeout( "slideSwitch1()", $interval );  // 2009-09-20 KR was setInterval
	
		// 2009-09-21 KR fill description for 1st pic
		$('#slideshow1 #description').animate({opacity: 0.0}, 1);
		$('#slideshow1 #description').html($('#slideshow1 IMG:first').attr('description'));
		$('#slideshow1 #description').animate({opacity: 1.0}, 800);
	}).each(function(){
		// 2010-07-05 KR after calling this, keep checking if this image is completed and when it is trigger the load again.
		if(this.complete) $(this).trigger("load");
	});
});