var slidesMax = 10;
var prevNum = 1;

$(document).ready(function() {	
    var speed = 1000;
    var timeout = 8500;
    var height = $('#slideshow-captions').height();
    $('#slideshow-captions').css('position', 'relative');
    $('#slideshow-captions .caption').css({
	position: 'absolute',
	top: $('#slideshow-captions').height() + 'px',
	left: '0px'
    });
    $('.label' + prevNum).css('top', '-5px');
    
    $('#slideshow').before('<div id="ss-pager">').cycle({ 
	fx: 'fade', 
	speed:  speed,
	timeout: timeout,
	pager: '#ss-pager',
	next:  '#ss-forward', 
   	prev:  '#ss-back',
	before: function(currSlide, nextSlide, opts, fwdFlag) {
	    var currNum = null;
	    // Figure out which slide/caption we're switching to
	    for (i = 0; i < slidesMax; i++) {
		if ($(nextSlide).hasClass('img' + i)) {
		    currNum = i;
		    break;
		}
	    }
	    if (currNum && currNum != prevNum) {
		var prevCaption = $('.label' + prevNum);
		var currCaption = $('.label' + currNum);
		setTimeout(function() {
		    prevCaption.css({
			position: 'absolute',
			top: '0px',
			left: '0px'
		    });
		    currCaption.css({
			position: 'absolute',
			top: '-' + (height + 20) + 'px',
			left: '0px'
		    });
		    prevCaption.animate({
			top: (height + 20) + 'px'
		    }, 300);
		    currCaption.animate({
			top: '-5px'
		    }, 300);
		    prevNum = currNum;
		}, (speed / 2));
	    }
	}
    });
});