$(function(){
  $('input[placeholder], textarea[placeholder]').placeholder(); // HTML5 polyfill for placeholder attribute
  
  /* map from link anchor text to the id of the section we want to show when the link is clicked */
  var linkmap = {
    'about': 'about', 
    'links': 'social-sites-nav', 
    'contact': 'contact-me'
  };
  
  function switchTo(finalSelector, duration) {
    duration = (typeof(duration) == 'undefined' || duration == null) ? 300 : duration
    var active = $('.current-section'), next = $(finalSelector);;
    var activeId = active[0].id, nextId = next[0].id;
    if(activeId != nextId) {
      active.addClass('previous-section').removeClass('current-section');
      
      $('#'+activeId+'-link').removeClass('selected');
      $('#'+nextId+'-link').addClass('selected');
      
      next.css({opacity: 0.0})
        .addClass('current-section')
        .animate({opacity: 1.0}, duration, function() {
          active.removeClass('previous-section');
      });
      
      
    }
  }
  
  /*  The following is for managing history using jquery.address. 
      This also contains the code that handles the top navigation in javascript-mode. */
  $('#top-nav li a').address();
  
  var switchOnLoad = true; // we want the switch to have 0 duration if this is page load.
  
  $.address.change(function(event) {
    var dur = (switchOnLoad ? 0 : null);    
    var newId = linkmap[event.pathNames[0]] || 'about';
    switchTo('#'+newId, dur);
  });
  
  setTimeout(function() { switchOnLoad = false; }, 300);
  
});