jQuery(document).ready(function() {

   var menuElements = jQuery('#menu li a');
   var paragraphs   = jQuery('#content > div');
   var arrow        = jQuery('#arrow');
   var objects      = [];

   function whereAreWe(objects) {
       var theRightKey;

       jQuery.each(objects, function(i, obj) {
           var offsetFromTop = jQuery(obj.paragraph).offset().top;
           var hitArea = jQuery(window).height() / 40;
           var scrollTop = jQuery(window).scrollTop();
           if ((offsetFromTop - scrollTop) < hitArea) theRightKey = i;
       });

       return theRightKey;
   }

   function highlightThis(key, objects, arrow) {
       jQuery.each(objects, function(i, obj) {
           jQuery([obj.menuElement, obj.paragraph]).removeClass('active');
       });

       jQuery([objects[key].menuElement, objects[key].paragraph]).addClass('active');
       jQuery(arrow).css('background-position', 'center ' + objects[key].arrowPosition + 'px');
   }

   jQuery.each(menuElements, function(i) {
       objects.push({
           menuElement: menuElements[i],
           paragraph: paragraphs[i],
           arrowPosition: i * 19
       });
   });

   var timer = setInterval(function() {
       highlightThis(whereAreWe(objects), objects, arrow);
   }, 200);
   
   jQuery('#menu li a').click(function() {
       jQuery('html,body').animate({scrollTop: jQuery(this.hash).offset().top}, "slow", "easeOutQuart");
   });
});

