$(document).ready(function() {
	$("#hometabs").tabs();
	d();
	cycle();
	function d() {
		ph=$("#portlets").height();
		at=$("div.activeTab div.show").height();
		if(ph-81>at) {
			ph-=81;
			$("div.activeTab div.show").css("height",ph+"px")
		}
	}
	$("ul.activeTab li a").click(function() {
		d();
		_gaq.push(["_trackEvent","Tabs","Home",$(this).parent().attr("id")])
	}
	);
	$("#hero").length&&rotator_init();
	$.hasFlashPlayer==true?$("#flash").flash( {
		swf:"flash/pbbi_shell_920x240.swf",height:240,width:920,params: {
			wmode:"transparent"
		}
		,flashvars: {
		}
	}
	):$("#flash").html('<img src="/uk/cssimages/home/newflashstatic.jpg" alt="" />')
}
);
		function cycle() {
	var $banners = $('#hp_banners');
	if ($banners.children().length > 1) {
		$banners.cycle({ 
			fx: 	'scrollLeft',
			speed: 	750,
			timeout:6000,
			pause: 	1
		});
	}
}
function rotator_init() {
	var	position = 0; // set which position to start at (zero based)
	var	speed = 250; // a speed for fades in and out
	var	totalLis = $('#hero > ul > li').length;
		
	// Get the content of the hidden tabs for swapping out.
	var	$straplines = $('#hero > ul > li h4').map(function(){return $(this).html();}),
		$benefits = $('#hero ul.benefits').map(function(){return $(this).html();}),
		$paragraphs = $('#hero > ul > li p').map(function(){return $(this).text();}),
		$links = $('#hero > ul > li > p a').map(function(){return $(this).attr('href');}),
		$linksClass = $('#hero > ul > li > p a').map(function(){return $(this).attr('class');}),
		$images = $('#hero > ul > li > img').map(function(){return $(this).attr('src');});

	// get the first li
	var $current_li = $('#hero ul > li:first'),
		// Copy it and place it at the start of the UL
		$new_li = $current_li.clone().prependTo('#hero ul');
		// and hide the rest of them
		$new_li.siblings().hide();

	// Get the initial link with a thumbnail, wrap in a ul and li (class=active)
	$new_li.find('a:eq(1)').wrap('<ul id="thumbnails"><li class="active"></li></ul>');
	// Rename the cloned 'master' ul
	$new_li.attr('id','master_slide');
	// Get the rest of the links containing thumbnails and add them to the top ul wrapped as lis
	$('li.unit:gt(1) > a').each(function () {
		$(this).appendTo('#thumbnails').wrap('<li></li>');
	});
	
	// Remove the other LIs, no need for them any longer
	$new_li.siblings().remove();
	
	// Set up the vars for the elements going to be manipulated
	var	$theStrapline = $('#master_slide h4'),
		$theBenefits = $('#master_slide .benefits'),
		$theParagraph = $('#master_slide p'),
		$theLink = $('#master_slide p a'),
		$theThumbs = $('#master_slide ul li img'),
		$theImage = $('#master_slide > img'),
		$theThumbLinks = $('#thumbnails a');

	// Bring the main image up the z-axis to allow for background that is coming in
	$theImage.css( 'z-index' , 50);

	// Create a dummy white element to background the fading img
	var imgWidth = $theImage.width(), // get the width of the main image
		imgHeight = $theImage.height(), // get the height of the main image
		$div = $('<div></div>') // create the div and set some styles for it
				.css({
						width: imgWidth,
						height: imgHeight,
						backgroundColor: '#fff',
						position: 'absolute',
						right: 0,
						top: 0
					});
	// Add it to the DOM
	$('#master_slide').append($div);
	
	$theThumbLinks.click(function(e) {
		e.preventDefault();

		if (! $(this).parent().hasClass('active')) {
			var clickedIndex = $(this).parent() // get the position of the clicked thumb by using parent position
				.siblings()
				.removeClass('active')
				.end()
				.addClass('active')
				.index();

			changeSlide(clickedIndex);
		}
	});
		
	// guts of the function
	function changeSlide(fromIndex) {
		$.fx.off // reset the animation queue
		
		function fadeOut() {
			$theStrapline.animate({opacity:0}, 100);
			$theBenefits.fadeOut(100);
			$theParagraph.fadeOut(100);
			$theImage.animate({opacity: 0.1},speed,function() {
				swapper();
			});
		}		
		function swapper() {
			$theStrapline.html($straplines[fromIndex]);
			$theBenefits.html($benefits[fromIndex]);
			$theLink.text($paragraphs[fromIndex]);
			$theLink.attr('href',($links[fromIndex]));
			$theLink.attr('class',$linksClass[fromIndex]);
			$theImage.attr('src',$images[fromIndex]);
			fadeIn();
		}		
		function fadeIn() {
			$theStrapline.animate({opacity:1}, 100);
			$theBenefits.fadeIn(100);
			$theParagraph.fadeIn(100);
			$theImage.animate({opacity: 1});
		}
		fadeOut();
	}
}
;