﻿ var availCategories=new Array("Jewelry","Watches","Apparel & Accessories", "Beauty", "House & Home", "Computers & Electronics", "Coins", "Clearance", "Auctions");
				var isFlyoutVisible = new Array(false,false,false,false,false,false,false,false,false); 
				var navTimeout;
					
				function SetFlipOut(itemName)
                {
                    if(!isFlyoutVisible[itemName.substring(14)-1])
                    {
			        //change main immage
        	        if(selectedCategory ==availCategories[itemName.substring(14)-1])
			        {		
				        document.getElementById(itemName).className = itemName+ '_over';
			        }
			        else
			        {
				        document.getElementById(itemName).className = itemName + '_out';
			        }
					
			        // hide the flyout 
			        document.getElementById(itemName+'_subNav').style.display = 'none';
                    if(navigator.appName == "Microsoft Internet Explorer")//and Iframe
			            document.getElementById('globalNav_subNav_iframe').style.display = 'none';
			        
			        }
                }
				
				function SetFlipIn(itemName)
                { 
                
                    if(isFlyoutVisible[itemName.substring(14)-1])
                    {
					//change main image
					document.getElementById(itemName).className = itemName + '_over';

					//ShowIframe
					if(navigator.appName == "Microsoft Internet Explorer")
					    ShowIframe(itemName);
					    
					// Show the flyout 
					document.getElementById(itemName+'_subNav').style.display = 'block';
					}
					
                }
            function ShowIframe(itemName)
			{
			    $('globalNav_subNav_iframe').style.width = $(itemName+'_subNav').getWidth() + 'px';
			    $('globalNav_subNav_iframe').style.height = $(itemName+'_subNav').getHeight() + 'px';
	            $('globalNav_subNav_iframe').style.top = $(itemName+'_subNav').offsetTop + $('globalNav').offsetTop;
			    $('globalNav_subNav_iframe').style.left = $(itemName+'_subNav').offsetLeft + $('globalNav').offsetLeft;   
			    $('globalNav_subNav_iframe').style.display = 'block';
			}
                 
                function SetFlipOutTime(itemName)
                {
                    isFlyoutVisible[itemName.substring(14)-1] = false; 
                    setTimeout("SetFlipOut('"+itemName + "');", 20);
                }
               
                function SetFlipInTime(itemName)
                {
                    clearTimeout(navTimeout);
                    isFlyoutVisible[itemName.substring(14)-1] = true; 
                    navTimeout =  setTimeout("SetFlipIn('"+itemName + "');", 20);
                }
				
                var callbackEntering = function(event, itemName) 
                {   
                    SetFlipInTime(itemName); 
                };
                
                var callbackLeaving = function(event, itemName) 
                {      
                    SetFlipOutTime(itemName)
                };
								
			    Element.addMethods({
                onHover: function(element, callbackOver, callbackOut) 
                  {
                    return $(element).observe('mouseover', callbackOver).observe('mouseout', callbackOut);
                  }
                });
				
				var SetupSubNav = function()
				{
				    selectedCategory = selectedCategory.replace(/\+/g,' ')
				    
					for(var i =0; i<availCategories.length; i++)
					{
    					var itemName = 'globalNav_shop0'+(i+1); 
	
						$(itemName+ '_subNav').onHover(callbackEntering.bindAsMouseEnter(null, itemName), callbackLeaving.bindAsMouseLeave(null, itemName)); //set flyout mouseover
						
						if(availCategories[i] == selectedCategory)//set selected image
						    document.getElementById(itemName).className = itemName + '_over';
						    
						//fix for overflow of flyouts.  The 966 is to verify that the getwidth() is working correctly since it sometimes wont in safari		
					    if(($(itemName+'_item').offsetLeft+$(itemName+'_subNav').getWidth() > 966 && $('globalNav').getWidth() == 966)) 
						    $(itemName+'_subNav').style.left = ($(itemName+'_item').getWidth() + $(itemName+'_item').offsetLeft - $(itemName+'_subNav').getWidth()) + "px";  
								    
		           }
		           
			}
			