﻿$(function(){
	var activityPos;
	var navigationBar = $('#top');

	var enterTimer;
	var hoverTimer;
	var rollbackTimer;

	var precisionMove = false;

	$(navigationBar)
	.mouseenter(function(e){
		precisionMove = false;
		enterTimer = setTimeout(function(){
				navigationBar.stop();
		}, 250)
	})
	.mousemove(function(e){
		var el = this;

		resetTimer(hoverTimer);
		resetTimer(rollbackTimer);

		if(precisionMove){
			moveActivityTo(e.pageX, navigationBar, 0);
		}else{
			hoverTimer = setTimeout(function(){
				moveActivityTo(e.pageX, navigationBar, null, function(){precisionMove = true});
			}, 500)
		}
	})
	.mouseleave(function(e){
		resetTimer(enterTimer);
		resetTimer(hoverTimer);
		resetTimer(rollbackTimer);

		precisionMove = false;

		rollbackTimer = setTimeout(function(){
			moveActivityTo(activityPos, navigationBar, null, function(){activityPos = getActivityPos(navigationBar)})
		}, 1000)
	});

	moveActivityTo(getElementPoint(getCurrentSection()), navigationBar, null, function(){activityPos = getActivityPos(navigationBar)});
	$(window).resize(function() {
		resetTimer(hoverTimer);
		resetTimer(rollbackTimer);

		precisionMove = false;
		navigationBar.stop();

		moveActivityTo(getElementPoint(getCurrentSection()), navigationBar, null, function(){activityPos = getActivityPos(navigationBar)});
	});
});


function resetTimer(timer){
	if(timer) {
		clearTimeout(timer);
		timer = null;
	}
}

function getCurrentSection(){
	var currentSection = $('#navigation li.current:last');
	return currentSection.length > 0 ? currentSection : $('#logo');
}

function getElementPoint(el){
	return el.offset().left + el.width() / 2;
}

function moveActivityTo(pos, bar, duration, callback){
	var imageHalfWidth = 231;
	if(duration == null || duration == 'undefined'){
		var duration = 1000;
	}

	if(typeof(pos) == 'string'){
		pos = parseFloat(/(-?\d+(?:\.\d+)?)/.exec(pos)[1]) + imageHalfWidth;
	}

	var css = {backgroundPosition: pos - imageHalfWidth + 'px 0'};

	if(duration == 0){
		$(bar).css(css);
	}else{
		$(bar).animate(css, duration, callback);
	}
}

function getActivityPos(bar){
	return $(bar).css('backgroundPosition');
}
