// What is $(document).ready ? See: http://flowplayer.org/tools/using.html#document_ready

// Gotcha - when looking for code samples, replace refs to '$' with 'jQuery'. When using 
// Prototype and jQuery, one of them has to relinquish the $ namespace to avoid conflicts. 
jQuery(document).ready(function() {
	
	
	var image_overlay = jQuery('a.thumbnail').overlay({
		target: '#overlay',
		onClose: function(){
			var player = document.getElementById('jwplayer');
			if (player) {
				player.sendEvent("STOP", "true");
			}
		},
		expose: { 
	        color: '#000000',  
	        loadSpeed: 300, 
	        opacity: 0.5
	    }
	});

	var image_overlay1 = jQuery('a.thumbnail1').overlay({
		target: '#overlay1',
		onClose: function(){
			var player = document.getElementById('jwplayer');
			if (player) {
				player.sendEvent("STOP", "true");
			}
		},
		expose: { 
	        color: '#000000',  
	        loadSpeed: 300, 
	        opacity: 0.5
	    }
	});


	jQuery('a.simple_popup').click(function () {jQuery(this).populateOverlayScreen(jQuery(this)); });
	
	jQuery('a.close').click(function () {
		var player = document.getElementById('jwplayer');
		if (player) {
			player.sendEvent("STOP", "true");
		}
		jQuery('a.thumbnail').each(function() { 
		   jQuery(this).overlay().close(); 
	    }); 
		jQuery('a.thumbnail1').each(function() { 
		   jQuery(this).overlay().close(); 
	    }); 
	});

jQuery("a[id='balloon_sub']").click(function () {
    jQuery("#overlay_padder1").html("<div id=\"video_holder\"><script type=\"text\/javascript\" language=\"JavaScript\">var flashvars = {};var params = {base:\'/flash\'};swfobject.embedSWF(\"/flash/balloon_sub.swf\", \"video_holder\", \"800\", \"450\", \"8\",\"expressInstall.swf\", flashvars, params);<\/script><\/div>");
});

jQuery("a[id='cake_sub']").click(function () {
    jQuery("#overlay_padder1").html("<div id=\"video_holder\"><script type=\"text\/javascript\" language=\"JavaScript\">var flashvars = {};var params = {base:\'/flash\'};swfobject.embedSWF(\"/flash/cake_sub.swf\", \"video_holder\", \"800\", \"450\", \"8\",\"expressInstall.swf\", flashvars, params);<\/script><\/div>");
});

jQuery("a[id='equity_overlay']").click(function () {
    jQuery("#overlay_padder").html("<p class=\"overlay_para\"><strong><span class=\"green_text\">Shares</span></strong></p><p class=\"overlay_para\">Also known as equities - these are part ownership in a company that is listed on a stock market. As the value of the company rises or falls, so will the value of your investments.</strong></p><p class=\"overlay_para\"><span class=\"green_text\">Risk: High</span></p><p class=\"overlay_para\"><span class=\"green_text\">Reward: High</span></p>");
});

jQuery("a[id='property_overlay']").click(function () {
    jQuery("#overlay_padder").html("<p class=\"overlay_para\"><strong><span class=\"green_text\">Property</span></strong></p><p class=\"overlay_para\">Your pension savings are invested in property such as shops, offices and factories. The money you invest will change in value as the value of the property changes - similar to buying a house. </strong></p><p class=\"overlay_para\"><span class=\"green_text\">Risk: Medium to High</span></p><p class=\"overlay_para\"><span class=\"green_text\">Reward: Medium to High</span></p>");
});

jQuery("a[id='bond_overlay']").click(function () {
    jQuery("#overlay_padder").html("<p class=\"overlay_para\"><strong><span class=\"green_text\">Bonds &amp; gilts</span></strong></p><p class=\"overlay_para\">These are like lending a friend &pound;100 but with the agreement that they will pay you back &pound;105 after one year. They are loans to companies or governments and are usually for a fixed period of time. Bonds provide a set return on your investment (this could be a set percentage or in line with inflation). Loans to the UK Government are called gilts.</strong></p><p class=\"overlay_para\"><span class=\"green_text\">Risk: Medium</span></p><p class=\"overlay_para\"><span class=\"green_text\">Reward: Medium</span></p>");
});

jQuery("a[id='cash_overlay']").click(function () {
    jQuery("#overlay_padder").html("<p class=\"overlay_para\"><strong><span class=\"green_text\">Cash</span></strong></p><p class=\"overlay_para\">This generally means your savings are in cash-like investments, similar to your bank account.  Historically this has been a safe bet but has a lower rate of return. You need to remember that if prices go up, the value of your cash investments might not keep up.</strong></p><p class=\"overlay_para\"><span class=\"green_text\">Risk: Low</span></p><p class=\"overlay_para\"><span class=\"green_text\">Reward: Low</span></p>");
});

jQuery("a[id='ctl00_ctl00_ContentPlaceHolderDefault_CharacterImageLink_4_video_overlay']").click(function () {
    jQuery("#overlay_padder1").html("<div id=\"video_holder\"><script type=\"text\/javascript\" language=\"JavaScript\">var flashvars = {};var params = {base:\'/flash\'};swfobject.embedSWF(\"/flash/balloon.swf\", \"video_holder\", \"800\", \"450\", \"8\",\"expressInstall.swf\", flashvars, params);<\/script><\/div>");});

jQuery("a[id='ctl00_ctl00_ctl00_ContentPlaceHolderDefault_ShpsMasterContentPlaceHolder_ctl00_CharacterImageLink_4_video_overlay']").click(function () {
    jQuery("#overlay_padder1").html("<div id=\"video_holder\"><script type=\"text\/javascript\" language=\"JavaScript\">var flashvars = {};var params = {base:\'/flash\'};swfobject.embedSWF(\"/flash/cake.swf\", \"video_holder\", \"800\", \"450\", \"8\",\"expressInstall.swf\", flashvars, params);<\/script><\/div>");});

});


jQuery.fn.populateOverlayScreen = function(element) {
	jQuery(".overlay_padder").replaceWith("<div class=\"overlay_padder\" id=\"overlay_padder\"><h2>"+element[0].title+"</h2><img src=\""+element[0].href+"\" /></div>");
};