var slideshows = []
var numSlideshows = 0;

$(window).load(function () {
  $('ul.slideshow li img').greyScale();

  // initialize slideshows
  $('ul').each(function() {
    numSlideshows ++;
    var numImages = 0;

    $(this).attr('slideshow_id', numSlideshows);

    slideshows[numSlideshows] = {
      'slideshow_obj' : this,
      'images'        : [],
      'activeImage'   : 1,
      'numImages'     : 0
    }

    $(this).find('li').each(function() {
      numImages ++;
      slideshows[numSlideshows]['images'][numImages] = this;

      if(numImages == 1) {
        $(this).css('display', 'block');
      } else {
        $(this).css('display', 'none');
      }
    });

    slideshows[numSlideshows]['numImages'] = numImages;

    $(this)
      .append(
        $('<img>')
          .append('vorige')
          .attr({
            'src'         : 'slideshow/arrow_left.png',
            'slideshowId' : numSlideshows
          })
          .addClass('left')
          .click(function() {
            slideshow_slide($(this).attr('slideshowId'), 'prev');
          })
      )
      .append(
        $('<img>')
          .append('volgende')
          .attr({
            'src'         : 'slideshow/arrow_right.png',
            'slideshowId' : numSlideshows
          })
          .addClass('right')
          .click(function() {
            slideshow_slide($(this).attr('slideshowId'), 'next');
          })
      );
  });
});

function slideshow_slide(slideshow_id, direction) {
  if(direction != 'next') direction = 'prev';

  var nextImage = null;
  var currentImage = null;

  var currentImageId = 0;
  var nextImageId = 0;

  if(typeof(slideshows[slideshow_id]) != 'undefined') {
    currentImageId = slideshows[slideshow_id]['activeImage'];
  } else {
    return false;
  }

  if(direction == 'next') {
    nextImageId = currentImageId + 1;
  } else {
    nextImageId = currentImageId - 1;
  }

  if(nextImageId < 1) {
    nextImageId = slideshows[slideshow_id]['numImages'];
  } else if(nextImageId > slideshows[slideshow_id]['numImages']) {
    nextImageId = 1;
  }
  
  if(typeof(slideshows[slideshow_id]['images'][currentImageId]) == 'undefined') {
    return false;
  } else {
    currentImage = slideshows[slideshow_id]['images'][currentImageId];
  }
  if(typeof(slideshows[slideshow_id]['images'][nextImageId]) == 'undefined') {
    return false;
  } else {
    nextImage = slideshows[slideshow_id]['images'][nextImageId];
  }

  $(currentImage).fadeOut();
  $(nextImage).fadeIn();

  slideshows[slideshow_id]['activeImage'] = nextImageId;
}