text: var currentlyloaded = [];
  
  /**
   * Loads the data for the clicked navigation item.
   *
   * @param  {Object} clickednode The jquery object for the clicked node.
   */
  function handleClick(clickednode) {
      var contextcrumb = '';
      var parentnodes = clickednode.parents('li');
      for (var i = parentnodes.length; i >= 0; i--) {
          var treenodes = window.$(parentnodes[i]);
          if (treenodes.hasClass('item')) {
              if (contextcrumb == '') {
                  contextcrumb = treenodes[0].innerText;
              } else {
                  contextcrumb = contextcrumb + ' | ' + treenodes[0].innerText;
              }
          } else if (treenodes.hasClass('menu-item')) {
              if (contextcrumb == '') {
                  contextcrumb = treenodes[0].firstChild.textContent;
              } else {
                  contextcrumb = contextcrumb + ' | ' + treenodes[0].firstChild.textContent;
              }
          }
      }
      var datafile = clickednode.attr('data-var');
      loadContent(datafile, function() {
          addFileDataToMainArea(window[datafile], contextcrumb);
      });
  }
  
  /**
   * Load content to be displayed.
   *
   * @param  {String}   datafile The json data to be displayed.
   * @param  {Function} callback The function to run after loading the json file.
   */
  function loadContent(datafile, callback) {
  
      // Check to see if this file has already been loaded. If so just go straight to the callback.
      if (fileIsLoaded(datafile)) {
          callback();
          return;
      }
  
      // This (user_data_index) is defined in data_index.js
      var data = window.user_data_index[datafile];
      var newscript = document.createElement('script');
  
      if (newscript.readyState) {
          newscript.onreadystatechange = function() {
              if (this.readyState == 'complete' || this.readyState == 'loaded') {
                  this.onreadystatechange = null;
                  callback();
              }
          };
      } else {
          newscript.onload = function() {
              callback();
          };
      }
  
      newscript.type = 'text/javascript';
      newscript.src = encodeURIComponent(data);
      newscript.charset = 'utf-8';
      document.getElementsByTagName("head")[0].appendChild(newscript);
  
      // Keep track that this file has already been loaded.
      currentlyloaded.push(datafile);
  }
  
  /**
   * Checks to see if the datafile has already been loaded onto the page or not.
   *
   * @param  {String} datafile The file entry we are checking to see if it is already loaded.
   * @return {Boolean} True if already loaded otherwise false.
   */
  function fileIsLoaded(datafile) {
      for (var index in currentlyloaded) {
          if (currentlyloaded[index] == datafile) {
              return true;
          }
      }
      return false;
  }
  
  /**
   * Adds the loaded data to the main content area of the page.
   *
   * @param {Object} data  Data to be added to the main content area of the page.
   * @param {String} title Title for the content area.
   */
  function addFileDataToMainArea(data, title) {
      var dataarea = window.$('[data-main-content]');
      while (dataarea[0].firstChild) {
          dataarea[0].removeChild(dataarea[0].firstChild);
      }
      var htmldata = makeList(data);
  
      var areatitle = document.createElement('h2');
      areatitle.innerHTML = title;
      dataarea[0].appendChild(areatitle);
  
      var maincontentlist = document.createElement('div');
      maincontentlist.innerHTML = htmldata;
      dataarea[0].appendChild(maincontentlist.firstChild);
  }
  
  /**
   * Creates an unordered list with the json data provided.
   *
   * @param  {Object} jsondata The json data to turn into an unordered list.
   * @return {String} The html string of the unordered list.
   */
  function makeList(jsondata) {
      var html = '<ul>';
      for (var key in jsondata) {
          html += '<li>';
          if (typeof jsondata[key] == 'object') {
              html += key;
              html += makeList(jsondata[key]);
          } else {
              html += key + ': ' + jsondata[key];
          }
          html += '</li>';
      }
      html += '</ul>';
      return html;
  }
  
  window.$(document).ready(function() {
      window.$('[data-var]').click(function(e) {
          e.preventDefault();
          e.stopPropagation();
          handleClick(window.$(this));
      });
  });
  