Show Location

// Wrap the whole thing in domready and an anonymous function.
// This prevents anything inside of it from being clobbered
// in the global namespace and from clobbering anything
// in the global namespace.
// This is instead of defining the function globally and passing
// it to domready, like you did before:'
// $(function(){showLocation()});
$(function(){
  // Take advantage of the fact that variables declared outside
  // of a function are available inside any function declared
  // in the same scope. This is called closure and is a very
  // useful property of javascript.  Don't be afraid, use it!
  // This will take care of your 'deep-linking' problem
  // without using a window reload.
  var currentLocation = (window.location.hash).replace('#','');

  // make showLocation available locally only.
  // function declarations are different from function statements.
  // any function declared like this:
  // function namedFunction(){};
  // is available immediately for the entire namespace to use
  // and this clobbers closures and the global namespace.
  // Don't do this unless you know why you are doing it.
  var showLocation = function(){
    //current location is declared outside and is available inside. It runs on domready, so
    // you have access to the deeplink.
    if(currentLocation !== '' && currentLocation != null && typeof currentLocation !== "undefined"){
      $('.activeLocation').addClass('hide').removeClass('activeLocation');
      $('.' + currentLocation).removeClass('hide').addClass('activeLocation');
    }
  }

  // we don't need this since we wont be changing the location via window.location
  // after the page has loaded.
  // if (Modernizr.hashchange){
  //   window.onhashchange = showLocation;
  // } else if (Modernizr.hashchange === false){   // IE7 fallback

  // observe the branch buttons to set the current
  // location, like you were,
  // but instead of setting the window location
  // split the href at the # character and
  // set currentLocation to the result
  $('.btn-branch').on('click', function (e) {
    e.preventDefault();
    // splits a uri with a hash component into an array of two strings:
    // "/test/me#faq-foo".split('#') == ["/test/me/", "faq-foo"]
    // and uses the 1 indexed element (the hash component) as
    // current location, again taking advantage of the closure
    // property of javascript.
    currentLocation = $(this).attr('href').split('#')[1];
    // calls the showLocation() function to use the new
    // currentLocation
    showLocation();
  });
  
  //executes showLocation on dom load
  // to take advantage of deep linking.
  showLocation();
});