try {
  document.execCommand("BackgroundImageCache", false, true);
} catch(err) {}


$(document).ready( function () {
 	// The number of images in the gallery
	var galleryNumImages=0;
	// The width of the main gallery images
	var imageTotalWidth=747;
	// Gallery height - this is used for animating the caption
	var galleryHeight=262;	
	// This includes both image width and margin
	var thumbnailTotalWidth=105;
	// Left offset for images on carousel 
	var carouselLeftOffset=3;
	// The number of images that can be seen of the carousel at once
	var carouselNumImagesDisplayed=7;
	// The current left most image in the carousel
	var carouselLeftMostImage=0;
	// This value is set to true in their are more imahes in the gallery than can be
	// displayed in the gallery
	var carouselScroll=false;
	// This value is set to true when gallery animation is taking place
	var galleryAnimationActive=false;
	// This value is set to true when carousel animation is taking place
	var carouselAnimationActive=false;
	// Caption height
	var galleryCaptionHeight=$("div#gallery-caption").height();
	
		

	$("div.load-gallery").click( function() {
		var galleryxmlfile=$(this).find("span.gallery-xml").attr("title");
		$.post(galleryxmlfile, function(data){
		$("div#gallery-start-page").fadeOut(500, function() {
				$(this).css("visibility","hidden");	
				$("div#gallery").css("visibility","visible").css("opacity", 1);
				$("div#gallery-carousel-holder").css("visibility","visible").css("opacity", 1);		
				$("img#gallery-main-picture").css("visibility","hidden");		
				$("div#gallery-main-picture-holder").css("visibility","hidden");		
	
				var carouselthumbs=$(data).find("image");
				galleryNumImages=carouselthumbs.length;
				if (galleryNumImages > carouselNumImagesDisplayed) {
					carouselScroll=true;
					$("div#gallery-carousel-right-button").show();
				}
								
				// Set up first image for being displayed
				$("img#displayed-image").attr("src",$(carouselthumbs[0]).find("image-src").text());
				$("div#gallery-caption p").text($(carouselthumbs[0]).find("caption").text());
				
				$("div#gallery-caption").css("top", (galleryHeight));
				
				
				// Inserting images into gallery-stage
	
				var insertHTML="";
				for (var counter=0; counter<galleryNumImages; counter++) {
					insertHTML+='<img src="'+$(carouselthumbs[counter]).find("image-src").text()+'" ';
					insertHTML+='alt="'+$(carouselthumbs[counter]).find("caption").text()+'" />\n';
				}
				$("div#gallery-stage").css("width", (imageTotalWidth*galleryNumImages));
				$("div#gallery-stage").empty().append(insertHTML);
				// Now set their left-offset
				
				var galleryimageleftoffset=0
				$("div#gallery-stage img").each( function() {
					$(this).css("left", galleryimageleftoffset)
					galleryimageleftoffset+=imageTotalWidth;
				}); 
				
				
				
				// Inserting thumbnails
				insertHTML="";
				for (var counter=0; counter<galleryNumImages; counter++) {
					insertHTML+='<img src="'+$(carouselthumbs[counter]).find("thumb-src").text()+'" ';
					insertHTML+='longdesc="'+counter+'" ';
					insertHTML+='alt="'+$(carouselthumbs[counter]).find("caption").text()+'" />\n';
				}
				$("div#gallery-carousel-stage").css("width", (thumbnailTotalWidth*galleryNumImages));
				$("div#gallery-carousel-stage").empty().append(insertHTML);
				
				// When Carousel images clicked, main image is displayed
				$("div#gallery-carousel-stage img").click( function() {
					if (galleryAnimationActive) {
						return false;
					}
					galleryAnimationActive=true;
					var imageposition=parseInt($(this).attr("longdesc"));
					var gallerycaption=$(this).attr("alt");
					$("div#gallery-stage").css("left", (-(imageposition*imageTotalWidth)));
					$("div#gallery-caption").animate({top: galleryHeight}, "medium", function() {
						$("img#displayed-image").fadeOut(500, function() {
							$("div#gallery-caption p").text(gallerycaption);
							$("div#gallery-caption").animate({top: (galleryHeight-galleryCaptionHeight)}, "medium", function() {
								var newimagesrc=$("div#gallery-stage img:eq("+imageposition+")").attr("src");
								$("img#displayed-image").attr("src", newimagesrc);
								$("img#displayed-image").css("opacity","1");
								$("img#displayed-image").fadeIn(1);
								galleryAnimationActive=false;
							});
						});
					});
				});
				
				carouselLeftMostImage=0;
				$("div#gallery-carousel-left-button").click( function() {
					if (carouselAnimationActive) {
						return false
					}
					carouselAnimationActive=true;
					carouselLeftMostImage--;
					
					var newcarouseloffset=carouselLeftOffset-(carouselLeftMostImage*thumbnailTotalWidth*7);
					$("div#gallery-carousel-stage").animate({left: newcarouseloffset},"3000", function() {
						carouselAnimationActive=false;
					});
					if (carouselLeftMostImage<=0) {
						$(this).hide();	
					}
					if (carouselScroll) {
						$("div#gallery-carousel-right-button").show();	
					}
				});
				$("div#gallery-carousel-right-button").click( function() {
					if (carouselAnimationActive) {
						return false;	
					}
					carouselAnimationActive=true;
					carouselLeftMostImage++;
					var newcarouseloffset=carouselLeftOffset-(carouselLeftMostImage*thumbnailTotalWidth*7);
					$("div#gallery-carousel-stage").animate({left: newcarouseloffset},"3000", function() {
						carouselAnimationActive=false;
					});
					if ((carouselLeftMostImage*7)>(galleryNumImages-carouselNumImagesDisplayed-1)) {
						$(this).hide();	
					}
					if (carouselScroll) {
						$("div#gallery-carousel-left-button").show();	
					}
				});
				
				// Hide carousel etc when back to gallery button is clicked
				// Plus of course, reveal the start page bumf
				$("div#gallery-caption span#caption-back-to-menu").click( function() {
					$("div#gallery").animate({opacity: 0}, 1000, function() {
						$(this).css("visibility","hidden");
					});
					$("div#gallery-carousel-holder").animate({opacity: 0}, 1000, function() {
						$(this).css("visibility","hidden");
					});								
	
					$("div#gallery-start-page").css("visibility", "visible").css("opacity",0);
					$("div#gallery-start-page").animate({opacity: 1}, 1000);
					$("img#gallery-main-picture").css("visibility", "visible").css("opacity",0.15);
					$("div#gallery-main-picture-holder").css("visibility", "visible");
			
				});
				
				$("div#gallery-carousel-stage img:eq(0)").click();				
				
			});
		});
	});
	
	
	
	$("div.load-video").click( function() {
		
		// If it is and audio button, we simply popup the audio and return;
		// Unless it is a ram file, in which case we change window.location
		// This does not actually open a new window but the ram file
		if ($(this).find("h3").get()[0].className == "video-audio-button") {
			if ($(this).find("span.full-audio-link").attr("title").indexOf(".ram")==-1) {
				popupFullEpisode($(this).find("span.full-audio-link").attr("title"));
			}
			else {
				window.location=$(this).find("span.full-audio-link").attr("title");
			}
			return;	
		}
		
		// We do things differently when there is more than one full video span defined 
		if ($(this).find("span.full-video-link").length > 1) {
			var fullsessions=$(this).find("span.full-video-link");
			var insertHTML='<h2>'+$(this).parent().find("h2").text()+'</h2>\n';
			var tearofflink=$(this).find("span.tear-off-link").attr("title");

			insertHTML+='<div class="video-info-block">\n';
			insertHTML+='<h3>'+$(this).find("h3").text()+'</h3>\n';
			insertHTML+='<p class="bottom-margin">'+$(this).find("p").text()+'</p>\n';
				
			for (var counter=0; counter<fullsessions.length; counter++) {	
				insertHTML+='<a class="video-play-button multiple-full-session" href="'+$(fullsessions[counter]).attr("title")+'">'+$(fullsessions[counter]).text()+'</a>\n';
				insertHTML+='<span class="video-media-advice">Windows Media and Real Media</span>\n';
			}
			
			insertHTML+='<div class="video-gallery-spacer2"></div>\n';
			if(tearofflink) {
				insertHTML+='<a class="video-tear-off-button" href="'+$(this).find("span.tear-off-link").attr("title")+'">Embed video</a>\n';
			}
			if($(this).find("img.select-bbc-logo").length != 0) {
				insertHTML+='<img src="'+$(this).find("img.select-bbc-logo").attr("src")+'"></img>\n'; 
			}
			else {
				insertHTML+='<div class="video-gallery-spacer"></div>';	
			}
			insertHTML+='<div class="clear"></div>\n';
			insertHTML+='</div>\n';
		
			insertHTML+='<div class="video-info-block">\n';
			insertHTML+='<div class="video-gallery-spacer2"></div>\n';
			insertHTML+='<a class="back-to-menu" href="#"><span class="back-to-menu-right"></span>Back to main menu</a>\n';
			insertHTML+='</div>\n'; 


			$("div#video-info").empty().append(insertHTML);
			
			$("a.multiple-full-session").click( function() {
				if ($(this).attr("href")) {
					popupFullEpisode($(this).attr("href"));
				}
				return false;
			});

			
		}
		else {
		
			// This variable defines whether a fullsession link has been provided
			var fullsessionlink=$(this).find("span.full-video-link").attr("title");
			// This variable defines whether a tear-off link has been provided
			var tearofflink=$(this).find("span.tear-off-link").attr("title");
	
			var insertHTML='<h2>'+$(this).parent().find("h2").text()+'</h2>\n';
			insertHTML+='<div class="video-info-block">\n';
			insertHTML+='<h3>'+$(this).find("h3").text()+'</h3>\n';
			insertHTML+='<p class="bottom-margin">'+$(this).find("p").text()+'</p>\n';
			
			if ($(this).parent().find("h2").text()=="Sessions") {
				if(fullsessionlink) {
					insertHTML+='<a class="video-play-button" id="popup-full-session" href="#">Watch full session</a>\n';
					insertHTML+='<span class="video-media-advice">Windows Media and Real Media</span>\n';
				}
				if(tearofflink) {
					insertHTML+='<a class="video-tear-off-button" href="'+$(this).find("span.tear-off-link").attr("title")+'">Tear off video</a>\n';
				}
			}
			else {
				if(fullsessionlink) {
					insertHTML+='<a id="popup-full-session" class="video-play-button" href="#">Watch interview</a>\n';
					insertHTML+='<span class="video-media-advice">Windows Media and Real Media</span>\n';
				}
				
				if(tearofflink) {
					insertHTML+='<a class="video-tear-off-button" href="'+$(this).find("span.tear-off-link").attr("title")+'">Embed video</a>\n';
				}
			}
			
			if($(this).find("img.select-bbc-logo").length != 0) {
				insertHTML+='<img src="'+$(this).find("img.select-bbc-logo").attr("src")+'"></img>\n'; 
			}
			else {
				insertHTML+='<div class="video-gallery-spacer"></div>';	
			}
			insertHTML+='<div class="clear"></div>\n';
			insertHTML+='</div>\n';
		
			insertHTML+='<div class="video-info-block">\n';
			insertHTML+='<div class="video-gallery-spacer2"></div>\n';
			insertHTML+='<a class="back-to-menu" href="#"><span class="back-to-menu-right"></span>Back to main menu</a>\n';
			insertHTML+='</div>\n'; 
	
			$("div#video-info").empty().append(insertHTML);
	
	
			$("a#popup-full-session").click( function() {
				if (fullsessionlink) {
					popupFullEpisode(fullsessionlink);
				}
				return false;
			});
		}

		$("a.video-tear-off-button").click( function() {
			stopVideo();
		//	$("div#video-stage").css("display","none");
		// 	$("div#video-stage").css("text-indent","-99999em");
			$("div#video-stage").removeClass("show-video-stage");
			$("div#video-stage").addClass("hide-video-stage");

			$("div#gallery-start-page").css("display","block");	
			$("div#gallery-main-picture-holder").css("display","block");	
			$("div#gallery").css("display","block");	
			$("div#gallery-carousel-holder").css("display","block");	
		});
		

		var originalselectbox=this;
		$("div#video-info h4.reload-video").click( function() {
			stopVideo();
			var holderblock=$(originalselectbox).parent();
			var selectblocks=$(holderblock).find("div.load-video");
			for (var counter=0; counter<selectblocks.length; counter++) {
				if ($(selectblocks[counter]).find("p").text() == $(this).next().text()) {
					$(selectblocks[counter]).click();
					return;
				}
			}
		});
			
			
		$("a.back-to-menu").click( function() {
			stopVideo();
		//	$("div#video-stage").css("display","none");
		// 	$("div#video-stage").css("text-indent","-99999em");
			$("div#video-stage").removeClass("show-video-stage");
			$("div#video-stage").addClass("hide-video-stage");

			$("div#gallery-start-page").css("display","block");	
			$("div#gallery-main-picture-holder").css("display","block");	
			$("div#gallery").css("display","block");	
			$("div#gallery-carousel-holder").css("display","block");	
			return false;
		});
		
		$("div#gallery-start-page").css("display","none");	
		$("div#gallery-main-picture-holder").css("display","none");	
		$("div#gallery").css("display","none");	
		$("div#gallery-carousel-holder").css("display","none");	
		
		// $("div#video-stage").css("display","block");	
		// $("div#video-stage").css("visibility","visible");	
		// $("div#video-stage").css("text-indent","0");

		
		$("div#video-stage").removeClass("hide-video-stage");
		$("div#video-stage").addClass("show-video-stage");
		
		var videoxmlvar=$(this).find("span.video-xml").attr("title");
		setTimeout(function() {
			mpLoadVideo(videoxmlvar);
		},1000);		
	});
	
});