$(document).ready(function() {
	  $(".page").hide();
	 // $("#mainCont").append('<div id="work"><div class="mainWrap"><div class="clear"></div></div><!-- END mainWrap --></div><!-- END work-->');
  
	  $("#home").append('<input type="button" value="Next" class="toggle" tabindex="-1" />');
	  $("#portfolioWrap .items div div").append('<div class="clear"></div>');
	  $(".mainWrap").append('<div class="beverage cloneMe"></div><div class="glasses cloneMe"></div><div class="device cloneMe"></div><div class="controller cloneMe"></div>');
	  $("nav").append('<div class="clear"></div>');
	  $(".contentR .naviWrap").append('<div class="navi"><a href="#0" class="active">About me</a><a href="#1">Professional Experience</a><a href="#2">Education</a><a href="#3">Additional Skills</a><a href="#4">Contact</a></div><a href="downloads/Bill_Gregory_Resume.pdf"><img src="images/global/pdf.png" width="26" height="27" alt="Download my Resume as an accessible PDF"></a><a href="http://www.linkedin.com/in/thebillgregory" target="_blank"><img src="images/global/linkedin.png" alt="connect with me on linked in"></a>');
	  $(".contentR .scrollable").append('<a class="prev browse left" id="prev">&laquo;&nbsp;Previous</a><a class="next browse right" id="next">Next&nbsp;&raquo;</a>');
	  $(".contentP").prepend('<a href="#" class="close">Close</a><div class="naviWrap"><div class="navi"><a href="#0" class="active">1</a><a href="#1">2</a><a href="#2">3</a><a href="#3">4</a><a href="#4">5</a><a href="#5">6</a><a href="#6">7</a><a href="#7">8</a><a href="#8">9</a><a href="#9">10</a></div><a class="prev browse left" id="prev">&laquo;&nbsp;Previous</a><a class="next browse right" id="next">Next&nbsp;&raquo;</a><div class="clear"></div></div>');
	  $(".contentR").prepend('<a href="#" class="close">Close</a>');
	  

  
	  $(".slider").height($(window).height());
	  $("#home").height($(window).height());
	  $("#work").height($(window).height());
	  $("#mySite").height($(window).height());
	  $(window).resize(function(){
		  resize();
	  });
	  resize();
  
	  $(".showP").click(function () {
		  $(".scrollable .items").css('left', '-550px');						
		  $(".showP").addClass("current");
		  $(".showR").removeClass("current");
		  $(".page").show("slow");
		  $(".contentR").hide("fast");
		  $(".contentP").show("slow");
	  });
	  
	  $(".showR").click(function () {
		  $(".scrollable .items").css('left', '-490px');
		  $(".showR").addClass("current");
		  $(".showP").removeClass("current");
		  $(".page").show("slow");
		  $(".contentP").hide("fast");
		  $(".contentR").show("slow");
	  });
	  
	  $(".close").click(function () {
	  $(".page").hide("slow");
	  $(".showP").removeClass("current");
	  $(".showR").removeClass("current");
	  });
  
	  $('#home .toggle').click(function () {
			flip('work');
	  });
  
  
	  $(".scrollable").scrollable({circular: true}).navigator({history: true});
	  
	  
  });
	  
  
  function flip(target) {
	  logger('flipping to ' + target);
	  var from = 'home';
	  if (target == 'home') from = 'work';
	  
	  $('#' + target).html('<div class="mainWrap"><div class="clear"></div></div>');
	  
	  $('#' + from + ' .cloneMe').each(function () {
		  $(this).clone( true, true).appendTo('#' + target + ' .mainWrap');
	  });
	  $('#' + from + ' .cloneBack').each(function () {
		  $(this).appendTo('#' + target + ' .mainWrap');
		  $('#' + target + ' .cloneBack').clone( true, true).appendTo('#' + from + ' .mainWrap');
	  });
	  $('#' + from + ' .mainWrap').append('<div class="clear"></div>');
	  $('#' + target).append('<input type="button" value="Next" class="toggle" />');
	  
	  if ($('.slider').width() == 0) {
		  $('.slider').animate({width:'100%'}, 3000);
	  } else {
		  $('.slider').animate({width:0}, 3000);
	  }
  
	  $('#' + target + ' .toggle').click(function() {
		  flip(from);
	  });
  
  }
  
  function logger(msg) {
	  try {
		  console.log(msg);
	  } catch (e) {}
  }
    
  function resize() {
	  /*$(".slider").height($(window).height()).width($(window).width());*/
	  $("#home").height($(window).height()).width($(window).width());
	  $("#work").height($(window).height()).width($(window).width());
	  logger("resize");
  }