function init_slideshow(){
  $("#featured").serialScroll({
    'target': '#photos',
    'items': 'li',
    'prev': '#controls .prev',
    'next': '#controls .next',
    'axis': 'x',
    'lazy': true,
    'duration': '900',
    'navigation': '#controls .list li a',
    'onBefore': function(e, elem, $pane, $items, pos){
      $("#controls .list li a").removeClass("active");
      $("#controls .list li a:eq("+pos+")").addClass('active');
    }
  });
}

var delay;

function delay_click(){
  if(delay != null){
    $("#projects .frame ."+delay).trigger('click');
    delay = null; 
  }
}

$(document).ready(function(){

  var loading = $("<div class='loading'><div class='message'>&nbsp;</div></div>");
  var motion = false;
  var loaded = $("#projects .project:eq(0) .frame a").attr('class');

  $("#projects .project .frame a").click(function(){
    var project = $(this).attr('class');
    if($("#featured").is(":hidden")){
      $("#portfolio-trigger").trigger("click");
      location.hash = "#portfolio"; 
      delay = project;
    }
    if(motion == false && loaded != project){
      loaded = project;
      
      $("#featured #photos").append($(loading));
      $(loading).fadeIn(); 
       
      $.ajax({
        'url': '/work/'+project,
        'success': function(data){       
          $("#featured").fadeOut(function(){
            $(this).html(data);
            init_slideshow();
          }).fadeIn();
        },
        'error': function(){
          $(loading).fadeOut().remove();
          alert('Sorry, something went wrong. Please try again later.');
        }
      });
    }
  });

  // Watch for back and forward buttons
	$(window).bind('hashchange', function(){
		var hash = location.hash
		$(hash+"-trigger").trigger("click");
	});
	
	$("#hire-trigger").toggle(function(){
	  $("#hire-panel").slideDown('fast');
      $("#navigation a").removeClass("active");
      $(this).addClass("active");
	}, function(){
	  $("#hire-panel").slideUp('fast');
	});
	
	$("#hire-panel .close").click(function(){
		var hash = location.hash
	  $("#hire-trigger").trigger("click");
		$("#hire-trigger").removeClass("active");
		$(hash+"-trigger").addClass("active");
	  return false;
	});

	$("#about-trigger").click(function(){
		if($("#about").is(":hidden") && motion == false){
		  if($("#hire-panel").is(":visible")){ 
		  	$("#hire-trigger").trigger('click'); 
		  }
		  motion = true;
      $("#navigation a").removeClass("active");
      $(this).addClass("active");
      $("#featured").fadeOut('medium', function(){
        $("#portfolio").animate({width: "300px" }, 'slow', function(){
          $("#portfolio .heading").animate({"margin-right": '-=7px'}, 'fast', function(){
            $("#about").show().animate({width: "650px"}, 'slow', function(){
              motion = false;
            });
            $("#about .left").fadeIn('slow', function(){
            	$("#close-about").fadeIn('fast');
            	$("#about .right").fadeIn('fast',function(){
	            	$("#networks").fadeIn('fast');
            	});
            });
          });
        });
      });      		
    }
  });
  $("#portfolio-trigger").click(function(){
		if($("#about").is(":visible") && motion == false){
		  if($("#hire-panel").is(":visible")){ 
		  	$("#hire-trigger").trigger('click'); 
		  }
		  motion = true;
      $("#navigation a").removeClass("active");
      $(this).addClass("active");
      $("#about .right").fadeOut('fast',function(){
      	$("#networks").fadeOut('fast');
      	$("#about .left").fadeOut('fast',function(){
      	 $("#close-about").fadeOut('fast');
         $("#about").animate({width: "0px"}, 'medium', function(){
            $("#about").hide();
            $("#portfolio .heading").animate({"margin-right": "7px"}, 'slow', function(){
              $("#portfolio").animate({"width": "950px"}, 'slow', function(){
               $("#featured").fadeIn('medium', function(){
                 motion = false;
                 delay_click();
                });
              });
            });
          });      	
      	});
      })
    }
  });
  
  // if there's a hash on page load...
  if(location.hash.length){
		var hash = location.hash
		$(hash+"-trigger").trigger("click");
  }
  
  $("#icons li a").mouseover(function(){
    $(this).stop().animate({ "top": "-=10px" }, 'fast');
    $(this).addClass('shadow');
  });

  $("#icons li a").mouseout(function(){
  	$(this).stop().animate({ "top": "0" }, 'medium');
  	$(this).removeClass('shadow');
  });
  
  init_slideshow();

  $("#controls .list li a").live('click',function(){
    $("#controls .list li a").removeClass('active');
    $(this).addClass('active');
  });

});