﻿/*
	This plugin is written by Aidan Thomas.
	
	It is to be used to create the drop down animation (showing and hiding of sub menus) with the Commerce Vision Customer Self Service application.
	
	It is to be used in conjunction with a style sheet to complete the look of the menu.
	The script adds a 'hover' class to the parent item of a link so the current menu navigation can be highlighted.
	
	The menu it multi level, i.e. is not hard coded to only show parent items with a drop down, you can use and number of menu level fly outs.
	
	The plugin accepts the following parameters

	timeout: (numeric) - this controls the amount of time after a user leaves a menu item before it hides. (default value is '500')
	
	headerElement: (text)  - this controls the DOM element to look for that contains menu items. (default value is 'ul')
	
	contentElement: (text) - this controls the DOM element the contains the menu links - note that it can also contain more header elements. (default 'ul')
	
	topLevelHoverShowThirdLevel: (true/false) - setting this to true will show the third level of the menu as well as the second when hovering over the top level. (default 'false')

	numberOfLevels: (numeric) - how many levels the menu has. (default is '3')
	
	//The parameters are passed as the second variable to the function between {} separated by a comma, e.g. $.CSSDropDownMenu('message',{parameterName1: parameterValue1,{parameterName2: parameterValue2});
	
	// EXAMPLE USAGE //
	
	Using Defaults:
		$.CSSDropDownMenu();
		
	Setting The Timeout:
		$.CSSDropDownMenu({timeout: 1000});
		
	Changing The Menu DOM Elements:
		$.CSSDropDownMenu({headerElement: 'div',contentElement: 'div'});
*/

(function($)
{
	$.fn.CSSDropDownMenu = function(settings)
	{
		var containers  = this; // The jQuery objects that contain the drop down menu
		var dropDownCloseTimer = 0;
		var flyOutCloseTimer = 0;
		var closeTimers = new Array();
		var parentHighlighted = 0;
		settings = $.extend(
			{
				timeout: 500,
				headerElement: "ul",
				contentElement: "li",
				topLevelHoverShowThirdLevel: false,
				numberOfLevels: 3
			}, settings);
		
		var unSelectObjects = function(obj)
		{
			$(obj).children(settings.contentElement).each(function()
				{
					if($(this).hasClass('hover'))
					{
						$(this).removeClass('hover');
						$(this).children(settings.headerElement).css('visibility', 'hidden');
						if(settings.topLevelHoverShowThirdLevel)
							$(this).children(settings.headerElement).children(settings.contentElement).children(settings.headerElement).css('visibility', 'hidden');
					}
					if($(this).children(settings.headerElement).children(settings.contentElement).length > 0)
						unSelectObjects($(this).children(settings.headerElement));
				});
		}
		var clearTimers = function(timer,start)
		{
			for(var i = start; i < timer.length ; i++)
				closeTimers[i] = clearTimer(closeTimers,i);
		}
		var clearTimer = function(timer,num)
		{
			if(closeTimers[num])
			{
				window.clearTimeout(closeTimers[num]);
				return null;
			}
			else
				return null;
		}
		var getUrlVariables = function()
		{
			var vars = [], hash;
			var hashes = window.location.href.slice(window.location.href.indexOf('?') + 1).split('&');
			for(var i = 0; i < hashes.length; i++)
			{
				hash = hashes[i].split('=');
				vars.push(hash[0].toLowerCase());
				vars[hash[0].toLowerCase()] = hash[1];
			}
			return vars;
		}
		var getUrlVariable = function(name)
		{
			return getUrlVariables()[name.toLowerCase()];
		}
		var getCurrentPage = function()
		{
			var page = window.location.pathname.toLowerCase().substring(1);
			var param = '';
			if(page.toLowerCase() == 'custompage.aspx')
				param = getUrlVariable('CustomPage').toLowerCase();
			if(page.toLowerCase() == 'productdisplay.aspx' && getUrlVariable('Category'))
				param = getUrlVariable('Category').toLowerCase();
			if(param != 'undefined' && param != '')
				page = page + param;
			return page
		}
		// Loop through the jQuery objects (these are the elements that contain our drop down menu items).
		return containers.each(function()
		{
			for(var i = 0; i < settings.numberOfLevels; i++)
				closeTimers[i] = 0;
			
			var topLevelContentElems = $(this).children(settings.headerElement).children(settings.contentElement).each(function()
				{
					// Add the 'Selected' class to the parent node when on a page within its menu structure
					if(parentHighlighted == 0)
					{
						var parentNode = $(this);
						$(this).find('a').each(function()
							{
								if(getCurrentPage() != '')
								{
									if($(this).attr('href').toLowerCase().indexOf(getCurrentPage()) > -1)
									{
										parentHighlighted = 1;
										$(parentNode).addClass('Selected');
									}
								}
							});
					}
					$(this).hover(function()
						{
							closeTimers[0] = clearTimers(closeTimers,0);
							unSelectObjects($(this).parent());
							$(this).addClass('hover');
							$(this).children(settings.headerElement).css('visibility', 'visible');
							if(settings.topLevelHoverShowThirdLevel)
								$(this).children(settings.headerElement).children(settings.contentElement).children(settings.headerElement).css('visibility', 'visible');
							else
							{
								var secondLevelHeaderElements = $(this).children(settings.headerElement).each(function()
									{
										$(this).children(settings.contentElement).each(function()
											{
												$(this).hover(function()
													{
														if(closeTimers[1])
															closeTimers[1] = clearTimers(closeTimers,1);
														unSelectObjects($(this).parent());
														$(this).addClass('hover');
														$(this).children(settings.headerElement).css('visibility', 'visible');
													},function()
													{
														var flyOutCloseFunction = function()
														{
															if(closeTimers[1])
																unSelectObjects(secondLevelHeaderElements);
														}
														closeTimers[1] = setTimeout(flyOutCloseFunction, settings.timeout);
													});
											});
									});
							}
						},function()
						{
							var dropDownCloseFunction = function()
							{
								unSelectObjects(topLevelContentElems.parent());
							}
							closeTimers[0] = setTimeout(dropDownCloseFunction, settings.timeout);
						});
				});
		});
	};
})(jQuery);

