var menuOver = false;
var menuTimeout;
var menuObject;

var logo;
var homeTab;
var menuTab;
var jaredsTab;
var buzzworthyTab;
var cardTab;
var findASubway;
var isLTEIE6;

$(document).ready(function(){
	
	createDropMenuContainer();
	
	isLTEIE6 = ($.browser.msie && $.browser.version < 7) ? true : false;
	
	logo = {
		tab: $('#logo'),
		positionOff: "0px 0px",
		positionOn: "0px -94px",
		positionOnLeft: "0px -94px",
		positionOnRight: "0px -94px",
		dropMenuOffsetX: 0
	}
	
	homeTab = {
		tab: $('#topnav_home > a'),
		positionOff: "0px 0px",
		positionOn: "0px -36px",
		positionOnLeft: "0px -72px",
		positionOnRight: "0px -108px",
		dropMenuOffsetX: 0,
		menuWidth: "0px"
	}
	
	menuTab = {
		tab: $('#topnav_menu > a'),
		positionOff: "-59px 0px",
		positionOn: "-59px -36px",
		positionOnLeft: "-59px -72px",
		positionOnRight: "-59px -108px",
		dropMenuOffsetX: 0,
		menuWidth: (isLTEIE6) ? "720px" : "660px"
	}
	
	jaredsTab = {
		tab: $('#topnav_jared > a'),
		positionOff: "-176px 0px",
		positionOn: "-176px -36px",
		positionOnLeft: "-176px -72px",
		positionOnRight: "-176px -108px",
		dropMenuOffsetX: 0,
		menuWidth: (isLTEIE6) ? "750px" : "700px"
	}
	
	jaredsTab.dropMenuOffsetX = jaredsTab.tab.offset().left - homeTab.tab.offset().left + 5;
	
	buzzworthyTab = {
		tab: $('#topnav_buzz > a'),
		positionOff: "-292px 0px",
		positionOn: "-292px -36px",
		positionOnLeft: "-292px -72px",
		positionOnRight: "-292px -108px",
		dropMenuOffsetX: 0,
		menuWidth: (isLTEIE6) ? "830px" : "750px"
	}
	
	buzzworthyTab.dropMenuOffsetX = buzzworthyTab.tab.offset().left - homeTab.tab.offset().left + 5;
	
	cardTab = {
		tab: $('#topnav_card > a'),
		positionOff: "-385px 0px",
		positionOn: "-385px -36px",
		positionOnLeft: "-385px -72px",
		positionOnRight: "-385px -108px",
		dropMenuOffsetX: 0,
		menuWidth: (isLTEIE6) ? "250px" : "260px"
	}
	
	cardTab.dropMenuOffsetX = 0;
	
	findASubway = {
		tab: $('#find_subway'),
		positionOff: "0px 0px",
		positionOn: "0px -35px",
		positionOnLeft: "0px -35px",
		positionOnRight: "0px -35px",
		dropMenuOffsetX: 0,
		menuWidth: "720px"
	}
	
	// Home__________________________________________
	
	$('#topnav_home').bind("mouseover", function(e){
		
		closeMenu();
		
		$('#topnav_home > a').css("background-position", homeTab.positionOn);
		$('#topnav_menu > a').css("background-position", menuTab.positionOnRight);
		$('#logo').css("background-position", logo.positionOn);
		
	});
	
	$('#topnav_home').bind("mouseout", function(e){
		
		$('#topnav_home > a').css("background-position", homeTab.positionOff);
		$('#topnav_menu > a').css("background-position", menuTab.positionOff);
		$('#logo').css("background-position", logo.positionOff);
		
	});
	
	// Menu__________________________________________
	
	$('#topnav_menu').bind("mouseover", function(e){
		
		closeMenu();
		
		$('#topnav_menu > a').css("background-position", menuTab.positionOn);
		$('#topnav_home > a').css("background-position", homeTab.positionOnLeft);
		$('#topnav_jared > a').css("background-position", jaredsTab.positionOnRight);
		
		menuObject = {
			currentTab: menuTab,
			tabOnLeft: homeTab,
			tabOnRight: jaredsTab
		}
		
		menuOver = true;
		showDropMenu($('#topnav_menu > a'));
		
	});
	
	$('#topnav_menu').bind("mouseout", function(e){
		
		$('#topnav_menu > a').css("background-position", menuTab.positionOff);
		
		$('#topnav_home > a').css("background-position", homeTab.positionOff);
		$('#topnav_jared > a').css("background-position", jaredsTab.positionOff);
		
		menuOver = false;
		hideDropMenu();
		
	});
	
	// Jareds 10th__________________________________________
	
	$('#topnav_jared').bind("mouseover", function(e){
		
		closeMenu();
		
		$('#topnav_jared > a').css("background-position", jaredsTab.positionOn);
		
		$('#topnav_menu > a').css("background-position", menuTab.positionOnLeft);
		$('#topnav_buzz > a').css("background-position", buzzworthyTab.positionOnRight);
		
		menuObject = {
			currentTab: jaredsTab,
			tabOnLeft: menuTab,
			tabOnRight: buzzworthyTab
		}
		
		menuOver = true;
		showDropMenu($('#topnav_jared > a'));
		
	});
	
	$('#topnav_jared').bind("mouseout", function(e){
		
		$('#topnav_jared > a').css("background-position", jaredsTab.positionOff);
		
		$('#topnav_menu > a').css("background-position", menuTab.positionOff);
		$('#topnav_buzz > a').css("background-position", buzzworthyTab.positionOff);
		
		menuOver = false;
		hideDropMenu();
		
	});
	
	// Buzzworthy__________________________________________
	
	$('#topnav_buzz').bind("mouseover", function(e){
		
		closeMenu();
		
		$('#topnav_buzz > a').css("background-position", buzzworthyTab.positionOn);
		
		$('#topnav_jared > a').css("background-position", jaredsTab.positionOnLeft);
		$('#topnav_card > a').css("background-position", cardTab.positionOnRight);
		
		menuObject = {
			currentTab: buzzworthyTab,
			tabOnLeft: jaredsTab,
			tabOnRight: cardTab
		}
		
		menuOver = true;
		showDropMenu($('#topnav_buzz > a'));
		
	});
	
	$('#topnav_buzz').bind("mouseout", function(e){
		
		$('#topnav_buzz > a').css("background-position", buzzworthyTab.positionOff);
		
		$('#topnav_jared > a').css("background-position", jaredsTab.positionOff);
		$('#topnav_card > a').css("background-position", cardTab.positionOff);
		
		menuOver = false;
		hideDropMenu();
		
	});
	
	// MySubway Card__________________________________________
	
	$('#topnav_card').bind("mouseover", function(e){
		
		closeMenu();
		
		$('#topnav_card > a').css("background-position", cardTab.positionOn);
		
		$('#topnav_buzz > a').css("background-position", buzzworthyTab.positionOnLeft);
		$('#find_subway').css("background-position", findASubway.positionOnRight);
		
		menuObject = {
			currentTab: cardTab,
			tabOnLeft: buzzworthyTab,
			tabOnRight: findASubway
		}
		
		menuOver = true;
		
		showDropMenu($('#topnav_card > a'));
		
	});
	
	$('#topnav_card').bind("mouseout", function(e){
		
		$('#topnav_card > a').css("background-position", cardTab.positionOff);
		
		$('#topnav_buzz > a').css("background-position", buzzworthyTab.positionOff);
		$('#find_subway').css("background-position", findASubway.positionOff);
		
		menuOver = false;
		hideDropMenu();
		
	});
	
	$('#topnav_drop_menu').bind("mouseover", function(e){
		
		$('#status').html('over');
		killMenuTimeout();
		menuOver = true;
		
		menuObject.currentTab.tab.css("background-position", menuObject.currentTab.positionOn);
		menuObject.tabOnLeft.tab.css("background-position", menuObject.tabOnLeft.positionOnLeft);
		menuObject.tabOnRight.tab.css("background-position", menuObject.tabOnRight.positionOnRight);
		
	});

	$('#topnav_drop_menu').bind("mouseout", function(e){
		
		menuOver = false;
		hideDropMenu();
		
	});

});

function createDropMenuContainer()
{
	
	var ext = ($.browser.msie && $.browser.version < 7) ? 'gif' : 'png';
    var directory = 'http://media.subwayfreshbuzz.com/local/global/images';
	var html = '<div id="topnav_drop_menu" class="drop_menu_content_off"> \
                  <table id="topnav_drop_menu_table" style="border-collapse:collapse; width: 100%" border="0" cellpadding="0" cellspacing="0"> \
                    <tbody> \
                      <tr> \
					  	<td valign="top" colspan="2" style="background: url(' + directory + '/drop_TL_corner.' + ext + ') 0px 0px repeat-x; width: 27px; height: 10px; overflow:hidden;"  ></td>\
                        <td valign="top" style="background:url(' + directory + '/drop_top_tint.' + ext + ') 0 0 repeat-x; height:10px; overflow:hidden;"></td> \
						<td valign="top" colspan="2" style="background: url(' + directory + '/drop_TR_corner.' + ext + ') 0px 0px repeat-x;  width:27px; height: 10px; overflow:hidden;" ></td>\
					  </tr> \
                      <tr> \
                        <td valign="top" class="tm" style="background: url(' + directory + '/drop_side_shadow_left.' + ext +') 0px 0px repeat-y;  width:7px; overflow:hidden;" >&nbsp;</td>\
						<td valign="top" class="tm" style="background: #0b9a4d url(' + directory + '/short-bg_gradient.gif) 0px 0px repeat-x;  width:20px; overflow:hidden;" ><div id="glare_left">&nbsp;</div></td>\
						<td id="topnav_drop_menu_content_td" style="vertical-align:top;" valign="top"> \
                          <div id="topnav_drop_menu_content"></div><div class="clear"></div>\
                        </td> \
						<td valign="top" class="tm" style="background: #0b9a4d url(' + directory + '/short-bg_gradient.gif) 0px 0px repeat-x;  width:20px; overflow:hidden;" >&nbsp;</td>\
						<td valign="top" class="tm" style="background: url(' + directory + '/drop_side_shadow_right.' + ext +') 0px 0px repeat-y;  width:7px; overflow:hidden;" >&nbsp;</td>\
                      </tr> \
                      <tr> \
                        <td valign="top" class="bl" colspan="2" style="background:url(' + directory + '/short-drop_BL_corner.' + ext + ') 0px 0px no-repeat; width:27px; height:26px; overflow:hidden;" /> \
                        <td valign="top" class="bm" style="background:url(' + directory + '/short-drop_bottom.' + ext + ') 0px 0px repeat-x; height:26px; overflow:hidden;" /> \
                        <td valign="top" class="br" colspan="2" style="background:url(' + directory + '/short-drop_BR_corner.' + ext + ') 0px 0px no-repeat; width:27px; height:26px; overflow:hidden;" /> \
                      </tr> \
                    </tbody> \
                  </table> \
				  <div id="shadow_block">&nbsp;</div>\
                </div>';
				
	$('body').append(html);
	
}

function closeMenu()
{
	
	killMenuTimeout();
	
	var css = {
	'display':'none'
	};
	
	$('#topnav_drop_menu').css(css);
	$('#topnav_drop_menu_content').html('');
	
	if(typeof(menuObject) != 'undefined')
	{
		
		menuObject.currentTab.tab.css("background-position", menuObject.currentTab.positionOff);
		menuObject.tabOnLeft.tab.css("background-position", menuObject.tabOnLeft.positionOff);
		menuObject.tabOnRight.tab.css("background-position", menuObject.tabOnRight.positionOff);
		
		
	}
	
	menuOver = false;
	
}

function showDropMenu(element)
{
	
	killMenuTimeout();
	
	menuOver = true;
	
	if(typeof(menuObject) != 'undefined')
	{
		
		menuObject.currentTab.tab.css("background-position", menuObject.currentTab.positionOn);
		menuObject.tabOnLeft.tab.css("background-position", menuObject.tabOnLeft.positionOnLeft);
		menuObject.tabOnRight.tab.css("background-position", menuObject.tabOnRight.positionOnRight);
		
	}
	
	var obj = eval('(' + $(element).attr("rel") + ')');
	
	var dropMenuX = $(element).offset().left - 7;
	
	if(menuObject.currentTab.dropMenuOffsetX > 0)
	{
		dropMenuX -= menuObject.currentTab.dropMenuOffsetX;
	}
	
	
	$('#shadow_block').css("width", $(element).width());
	$('#shadow_block').css("left", menuObject.currentTab.dropMenuOffsetX + 7);
	
	var css = {
		'display':'block',
		'left': dropMenuX,
		'top': $(element).offset().top + 25
	};
	
	$('#topnav_drop_menu_content').html($('#' + obj.content).html());
	$('#topnav_drop_menu').css(css);
	$('#topnav_drop_menu_table').css("width", menuObject.currentTab.menuWidth);
	
}

function hideDropMenu()
{
	
	if(menuOver) return;
	
	menuTimeout = setTimeout(closeMenu, 300);
	
}

function killMenuTimeout()
{
	
	clearTimeout(menuTimeout);
	
}