/* Tabbed navigation */


var navTabClass; 
var navTabSelectedClass;
var defaultTabId;

var preventDefaultEventonTabSelect = 1; // true==1 stop the url from being updated.	 

function initTab( blok_id ){	

	navTabClass = 'TabNav' + blok_id;
	navTabSelectedClass = 'selectedTab';
	defaultTabId = 'defaultTab' + blok_id;
		
	$$('.'+navTabClass+' li').each ( function (e) { e.observe('click',showTabEvent); } )
		
	showTab($(defaultTabId));	

}



function showTab(e){
    var target, id, liElm, aElm, targetId; 
    elm = $(e);   
    // alert(elm.tagName);
    if (elm.tagName    == 'A' ) {   // in case the anchore link eack clicked
        liElm = elm.parentNode;
        aElm = elm ;
    }  else {   
        liElm = elm;
        aElm = elm.firstDescendant();   
    }
    target = aElm.readAttribute('href').strip();
    liElm.siblings().invoke('removeClassName', navTabSelectedClass); //de-select all tabs
    liElm.addClassName(navTabSelectedClass); // make our new tab selected
    if (target.startsWith('#'))  { //only if the anchor link is within the current document
        targetId = target.substring(1);
        var targetElm = $(targetId);  
        targetElm.siblings().invoke('hide');
        targetElm.show();
        
        var tabName = targetId.substring(0, 5); 
        var revert = targetElm.parentNode.id + "_revert";
        var expand = targetElm.parentNode.id + "_expand";
        var styleOverlay = "";
        if (tabName == "reisa") {
            $$('.fold_open').each(function(el){
                  if (styleOverlay == "") styleOverlay = el.getStyle('display');
            });
            if (styleOverlay == "block")
            {
            	$(revert).parentNode.setStyle({display:'block'});
            } else {
            	if (_AdLinksArray.length > _AdlinksVisible) $(expand).parentNode.setStyle({display:'block'});
            }
        }
    }
}

function showTabEvent(Event) {
    var elm = Event.element(); 
    showTab(elm);    
    if (preventDefaultEventonTabSelect) Event.preventDefault(); 
}

function markEvent(event) { // for debuging events
    var node = Event.element(event); // the node that was clicked on
    node.style.color = "green";
}


function setNewStyleSheet (ss ) { 
    $$('link[rel="stylesheet"]').invoke('remove');
 
        $$('link[rel="stylesheet"]').invoke('remove');
        var attrs = {
            type 	: "text/css",
            href 	: ss,
            rel	:"stylesheet"
        };
 
        var sslink = new Element('link', attrs);
        $$('head').invoke('insert',sslink);

}

/********************************************************/
/* Adlinks overlay related stuff						*/ 
/********************************************************/
// Define and AdLink object used for the overlay
function AdLink(id, name, link, price, priority)
{
	this.Id = id;
	this.Name = name;
	this.Link = link;
	this.ClickPrice = parseFloat(base64Decode(price));
	this.Priority = priority;
	this.Visited = false;
}

var _AdLinksArray = new Array();
var _OverlayAdlinksArray = new Array();

// Sets the current variation as a parameter to all adlinks urls and selects the adlinks
// required by this variation
function SetAdlinksVariation(adlinksTabId, isSecondBlock)
{
	// Set variation in the urls for the current adlink blocks
	jQuery('#' + adlinksTabId + ' a').each(function (index, el) {
		el.href = el.href + '&variation=' + _AdlinksVariation + "&variation_loc=adlinks";
	});
	
	if (!isSecondBlock)
	{
		// Get the adlinks needed for the overlay
		switch(_AdlinksVariation)
		{
			case 1:
				// First 10 Adlinks based on prio; ordered by prio (lowest prio first) 
				_AdLinksArray.sort(function (a, b) { return a.Priority - b.Priority; });
				for(i = 0; i < _AdLinksArray.length; i++)
				{
					if (_OverlayAdlinksArray.length < 10)
					{
						_OverlayAdlinksArray.push(_AdLinksArray[i]);
					}
				}
				break;
			case 2:
				// Max 10 Adlinks; ordered by  price (highest price first)
				// Show only adlinks with prio < 300; if less than 10, complete the list with the suppliers with the highest price 
				_AdLinksArray.sort(function (a, b) { return b.ClickPrice - a.ClickPrice; });
				// Get the highest price click adlinks with prio < 300
				for(i = 0; i < _AdLinksArray.length; i++)
				{
					if (_AdLinksArray[i].Priority < 300 && _OverlayAdlinksArray.length < 10)
					{
						_OverlayAdlinksArray.push(_AdLinksArray[i]);
					}
				}
				// Complete the sequence if needed
				if (_OverlayAdlinksArray.length < 10)
				{
					for(i = 0; i < _AdLinksArray.length; i++)
					{
						if (_AdLinksArray[i].Priority >= 300 && _OverlayAdlinksArray.length < 10)
						{
							_OverlayAdlinksArray.push(_AdLinksArray[i]);
						}
					}
				}
				_OverlayAdlinksArray.sort(function (a, b) { return b.ClickPrice - a.ClickPrice; });
				break;
			case 3:
				// Show suppliers equally spread on 2 rows; the same suppliers in the same order as they're shown in the regular adlink block
				_OverlayAdlinksArray = _AdLinksArray;
				break;
		}
	}
}

// Generate the HTML for the adlinks
function GetAdlinksHtml()
{
	var lHtml = "";
	
	for(i = 0; i < _OverlayAdlinksArray.length; i++)
	{
		lHtml = lHtml +
			'<div class="adlink">' +
				'<div class="left"><a href="' + _OverlayAdlinksArray[i].Link + '&variation=' + _AdlinksVariation + '&variation_loc=overlay" onclick="MarkChecked(' + _OverlayAdlinksArray[i].Id + '); TrackConversion();" target="_blank">' + _OverlayAdlinksArray[i].Name + '</a></div>' +
				'<div href="javascript://" class="right" id="right' + _OverlayAdlinksArray[i].Id + '">' +
					(_OverlayAdlinksArray[i].Visited 
						? '<a href="' + _OverlayAdlinksArray[i].Link + '&variation=' + _AdlinksVariation + '&variation_loc=overlay" onclick="MarkChecked(' + _OverlayAdlinksArray[i].Id + '); TrackConversion();" target="_blank" class="checked"></a>' 
						: '<a href="' + _OverlayAdlinksArray[i].Link + '&variation=' + _AdlinksVariation + '&variation_loc=overlay" onclick="MarkChecked(' + _OverlayAdlinksArray[i].Id + '); TrackConversion();" target="_blank" class="check"><span>Checken</span></a>') +
				'</div>' +
			'</div>';
	}
	
	return lHtml;
}

// Marks the link with the given id as visited
function MarkChecked(id)
{
	for(i = 0; i < _OverlayAdlinksArray.length; i++)
	{
		if (_OverlayAdlinksArray[i].Id == id)
		{
			_OverlayAdlinksArray[i].Visited = true;
		}
	}
	jQuery('#right' + id + ' a').removeClass('check').addClass('checked');
}

// Shows the overlay
function ShowOverlay(touropId)
{
	if (_OverlayAdlinksArray.length > 1)
	{
		// Mark the current touroperator as visited in the JS array
		for(i = 0; i < _OverlayAdlinksArray.length; i++)
		{
			if (_OverlayAdlinksArray[i].Id == touropId)
			{
				_OverlayAdlinksArray[i].Visited = true;
			}
			else
			{
				_OverlayAdlinksArray[i].Visited = false;
			}
		}
		
		// Generate main container and adlinks
		jQuery('#adlinksOverlayContainer').html(
			'<div class="header_lc' + (_AdlinksVariation == 3 ? ' h_center' : '') + '">' +
				'<a href="javascript://" class="close" onclick="HideOverlay()">sluiten</a>' +
				'<div class="title"><strong>Vakantie</strong>ReisWijzer.nl</div>' +
				'<img src="/illu_n/adlinks/adlink-overlay-globe.png">' +
			'</div>' +
			'<div class="adlinks' + (_AdlinksVariation == 3 ? ' a_center' : '') + '">' +
				'<div class="title">' +
					'<span>' + jQuery('div.d_nav p.p_nav b').html() + '</span><br/>' +
					GetTitleSubText() +
				'</div>' +
				GetAdlinksHtml() +
				'<br class="clearboth"/><!--[if IE 7]><br/><![endif]-->' +
			'</div>');
		
		// Show the overlay and the content
		jQuery('#adlinksOverlay').show();
		// Extend the width of the adlinks container for the third variation
		if (_AdlinksVariation == 3)
		{
			jQuery('#adlinksOverlayContainer').attr('style', 'width:746px;');
		}
		jQuery('#adlinksOverlayContainer').show();
		
		// Set correct position for the container
		if (_AdlinksVariation == 3)
		{
			var lTop = (jQuery('#adlinksOverlay').height() - jQuery('#adlinksOverlayContainer').height()) / 2;
			var lLeft = (jQuery('#adlinksOverlay').width() - jQuery('#adlinksOverlayContainer').width()) / 2;
			
			if (lTop < 0) lTop = 0;
			if (lLeft < 0) lLeft = 0;
			
			jQuery('#adlinksOverlayContainer').css('top', lTop + 'px');
			jQuery('#adlinksOverlayContainer').css('left', lLeft + 'px');
		}
	}
}

// Gets the text displayed under the entity name
function GetTitleSubText()
{
	switch(_AdlinksVariation)
	{
		case 1: return "Vergelijk onderstaande aanbieders en check de prijzen";
		case 2: return "Vergelijk onderstaande aanbieders en check de prijzen";
		case 3: return "Vergelijk alle aanbieders";
	}
}

// Hide the overlay
function HideOverlay()
{
	jQuery('#adlinksOverlayContainer').hide();
	jQuery('#adlinksOverlay').hide();
	_OverlayVisible = false;
}

// Tracks a conversion on the adlinks overlay experiment
function TrackConversion()
{
	_gaq.push(['gwo._trackPageview', '/0403424863/goal']);
}