// JavaScript Document for Alpari global elements.

$(document).ready(function() {

	// Setting the state of various elements on the page that are be default set to work with JS disabled.
	//$('#containerNav ul').css({position: 'absolute', bottom: '-1px', left: '223px', margin: '0px'});
	$('#containerNav ul').css({position: 'absolute', left: '223px', margin: '0px'});
	$('#language').css('cursor', 'pointer');
	$('#languageSelect').css('display', 'none');
	$('#subNav li.tertiary ul').css('display', 'none');

	// use the 'body' 'id', and 'a' 'id' in the tertiary to set the sub nav to be open, eg:
	$('#subNav li.tertiary ul').css('');
	$('#subNav li.tertiary ul#currentSub').css('display', 'block');
	// trading accounts:
	//$('.ta_1_1 #subNav li.tertiary a#subMainTA_1_1').css('');
	//$('.ta_1_1_1 #subNav li.tertiary ul#subTA_1_1').css('display', 'block');
	//$('.ta_1_1_2 #subNav li.tertiary ul#subTA_1_1').css('display', 'block');
	//$('.ta_1_1_3 #subNav li.tertiary ul#subTA_1_1').css('display', 'block');
	//$('.ta_1_2 #subNav li.tertiary a#subMainTA_1_2').css('');
	//$('.ta_1_2 #subNav li.tertiary ul#subTA_1_2').css('display', 'block');
	//$('#benefits #subNav li.tertiary ul#subTA_1_1').css('display', 'block');
	//$('#tutorials #subNav li.tertiary ul#subTA_1_1').css('display', 'block');

	/* follow the above format for the other sections */

	// Dynamically vertically centering links in the main nav bar. We are using JS rather than CSS here to avoid unnecessary mark-up in the HTML page.

	// Reset any padding that exists to what we need.
	$('#containerNav ul li a').css('padding', '0px 20px');

	// First we set the min height of the container and the corresponding height of the nav list elements.
	var z = Math.max($('#containerNav').height(), 82);

	$('#containerNav ul li a').each(function() {
		z = Math.max(z, $(this).height() + 50);
	});
	$('#containerNav').height(z);

	// The -30 takes into account the light green part of the nav background. We want to vertically centre our links with regards to the dark green section so we need to remove the lighter green.
	var h = ($('#containerNav').height() - 30)

	// Vertically center all other links.
	$('#containerNav ul li a').each(function() {
		var p = ((h - $(this).height()) / 2) + 30;
		$(this).css('padding-top', p + 'px');
		$(this).width($(this).width());
		$(this).height($('#containerNav').height() - p);
	});

	// Changing bottom border colour onMouseOver to create tab effect.
	$('#containerNav ul li a').hover(
		function() {
			$(this).parent().css('border-color', '#9cce26');
		},
		function() {
			$(this).parent().css('border-color', '#fff');
		}
	);

	// Slide down for language selection.
	$('#language').click(function() {
		if ($('#languageSelect').css('display')	== "none") {
			$('#languageSelect').slideDown('slow');
		} else {
			$('#languageSelect').slideUp('slow');
		}
		return false;
	});

	// Slide down for tertiary sub nav.
	$('#subNav li.tertiary:has(ul) a.tertiaryTitle').click(function() {
		$('#subNav > li').each(function() {
			$(this).children('ul').slideUp('slow');
		});
		if ($(this).parent().children('ul').css('display') == "none") {
			$(this).parent().children('ul').slideDown('slow');
		} else {
			$(this).parent().children('ul').slideUp('slow');
		}
		return false;
	});

	// Showing different tabs and their content on click.
	$('.containerModule h2').click(function() {
		var tabNo = 0;
		var thisHdr = this;
		$('.containerModule h2').each(function() {
			$('#tab' + tabNo).css('display', 'none');
			$(this).parent().attr('class', $(this).parent().attr('class').replace(/On/, 'Off'));
			if ($(thisHdr).hasClass('hdrTab' + tabNo)) {
				$('#tab' + tabNo).css('display', 'block');
				$(thisHdr).parent().attr('class', $(this).parent().attr('class').replace(/Off/, 'On'));
			}
			tabNo++;
		});
	});



	// Showing different tabs and their content on click.  ACCOUNT TABS
	$('.containerModuleAcct h2').click(function() {
		var tabNo = 0;
		var thisHdr = this;
		$('.containerModuleAcct h2').each(function() {
			$('#tab' + tabNo).css('display', 'none');
			$(this).parent().attr('class', $(this).parent().attr('class').replace(/On/, 'Off'));
			if ($(thisHdr).hasClass('hdrTab' + tabNo)) {
				$('#tab' + tabNo).css('display', 'block');
				$(thisHdr).parent().attr('class', $(this).parent().attr('class').replace(/Off/, 'On'));
			}
			tabNo++;
		});
	});



	// Setting margins on lava lamp list items so that they appear centered within their container.

	// Set initially to 0;
	$('.lavaLamp li a').css({marginLeft: '0px', marginRight: '0px'});
	var lavaLampWidth = $('.lavaLamp').width();

	$('.tabContent').each(function() {
		var totalListItemWidth = 0;
		var marginWidth = 0;
		var numItems = 0;

		$('.lavaLamp li a', this).each(function() {
			totalListItemWidth = totalListItemWidth + $(this).width();
			numItems++;
		});

		marginWidth = ((lavaLampWidth - totalListItemWidth) / numItems) / 2;
		$('.lavaLamp li a', this).css({marginLeft: marginWidth + 'px', marginRight: marginWidth + 'px'});
	});

	// Fade mechanism for content in containerModule.
	$('.lavaLamp li a').click(function() {

		var href = $(this).attr('href').substr(1);
		var tabContent = $(this).parent().parent().parent().parent();

		$('.containerModuleContent', tabContent).each(function() {
				if ($(this).css('display') == 'block') {
					$(this).fadeOut('slow', curryFunction(function(href) {
						$('#' + href).fadeIn('slow');
					}, href));
				}
		});

	});

	// Shrinkwrapping textual buttons. We use JS because IE 6 is incompetent.
	$('.ctas li a').each(function(){
		$(this).width($(this).width());
	});
	$('.ctas li a').css('display', 'block');

	// Rollovers for CTA buttons
	/*$('.ctas a').hover(
		function() {
			$(this).css({color: '#000', backgroundImage: 'url(/images/link-bg-cta-on-left.jpg)'});
			$(this).parent().css('background-image', 'url(/images/link-bg-cta-on-right.jpg)');
		},
		function() {
			/*$(this).css({color: '#333', backgroundImage: 'url(/images/link-bg-cta-off-left.jpg)'});
			$(this).parent().css('background-image', 'url(/images/link-bg-cta-off-right.jpg)');*/
			/*$(this).css({color: '#000', backgroundImage: 'url(/images/link-bg-cta-on-left.jpg)'});
			$(this).parent().css('background-image', 'url(/images/link-bg-cta-on-right.jpg)');*/
		/*}
	);*/

	//call to function to fix search
	if($("#search").length > 0 ){
		fixSearchField();
	}


});

/**
 * Currys a function and arguments. Takes a function as the first argument,
 * and returns a zero-arugument function that calls the provided function
 * with the provided arguments.
 */
function curryFunction() {
	var f = arguments[0];
	var args = [];
	for (i = 1; i < arguments.length; i++) {
		args[i-1] = arguments[i];
	}
	return function() {
		return f.apply(this, args);
	}
}

function fixSearchField(){
	document.getElementById("search").onfocus = function(){ document.getElementById("search").value = " "; }
	document.getElementById("search").onblur = function() {
		if(document.getElementById("search").value.length == 0 || document.getElementById("search").value.length == 1){
			document.getElementById("search").value = "Search";
		}
	}
}


//squawk player overlay
	function player_close() {
		document.getElementById('player_overlay').removeChild(document.getElementById('player_outer'));
		document.getElementById('player_overlay').style.display = 'none';
		document.getElementById('underlay').style.display = 'none';
	}
	function player_open() {
		document.getElementById('player_overlay').innerHTML = "<div id='player_outer'><iframe src ='http://www.fcmarketsquawk.com/player.php?referer=www.alpari.co.uk' width='300px' height='300px' scrolling='no' frameborder='0'><p>Your browser does not support iframes.</p></iframe><a href='#' style='float: right;' onclick=\"player_close()\">Close X</a></div>";
		document.getElementById('player_overlay').style.display = 'block';
		document.getElementById('underlay').style.display = 'block';
	}

		function player_open_pro() {
		document.getElementById('player_overlay').innerHTML = "<div id='player_outer'><iframe src ='http://www.fcmarketsquawk.com/player.php?referer=http://www.alpari.live/' width='300px' height='300px' scrolling='no' frameborder='0'><p>Your browser does not support iframes.</p></iframe><a href='#' style='float: right;' onclick=\"player_close()\">Close X</a></div>";
		document.getElementById('player_overlay').style.display = 'block';
		document.getElementById('underlay').style.display = 'block';
	}