$(document).ready(function(){
  // Auto Rotate our home page slideshow
  var slideShowInterval = 4000;
  var slideIntervalId = setInterval("slideSwitch()", slideShowInterval);
  slideFadeAllThumbnails(0); // Fade all of our slideshow thumbnails
  slideUnfadeThumbnail('photo1', 0);  // And unfade the first thumbnail

  // Hovering over the slideshow should stop the slideshow
  $('#slideshow').hover(
    function() { clearInterval(slideIntervalId); },
    function() { slideIntervalId = setInterval("slideSwitch()", slideShowInterval); }
  );

  // Hovering over a slideshow thumbnail should show the slide for that thumbnail
  $('#slideshow-thumbnails span').hover(
    function() {
      clearInterval(slideIntervalId); // Stop the slideshow
      var photo_id = $(this).attr('id').replace('-thumbnail', '');
      // Switch to the thumbnails slide, unless that slide is already active
      if (!$("#" + photo_id).hasClass("active")) {
        slideSwitch(photo_id);
      }
    },
    function() {
      slideIntervalId = setInterval("slideSwitch()", slideShowInterval); // Restart the slideshow
    }
  );

  // Add some markup to our menu listitems
  $('#main-header ul ul li a').prepend("<div class='menu-side menu-left' />");
  $('#main-header ul ul li a').prepend("<div class='menu-side menu-right' />");

  // Add some markup to .box elements
  $('.box').prepend("<div class='box-top' />");
  $('.box').append("<div class='box-bottom' />");

  // Add even/odd classes to table rows
  $("table.list tr:odd").addClass("odd");
  $("table.list tr:even").addClass("even");
});

function slideSwitch(next_id) {
  var $active = $('#slideshow div.active');
  if ( $active.length == 0 ) $active = $('#slideshow div:last');
  if (next_id) {
    var $next = $("#" + next_id);
    var speed = 0;
  } else {
    var $next =  $active.next().length ? $active.next() : $('#slideshow div:first');
    var speed = 800;
  }
  $active.addClass('last-active');
  $next.css({opacity: 0.0}).addClass('active').animate({opacity: 1.0}, speed * 2, function() {
    $active.removeClass('active last-active');
  });

  // Fade all thumbnails, and then unfade the next thumbnail
  slideFadeAllThumbnails(speed);
  slideUnfadeThumbnail($next.attr('id'), speed);
}

function slideFadeAllThumbnails(speed) {
  $('#slideshow-thumbnails span').fadeTo(speed, 0.70);
}

function slideUnfadeThumbnail(id, speed) {
  $('#slideshow-thumbnails #' + id + '-thumbnail').fadeTo(speed, 1.0);
}