var $ = document, el = function(i){ return $.getElementById(i) }, ie = '\v'=='v';

function fadeIn(e, o, d) {
	setTimeout( function(){
		e.style.display = "block";
		if ( o < 1.0 ) {
			o = o + 0.02;
			if ( ie ) e.style.filter = 'alpha(opacity=' + o*100 + ')';
			else e.style.opacity = o; 
			setTimeout( function(){ fadeIn(e, o, 0) }, 5 );
		}
	}, d);
}

function fadeOut(e, o, d) {
	setTimeout( function(){
		if ( o > 0.02 ) {
			o = o - 0.02;
			if ( ie ) e.style.filter = 'alpha(opacity=' + o*100 + ')';
			else e.style.opacity = o; 
			setTimeout( function(){ fadeOut(e, o, 0) }, 10 );
		} else e.style.display = "none";
	}, d);
}



var main_nav_tabs = ["adv","pub","ind","tech","about"];

function resetMainNav() {
	
	// hide any shown dropdowns
	for ( var i in main_nav_tabs ) if ( el( main_nav_tabs[i] + "_dd" ).style.display = "block" ) 
		el( main_nav_tabs[i] + "_dd" ).style.display = "none";

	// show any hidden vertical bars
	var vbars = el( "main_nav_tabs" ).getElementsByTagName("LI");
	for ( var i in vbars ) if ( vbars[i].className == "vbar" ) 
		vbars[i].getElementsByTagName("h2")[0].style.color = "#EDEDED";
}

function showDropdown(pre) {

	resetMainNav();

	// get relevant elements
	var tab = el( pre + "_tab" );
	var dd = el( pre + "_dd" );
	var dds = dd.style;
	var dd_spacer = dd.getElementsByTagName("DIV")[0];
	var dds_s = dd_spacer.style;
	var dds_a_s = dd_spacer.getElementsByTagName("A")[0].style;
	
	// set dropdown element sizes, show dropdown
	dds_s.height = dds_a_s.height = ( tab.offsetHeight + 15 ) + "px";
	dds_s.width = dds_a_s.width = ( tab.offsetWidth + (pre=="about" ? 29 : 11) ) + "px";
	dds.left = ( tab.offsetLeft - (pre=="about" ? 16 : 7) ) + "px";
	dds.top = ( tab.offsetTop - 10 ) + "px";
	dds.display = "block";
	
	// hide (turn white) vertical bars before and/or after tab
	if ( pre != "about" ) {
		if ( tab.parentNode.previousSibling && tab.parentNode.previousSibling.previousSibling ) tab.parentNode.previousSibling.previousSibling.getElementsByTagName("h2")[0].style.color = "#FFFFFF";
		if ( tab.parentNode.nextSibling && tab.parentNode.nextSibling.nextSibling ) tab.parentNode.nextSibling.nextSibling.getElementsByTagName("h2")[0].style.color = "#FFFFFF";;
	}

	// position dropdown links
	var dd_links = dd.getElementsByTagName("DIV")[1];
	dd_links_s = dd_links.style;
	dd_links_s.top = ( parseInt(dds_s.height) + 1 ) + "px";
	if ( tab.id.indexOf("gallery") > -1 ) dd_links_s.left = ( parseInt(dds_s.width) - dd_links.offsetWidth + 2 ) + "px";

	// hide dropdown on mouseout
	if ( dd.addEventListener ) {
		dd.addEventListener( "mouseout", hideDropdown, false );
	} else if ( dd.attachEvent ) {
		dd.attachEvent ( "onmouseout", hideDropdown );
	}
}

function hideDropdown(e) {
	try {
		// get target element, if within currently shown dropdown, stop
		if (!e) var e = window.event;
		var relTarg = e.relatedTarget || e.toElement;
		if (relTarg.className == "tab_spacer" || relTarg.className == "tab_links" || relTarg.nodeName == "UL" || relTarg.nodeName == "LI" || relTarg.nodeName == "A" ) return false;
		
		resetMainNav();
	} catch(e) {}
}



var adv_tabs = ["default", "videoad", "videomedia", "working"];
var pub_tabs = ["default", "videoad", "xspotgeo", "working"];
var tech_tabs = ["default", "videoad", "engine", "console"];

function swapContent(pre) {

	window.location.hash = pre;

	if ( el( "lower_r_content" ) && el( "lower_r_content" ).style.display == "none" ) {
		el( "lower_r_content" ).style.display = "block";
		el( "lower_r_content" ).style.height = "460px";
	}

	var tabs;
	if ( window.location.href.indexOf("advertisers") > -1 ) tabs = adv_tabs;
	else if ( window.location.href.indexOf("publishers") > -1 ) tabs = pub_tabs;
	else if ( window.location.href.indexOf("technology") > -1 ) tabs = tech_tabs;
	
	for ( var i in tabs ) {
		if ( el( "lower_content_" + tabs[i] ) && el( "lower_content_" + tabs[i] ).style.display == "block" ) el( "lower_content_" + tabs[i] ).style.display = "none";
	}
	
	var divs = el("lower_tabs").getElementsByTagName("DIV");
	for ( var i in divs )
		if ( divs[i].className && divs[i].className.indexOf("active") > -1 && divs[i].className.indexOf("inactive") < 0 )
			divs[i].className = divs[i].className.replace("active", "inactive");
	try { el( pre ).className = el( pre ).className.replace("inactive", "active"); } catch(e) {}
	
	el( "lower_content_" + pre ).style.display = "block";
	el( "lower_content" ).style.height = el( "lower_content_" + pre ).style.height;
	el( "lower_bg" ).style.height = ( parseInt( el( "lower_content_" + pre ).style.height ) + 2 ) + "px";
}