var hostPrefix = (("https:" == document.location.protocol) ? "https://" : "http://");

function configureNav(){
	var nav = {"items":[	
											
					{"key":"eyes",
					"dir":"/Artificial_Eyes/",
					"img":"_artificial_eyes.png",
					"alt":"Artificial Eyes",
					"title":"Learn about artificial eyes",
					"link":"http://www.ericksonlabs.com/v/Artificial_Eyes/artificial_eyes.asp"},	
											
					{"key":"lab",
					"dir":"/About_Our_Lab/",
					"img":"_about_our_lab.png",
					"alt":"About Our Lab",
					"title":"Explore our facility",
					"link":"http://www.ericksonlabs.com/v/About_Our_Lab/ocularists.asp"},
					
					{"key":"store",
					"dir":"/default.asp",
					"img":"_products.png",
					"alt":"Products",
					"title":"Shop our online store",
					"link":"http://www.ericksonlabs.com/default.asp"},
					
					{"key":"home",
					"dir":"/",
					"img":"_welcome.png",
					"alt":"Welcome",
					"title":"Return to the home page",
					"link":"http://www.ericksonlabs.com/"}
					]
				};
	
	//SIDE NAV CODE - set live state based on URL
	$.each($("#side_nav a"), function(i,item){
		
		if (window.location.href.indexOf(item.href) != -1) {
			$(this).children(":first-child").attr('src',function(){
				var myImg = this.src;
				var pos = myImg.lastIndexOf('.');
				return myImg.substr(0,pos)+'-live.png' 
			});
			$(this).children(":first-child").addClass("live")
										   .unbind("mouseover")
										   .unbind("mouseout");
		}

	});
	$('#side_nav img:not(.live)').imghover({suffix: '-hover'});
	
	//TOP NAV & BLADES CODE - set correct live states	
	
	
	//look into each nav item and key off it's "directory" value
	$.each(nav.items, function(i,item){
        if (window.location.href.indexOf(item.dir) != -1) {
        	current = i;

			//if we're in the products section, we can't key off of the directory
			//so instead, hard-code the "current" val
			if ($("#tab1 img").attr("alt") == "Products") {
				current = 2;
			} else if ($("#tab1 img").attr("alt") == "About Our Lab") {
				current = 1;
			}
			
			//set the first blade
        	$("#tab1 img").attr("src",hostPrefix+"www.ericksonlabs.com/v/images/tabs/tab1"+nav.items[current].img)
						  .attr("alt",nav.items[current].alt)
						  .attr("title",nav.items[current].alt);
			$("#tab1 a").attr("href",nav.items[current].link);
					
			//set the top nav live state correctly
			$("#top_nav_"+nav.items[current].key+" img").attr('src',function(){
				var myImg = this.src;
				var pos = myImg.lastIndexOf('.');
				return myImg.substr(0,pos)+'-hover.png' 
			});
			$("#top_nav_"+nav.items[current].key).addClass("live");

			
			//then set all the subsequent blade values
			(current == 3) ? current=0 : current++;
			
			$("#tab2 img").attr("src",hostPrefix+"www.ericksonlabs.com/v/images/tabs/tab2"+nav.items[current].img)
						  .attr("alt",nav.items[current].alt)
						  .attr("title",nav.items[current].title);
			$("#tab2 a").attr("href",nav.items[current].link);
						  
			(current == 3) ? current=0 : current++;
						  
			$("#tab3 img").attr("src",hostPrefix+"www.ericksonlabs.com/v/images/tabs/tab3"+nav.items[current].img)
						  .attr("alt",nav.items[current].alt)
						  .attr("title",nav.items[current].title);
			$("#tab3 a").attr("href",nav.items[current].link);
			
			(current == 3) ? current=0 : current++;
						  
			$("#tab4 img").attr("src",hostPrefix+"www.ericksonlabs.com/v/images/tabs/tab4"+nav.items[current].img)
						  .attr("alt",nav.items[current].alt)
						  .attr("title",nav.items[current].title);
			$("#tab4 a").attr("href",nav.items[current].link);
        	
        	return false;
        }
    });
    
	//init top nav
	$('#multi-ddm').dropDownMenu({parentMO: 'parent-hover', childMO: 'child-hover1', timer: 0});
	
	//handle mouseover/outs for top nav images
	$('#multi-ddm li:not(.live)').mouseover(function(){
		$('img', this).attr('src',function(){
			var myImg = this.src;
			var pos = myImg.lastIndexOf('.');
			return myImg.substr(0,pos)+'-hover.png' 
		});
		
		//make sure these are visible by forcing the blades to normal, if they got stuck
		unhighlightBlades();
	});
	$('#multi-ddm li:not(.live)').mouseout(function(){
		$('img', this).attr('src',function(){
			var myImg = this.src;
			var pos = myImg.lastIndexOf('-');
			return myImg.substr(0,pos)+'.png';
		});
	});
	
}

//sometimes the tabbed blades get a bit confused about their state.  
//the DOM can't seem to keep up with hovering too fast.  
//calling this function will force them back to their unhighlighted state.
function unhighlightBlades(){
	$("#tab2 img").trigger('mouseout');
	$("#tab3 img").trigger('mouseout');
	$("#tab4 img").trigger('mouseout');
}


$(document).ready(function(){

	//configure defaults for top nav and blades
	configureNav();
	
	if (window.location.href.indexOf("ocularists.asp")!= -1 ||
		window.location.href.indexOf("artificial_eyes.asp")!= -1 ||
		window.location.href.indexOf("default.asp")!= -1 ||
		$("#tab1 img").attr("alt") == "Welcome") {
		
		//animate blades
		$("#tab2").animate(
			{"opacity": "show"}, 
			"fast", "",
			function(){
				$("#tab3").animate(
				{"opacity": "show"}, 
				"fast", "",
				function(){
					$("#tab4").animate(
					{"opacity": "show"}, 
					"fast", "")
				})
			}
	    );	
	} else {
		$('.background_tab').show();
	}
	
    
    //force the blades back down when in the main content area
    $("#main_tab").mouseover(unhighlightBlades);

	//hover the blades
	$('.background_tab img').imghover({suffix: '-hover', fade: 'true', fadeSpeed: 100});
});

//preload top nav images
jQuery.preloadImages = function(){
	for(var i = 0; i<arguments.length; i++){
		jQuery("<img>").attr("src", arguments[i]);
	}
}

$.preloadImages(hostPrefix+"www.ericksonlabs.com/v/images/top_nav/btn_welcome-hover.png", hostPrefix+"www.ericksonlabs.com/v/images/top_nav/btn_artificial_eyes-hover.png", hostPrefix+"www.ericksonlabs.com/v/images/top_nav/btn_about_our_lab-hover.png",hostPrefix+"www.ericksonlabs.com/v/images/top_nav/btn_products-hover.png");


//wait until window is done loading before trying to set the subnavs' widths to equal the images' widths
$(window).load(function() {
	$('#multi-ddm > li').each(function(){
		$('ul', this).css('z-index',100);

		$('ul', this).css('width',$('a img',this).width());
	});
});
