$(document).ready(function(){
	Menu.init();
});

var MENU_IMAGE_PART_SIZE = 575;
var MENU_SWITCH_TIMEOUT = 650;

var Menu = {
	__queue: [],
	__isProsessing: false,
	__topMenu: null,
	__currentID: null,
	
	init: function()
	{
		this.__topMenu = $('#top-menu');
		
		if ( this.__topMenu.length == 0 )
		{
			return;
		}
		
		this.__primary = $('#primary-menu');
		
		$('div.secondary-menu:not(.active)').hide();
		
		var self = this;
		
		var timeoutHandle = null;
		
		var activeItem = $('li.active', this.__primary);
		this.__currentID = activeItem.length ? this.getID(activeItem.get(0)) : null;
		
		$('li', this.__primary)
			.mouseover(function(){
				var li = this;
				timeoutHandle = setTimeout(
					function(){
						self.openPrimaryItem(self.getID(li));
					},
					MENU_SWITCH_TIMEOUT
				);
			})
			.mouseout(function(){
				clearTimeout(timeoutHandle);
			});
	},
	
	getID: function(item)
	{
		return item.id.substring(5);
	},
	
	openPrimaryItem: function(id)
	{
		this.__queue.push(id);
		
		if ( !this.__isProsessing )
		{
			this.processQueue();
		}
	},
	
	processQueue: function()
	{
		this.__isProsessing = this.__queue.length > 0;
		if ( this.__isProsessing )
		{
			var id = this.__queue.shift();
			this.openSecondaryMenu(id);
		}
	},
	
	openSecondaryMenu: function(id)
	{
		if ( this.__currentID == id )
		{
			this.processQueue();
			return;
		}
		
		var diff = this.__currentID - id;
		var absDiff = Math.abs(this.__currentID - id);
		var timeMultiplier = 1 + ( Math.log(absDiff) / 2 );
		var time = 500 * timeMultiplier;
		
		var pos = id * -MENU_IMAGE_PART_SIZE;
		this.__topMenu.animate({backgroundPosition: pos + 'px'}, time);
		
		$('li.active', this.__primary).removeClass('active');
		$('a.active', this.__primary).removeClass('active');
		
		var item = 'li#item-' + id;
		$(item).add(item + ' a').addClass('active');
		
		$('div.secondary-menu').removeClass('active');
		
		var visibleMenu = $('.secondary-menu:visible');
		var secondaryMenu = $('#secondary-menu-' + id);
		
		var self = this;
		
		var showSecondaryMenu = function()
		{
			secondaryMenu
				.addClass('active')
				.show(
					'slide',
					{direction: diff > 0 ? 'left' : 'right'},
					250,
					function()
					{
						self.__currentID = id;
						self.processQueue();
					}
				);
		};
		
		if ( visibleMenu.length == 0 )
		{
			showSecondaryMenu();
		}
		else
		{
			visibleMenu.hide(
				'slide',
				{direction: diff > 0 ? 'right' : 'left'},
				250,
				showSecondaryMenu
			);
		}
	},
	
	setProjectsItemActive: function()
	{
		var projectsItem = $('.secondary-menu .projects');
		if ( projectsItem.hasClass('active') )
		{
			projectsItem.removeClass('active');
			$('.secondary-menu .opdrachtgevers').addClass('active');
		}
	}
};