var image_slide = new Array();
var NumOfImages = null;
document.observe('dom:loaded', function() {

  if(image_slide.length == 0) {
    var li_num = 1;
    $$('#slideshow li').each(function(li) {
      li.removeClassName('show');
      li.id = 'slide-'+li_num;
      image_slide.push(li.id);
      li_num++;
    });
    addHoverMessage('(hover pointer to pause)');
    NumOfImages = image_slide.length;
    StartSlideShow();
  }
});

$$('#slideshow li').invoke('observe', 'mouseover', function(event){
  removeHoverMessage();
  addHoverMessage('(paused)');
  clearInterval(play);
});
$$('#slideshow li').invoke('observe', 'mouseout', function(event){
  removeHoverMessage();
  addHoverMessage('(hover pointer to pause)');
  clearInterval(play);

  StartSlideShow();
});

var removeHoverMessage = function() {
  $$('ul.program-slideshow li sub').each(function(e) {e.remove()});
}

var addHoverMessage = function(message_txt) {
  $$('ul.program-slideshow li').each(function(e) {e.insert('<sub>'+message_txt+'</sub>')});
}


// ----- SLIDESHOW FUNCTIONS
var i = 0;

var wait = 5000;

// The Fade Function
function SwapImage(x,y) {
  $(image_slide[y]).fade({
    duration: 0.5,
    afterFinish: function() {
      $$('#slideshow li').invoke('setStyle', "{display:'none'}");
      $(image_slide[x]).appear({ duration: .5});
    }
  });
}

function StartSlideShow() {
	play = setInterval('Play()',wait);
}

function Play() {
	var imageShow, imageHide;

	imageShow = i+1;
	imageHide = i;

	if (imageShow == NumOfImages) {
		SwapImage(0,imageHide);
		i = 0;
	} else {
		SwapImage(imageShow,imageHide);
		i++;
	}
}