$(document).ready(function () {
  $('#recentprojects').before('<div class="holding-project recent-project"></div>');
  $('div.recent-project').hide();
  $('div#latestproject').show();
  
  function transitionTo(index, speed) {
    if (! speed) { speed = 'slow'; }
    
    $('div#latestproject').fadeOut(speed, function () {
       $('div.holding-project').attr('id', 'latestproject').show();
      $('div#latestproject').attr('id', '');
    })
   
    $('div#featureimage img').fadeOut(speed, function () {
      $('#recentprojects ul li a').removeClass('active');
      $($('div.recent-project')[index]).attr('id', 'latestproject');
      $('div.holding-project').attr('id', '');
      $('div#featureimage img').attr('src', images[index]);
      $('div#latestproject').fadeIn(speed);
      $('div#featureimage img').fadeIn(speed); 
      $('#recentprojects ul li:nth-child(' + (index + 1) + ') a').addClass('active');
    });
  }
  
  function cycleProjects() {
    if (! hadClick) {
      currentIndex = currentIndex + 1;
      transitionTo(currentIndex % 3);
      window.setTimeout(cycleProjects, 7500);
    }
  }
  window.setTimeout(cycleProjects, 3000);
  
  $('#recentprojects ul li').click(function () {
    hadClick = true;
    clicked_index = $('#recentprojects ul li').index(this);
    transitionTo(clicked_index, 'fast');
    return false;
  });
})