// Code to fix odd focus model in WebKit browsers for skip links.
// See: http://www.communis.co.uk/examples/skiplink-redux.html
if ($.browser.safari || $.browser.opera) {
	if (document.getElementById('mainContent')) {
		var targetContent = document.getElementById('mainContent');
		targetContent.href = '#mainContent';
		targetContent.setAttribute('tabindex', '0');
		document.getElementById('skipToContent').setAttribute('onclick', 'document.getElementById("mainContent").focus();');
	}

	if (document.getElementById('secondaryNav')) {
		var targetSecNav = document.getElementById('secondaryNav');
		targetSecNav.href = '#secondaryNav';
		targetSecNav.setAttribute('tabindex', '0');
		document.getElementById('skipToSecondaryNav').setAttribute('onclick', 'document.getElementById("secondaryNav").focus();');
	}
}

// create array for hero carousel
var heroImages = ['<a href="a_page.html"><img src="../vodafone/gui11/img/hero/1_iphone.png" alt="iPhone 4. This changes everything again. Hebben? Bestel nu alvast jouw iPhone 4 en haal het maximale uit je toestel. Downloaden tot 7,2 Mbps!" width="952" height="277" /></a>',
	'<a href="b_page.html"><img src="/vodafone/gui11/img/hero/2_smartphone_superdeals.png" alt="Smartphone superdeals! Gratis smartphone bij een Bel+Sms+Web 200 abonnement. Nu de eerste 12 maanden van &euro;34,50 voor &euro;20." width="952" height="277" /></a>',
	'<a href="c_page.html"><img src="/vodafone/gui11/img/hero/3_gevonden.png" alt="Gevonden! Ik vind mijn weg naar de leukste tentjes met Google Maps. En kijk ook meteen of het terrasweer is." width="952" height="277" /></a>',
	'<a href="d_page.html"><img src="/vodafone/gui11/img/hero/4_prepaid_smartphones.png" alt="Prepaid smartphones. Bellen en internetten met de gaafste toestellen." width="952" height="277" /></a>',
	'<a href="e_page.html"><img src="/vodafone/gui11/img/hero/5_voice_of_holland.png" alt="The voice of Holland. Elke vrijdag vanaf 20:30" width="952" height="277" /></a>'];
var heroStr = "";

// Herospace close and reopen controls
var initialClick = false;
var heroVis = true;
var heroActiveSrc = '/vodafone/gui11/img/hero/btn_open_active.png';
var heroActiveAlt = 'Reopen the banner';
var heroActiveTitle = 'Click to reopen the banner';
var heroOpenSrc = '/vodafone/gui11/img/hero/btn_open.png';
var heroCloseSrc = '/vodafone/gui11/img/hero/btn_close.png';
var heroCloseAlt = 'Close the banner';
var heroCloseTitle = 'Click to close the banner';
var heroCloseActiveSrc = '/vodafone/gui11/img/hero/btn_close_active.png';
var heroCloseLink = '<a href="#" title="' + heroCloseTitle + '"><img src="' + heroCloseSrc + '" alt="' + heroCloseAlt + '" width="20" height="21" /></a>';
var heroDisplayStr = '<div id="heroDisplayControl">' + heroCloseLink + '</div>';

// set the initial colour of the username and password fields
var signInColour = '#333';

function passwordBlur(passwordStr) {
	if ($('#password').val() === '') {
		/*$('#password').replaceWith('<input type="text" id="password" name="password" value="" onfocus="passwordFocus(\'' + passwordStr + '\')" onkeypress="return submitenterLB(this,event);" />');
		$('#password').css('color', signInColour);
		$('#password').val(passwordStr);*/
		$('#password').hide();
		$('#passwordtext').show();
	}
}

function passwordFocus(passwordStr) {
	if ($('#password').val() === passwordStr) {
		//$('#password').replaceWith('<input type="password" id="password" name="password" value="" onblur="passwordBlur(\'' + passwordStr + '\')" onkeypress="return submitenterLB(this,event);" />');
		$('#password').show();
		$('#passwordtext').hide();
		$('#password').focus();
	}
}

//Simple plugin to consolidate all the carousels into one place
jQuery.fn.vfCarousel = function (opts) {
	return this.each(function () {
		var $originalElement = jQuery(this), $slideshow = jQuery($originalElement).siblings(opts.slideArea), nextText = opts.nextText ? opts.nextText : '', prevText = opts.prevText ? opts.prevText : '';

		// next and previous controls
		jQuery('<a href="#" class="next"><img src="/vodafone/gui11/img/tabs/next.png" alt="' + nextText + '" title="' + nextText + '" /></a>').appendTo(this);
		jQuery('<a href="#" class="prev"><img src="/vodafone/gui11/img/tabs/previous.png" alt="' + prevText + '" title="' + prevText + '" /></a>').appendTo(this);
		// containing div for pager bullets
		jQuery('<div class="nav"><\/div>').appendTo(this);

		var next = jQuery(this).find('a.next'), prev = jQuery(this).find('a.prev'), pager = jQuery(this).find('.nav');

		$slideshow.cycle({
			prev: prev,
			next: next,
			pager: pager,

			fx: opts.fx,
			timeout: opts.timeout,
			timeoutFn: opts.timeoutFn,
			continuous: opts.continous,
			speed: opts.speed,
			speedIn: opts.speedIn,
			speedOut: opts.speedOut,
			onPrevNextEvent: opts.onPrevNextEvent,
			prevNextEvent: opts.prevNextEvent,
			onPagerEvent: opts.onPagerEvent,
			pagerEvent: opts.pagerEvent,
			allowPagerClickBubble: opts.allowPagerClickBubble,
			pagerAnchorBuilder: opts.pagerAnchorBuilder,
			before: opts.before,
			after: opts.after,
			end: opts.end,
			easing: opts.easing,
			easeIn: opts.easeIn,
			easeOut: opts.easeOut,
			shuffle: opts.shuffle,
			animIn: opts.aminIn,
			animOut: opts.animOut,
			cssBefore: opts.cssBefore,
			cssAfter: opts.cssAfter,
			fxFn: opts.fxFn,
			height: opts.height,
			startingSlide: opts.startingSlide,
			sync: opts.sync,
			random: opts.random,
			fit: opts.fit,
			containerResize: opts.containerResize,
			pause: opts.pause,
			pauseOnPagerHover: opts.pauseOnPagerHover,
			autostop: opts.autostop,
			autostopCount: opts.autostopCount,
			delay: opts.delay,
			slideExpr: opts.slideExpr,
			cleartype: opts.cleartype,
			cleartypeNoBg: opts.cleartypeNoBg,
			nowrap: opts.nowrap,
			fastOnEvent: opts.fastOnEvent,
			randomizeEffects: opts.randomizeEffects,
			rev: opts.rev,
			manualTrump: opts.manualTrump,
			requeueOnImageNotLoaded: opts.requeueOnImageNotLoaded,
			requeueTimeout: opts.requeueTimeout,
			activePagerClass: opts.activePagerClass,
			updateActivePagerLink: opts.updateActivePagerLink,
			backwards: opts.backwards
		});

		jQuery(this).find('a.next').focus(function () {
			jQuery(this).find('img').attr('src', '/vodafone/gui11/img/tabs/next_active.png');
		}).hover(function () {
			jQuery(this).find('img').attr('src', '/vodafone/gui11/img/tabs/next_active.png');
		}, function () {
			jQuery(this).find('img').attr('src', '/vodafone/gui11/img/tabs/next.png');
		}).blur(function () {
			jQuery(this).find('img').attr('src', '/vodafone/gui11/img/tabs/next.png');
		});

		jQuery(this).find('a.prev').focus(function () {
			jQuery(this).find('img').attr('src', '/vodafone/gui11/img/tabs/previous_active.png');
		}).hover(function () {
			jQuery(this).find('img').attr('src', '/vodafone/gui11/img/tabs/previous_active.png');
		}, function () {
			jQuery(this).find('img').attr('src', '/vodafone/gui11/img/tabs/previous.png');
		}).blur(function () {
			jQuery(this).find('img').attr('src', '/vodafone/gui11/img/tabs/previous.png');
		});
	});
};

//Total communications support page
$('#quickLinks #listOfItems > div:gt(0)').hide();
$('#linkList li a').bind('mouseover focus active', function () {
	$('#linkList li').removeClass('active');
	$('#quickLinks #listOfItems > div').hide();
	var section = $(this).attr('class');
	$('#quickLinks #listOfItems #' + section).show();
	$(this).parent().addClass('active');
});

// onload code
$(function () {
	var usernameStr = 'Conta/Telefone/ID', passwordStr = 'Password', searchStr = $('label[for=search]').text();

	//$('<link rel="stylesheet" href="css/moduleControls.css" type="text/css" media="all" />').appendTo('head');
	$('label[for=userid], label[for=password]').hide();

	$('#userid').val(usernameStr);
	//$('#password').replaceWith('<input type="text" id="password" name="password" value="' + passwordStr + '" onfocus="passwordFocus(\'' + passwordStr + '\')" />');
	$('#password').hide();	
	$('#passwordtext').show();
	$('#passwordtext').val(passwordStr);
	$('#userid, #password').css('color', signInColour);
	
	$('#userid').focus(function () {
		if ($(this).val() === usernameStr) {
			$(this).css('color', '');
			$(this).val('');
		}
	});
	$('#userid').blur(function () {
		if ($(this).val() === '') {
			$(this).val(usernameStr);
			$(this).css('color', signInColour);
		}
	});
	$('#password').focus(function () {
		if ($(this).val() === passwordStr) {
			$(this).css('color', '');
			$(this).val('');
			//$(this).replaceWith('<input type="password" id="password" name="password" value="" onblur="passwordBlur(\'' + passwordStr + '\')" />');
			$('#password').focus();
		}
	});

	// pre-populate text fields.
	// Search field
	$('#search').val(searchStr);
	$('#search').focus(function () {
		if ($(this).val() === searchStr) {
			$(this).val('');
		}
	});
	$('#search').blur(function () {
		if ($(this).val() === '') {
			$(this).val(searchStr);
		}
	});

	// tabs
	// highlight first tab
	$('.tabs li a:first').addClass('current');

	// hide all tab content other than the first one
	$('.tabsContainer').each(function () {
		$('.tab:gt(0)').hide();
	});

	$('.tabs a').click(function (event) {
		// tab contents
		var $tabContainer = $(this).closest('ul').siblings('.tabContainer'), targetTab = $(this).attr('href');
		event.preventDefault();

		$(this).closest('ul').find('li a').removeClass('current');
		$(this).addClass('current');
		$tabContainer.find('.tab').hide();
		$(targetTab).show();
	});

	$('#herospace .herospaceControls').after(heroDisplayStr);
	// close 'x' image
	$('#heroDisplayControl a').click(function (event) {
		if (heroVis) {
			$('#herospace > *').hide();
			$('#herospace').css('padding-bottom', '0');
			$('#heroDisplayControl').css('right', '-15px').show();
			$(this).attr('alt', heroActiveAlt);
			$(this).attr('title', heroActiveTitle);
			$(this).find('img').attr('src', heroActiveSrc);

			initialClick = true;
			heroVis = false;
		}
		else {
			$('#herospace > *').show();
			$('#herospace').css('padding-bottom', '');
			$('#heroDisplayControl').css('right', '');
			$(this).attr('title', heroCloseTitle);
			$(this).find('img').attr('src', heroCloseSrc);

			heroVis = true;
		}
		event.preventDefault();
	});

	$('#heroDisplayControl a').focus(function () {
		if (heroVis) {
			$('img', this).attr('src', heroCloseActiveSrc);
		}
		else {
			$('img', this).attr('src', heroActiveSrc);
		}
	});

	$('#heroDisplayControl a').blur(function () {
		if (heroVis) {
			$('img', this).attr('src', heroCloseSrc);
		}
		else {
			$('img', this).attr('src', heroOpenSrc);
		}
	});

	// can't use hover. Problems with focus and blur and initially changed image.
	$('#heroDisplayControl a').mouseenter(function () {
		if (heroVis) {
			$('img', this).attr('src', heroCloseActiveSrc);
		}
		else {
			$('img', this).attr('src', heroActiveSrc);
		}
	}).mouseleave(function () {
		if (initialClick) {
			$('img', this).attr('src', heroActiveSrc);
			initialClick = false;
		}
		else {
			$('img', this).attr('src', heroOpenSrc);
		}
		if (heroVis) {
			$('img', this).attr('src', heroCloseSrc);
		}
	});

	// populate herospace with hero images
	$.each(heroImages, function () {
		heroStr += '<li>' + this + '</li>';
	});
	$('#herospace .heros').html(heroStr);

	// carousels
	// set height of carousel content as cycle sometimes doesn't honour heights
	function onAfterInHeader() {
		var myHeight = $(this).parent().parent().height();
		$(this).parent().css('height', myHeight);
	}

	function onAfterInBody() {
		var myHeight = $(this).find('.itemInList').height();
		$('.listOfItems').css('height', myHeight).css('overflow', 'visible');
	}

	// hero
	$('.herospaceControls').vfCarousel({
		controls: '.herospaceControls',
		slideArea: '.heros',
		nextText: 'Seguinte',
		prevText: 'Anterior',
		// jquery.cycle opts. Passed to jquery.cycle inside vfCarousel
		fx: 'fade',
		activePagerClass: 'active',
		speed: 'slow',
		timeout: 0 //4000
	});

	// controls in the header of the container
	$('.controlsInHeader').vfCarousel({
		controls: '.controlsInHeader',
		slideArea: '.controlsInHeaderSlides',
		nextText: 'Seguinte',
		prevText: 'Anterior',
		// jquery.cycle opts. Passed to jquery.cycle inside vfCarousel
		fx: 'scrollHorz',
		activePagerClass: 'active',
		speed: 300,
		timeout: 0,
		after: onAfterInHeader
	});

	// controls in the body of the container
	$('.controls').vfCarousel({
		controls: '.controls',
		slideArea: '.listOfItems',
		nextText: 'Seguinte',
		prevText: 'Anterior',
		// jquery.cycle opts. Passed to jquery.cycle inside vfCarousel
		fx: 'scrollHorz',
		activePagerClass: 'active',
		speed: 300,
		timeout: 0,
		after: onAfterInBody
	});

	// attached collapse/expand to sidebar boxes
	$('.mod3ColSidebar .title h2 a').addClass('collapse');
	$('.mod3ColSidebar .title h2 a').click(function (event) {
		event.preventDefault();
		event.stopPropagation();

		if ($(this).closest('div.title').siblings('div.modBodySidebar').find('>div').is(':visible')) {
			$(this).removeClass('collapse').addClass('expand');
		}
		else {
			$(this).removeClass('expand').addClass('collapse');
		}

		// fix an IE6 issue with slide
		if ($.browser.msie && $.browser.version.substr(0, 3) === "6.0") {
			$(this).closest('.title').siblings('.modBodySidebar').find('.modCopy').slideToggle('slow');
		}
		else {
			$(this).closest('.title').siblings('.modBodySidebar').slideToggle('slow');
		}
	});

	// Check for webkit browsers (Safari and Chrome)
	// because cycle does not set carousel height properly for inital slide
	// setTimeout used to give control time to render
	if ($.browser.safari) {
		setTimeout(function () {
			$('.listOfItems').css('height', $('.itemInList').height());
		}, 250);
	}


	// Remove the class of 'options'
	// This removes the CSS 'fallback'
	$('#topQuickLinks ul.options ul').show();
	$('#topQuickLinks ul.options').removeClass('options');

	// When a list item that contains an unordered list
	// is hovered on
	$('#topQuickLinks li:has(ul)').hover(function () {
		$(this).addClass('current').find('>ul').slideDown();
	}, function () {
		$(this).removeClass('current').find('>ul').slideUp();
	});

	// Check for WebKit browsers (Safari and Chrome)
	// because cycle does not set carousel height properly for inital slide
	if ($.browser.safari) {
		setTimeout(function () {
			$('.listOfItems').css('height', $('.itemInList').height());
		}, 250);
	}

	// Popup for tab carousel content
	$('a.popupTrigger iframe').hide();

	// Slight browser specific CSS tweaks for carousel popup
	if ($.browser.opera) {
		$('#appsAndDownloads .itemInList .popup').css({position: 'relative', top: '0', left: '0'});
	}
});