var current = 0;


// Setup main image preloader 
var Im = new Image();
Im.id = 'main';
$(Im).load(function() {
  $('#main').hide().attr('src', Im.src).fadeIn();
})

// Update image
function updateImage() {
  
  // Keep current image within bounds
  if(current < 0)
    current = $('#thumbs a').size()-1;

  if(current > $('#thumbs a').size()-1)
    current = 0;

  // Update image
  var img_url = $('#thumbs a').eq(current).attr('href');

  $(Im).attr('src', img_url);

  // Update text description
  $('h3#imagedescr').text($('#thumbs a').eq(current).children('img').attr('alt'));

  // Update pager text
  $('#pager span').text((current + 1));
}

// Next image
function nextImage() {
  current++;
  updateImage();
  return false;
}

// Prev image
function prevImage() {
  current--;
  updateImage();
  return false;
}


$(function() {


  // Click thumbnail
  $('#thumbs a').click(function() {
    current = $(this).index();
    updateImage();
    return false;
  });

  // next & prev image
  $('#next').click(nextImage);
  $('#prev').click(prevImage);

});