//settings
var slide = 0;
var imgPath = 'images/slideshow/';
var ssHeight;
//delay and fade
if(typeof delay != null)
  delay *= 1000;
else
  var delay = 4000;
if(typeof fade != null)
  fade *= 1000;
else
  var fade = 1000;

for(var i=0;i<slides.length;i++) {
  $.preloadImages(imgPath+slides[i]);
}

//get the slideshow height based on the first slide and start the show
$('#slide0').load(function() {
  setHeight();
  setTimeout('nextSlide()',delay);
});

//events

$(window).resize(function() {
  setHeight();
});

//methods

function nextSlide() {
  //fade in the next slide
  var prevSlide = slide;
  slide = (slide == slides.length - 1) ? 0 : slide + 1;
  $('#Content').append('<div id="slidelayer'+slide+'" class="slidelayer">'+
                       '<img id="slide'+slide+'" class="slide" src="'+
                       imgPath+slides[slide]+'" alt="Slide #'+slide+'" />'+
                       '</div>');
  $('#slidelayer'+slide).css('display','none');
  $('#slide'+slide).css('height',ssHeight+'px');
  $('#slidelayer'+slide).css('margin','-'+ssHeight+'px auto -4px');
  $('#slidelayer'+slide).fadeIn(fade,function() {
    $('#slidelayer'+prevSlide).remove();
    $(this).css('margin','auto auto -4px');
    setTimeout('nextSlide()',delay);
  });
  //set the margin difference to account for different browsers
  var slHeight = $('#slidelayer'+slide).outerHeight();
  if(ssHeight < slHeight)
    $('#slidelayer'+slide).css('margin','-'+slHeight+'px auto -4px');
}

function setHeight() {
  $('#slide'+slide).removeAttr("style");
  ssHeight = $('#slide'+slide).height();
}