/*
//don't use document.ready, use window.load for the carousels to work
$(document).ready(function()
{
	init_navigation();	
	init_ajax_images();
	init_ajax_youtube();
	//download_resume('keiko_kamata_resume_web.pdf', 'filename=resume&format=pdf&content=keikoresume');
});
*/
	
$(window).load(function()
{
	init_navigation();	
	init_ajax_images();
	init_ajax_youtube();
	init_ajax_hero();
	
	//initially, featurd image is hidden. the hero banner is shown instead.
	$('#featured_img').css("display", "none");
	$('#hero').css("background", "url(./images/gallery/hero_fruits.jpg) top center repeat-x #728DB3");
	
	//download_resume('keiko_kamata_resume_web.pdf', 'filename=resume&format=pdf&content=keikoresume');
});

//tab navigation
function init_navigation(){
	$(".page").hide();
	
	$("#toc li").each(function(){
		var navLink = $(this).find("a[rel='page']");
		var linkId = $(navLink).attr("href");
		
		//Set the default active class
		if($(this).hasClass("active")){
			$(linkId).show();
		}
		
		//set the link click functionality
		 $(navLink).click(function(){
			//check the pages
			$(".page").each(function(){
				if(linkId=="#"+$(this).attr("id")){
					$(this).show();
				} else {
					$(this).hide();
				}
			});
			
			//set button active state
			$("#toc li").each(function(){
				$(this).removeClass("active");											
			});
			
			$(this).parents("li").addClass("active");
			
			return false;
		});
	});
}

//ajax images
function init_ajax_images(){
	$("a.ajax_image_load").each(function(){
		$(this).click(function(){
			//The rel attribute on the A link is the ID of the "featured" content page
			//this is where the image will go
			var rel = $(this).attr("rel");
			
			//the href is the image to load
			var image2load = $(this).attr("href");
			
			var image_link = $(this).attr("rev");
			
			//Creates a new image
			//var img = new Image();
			//$(rel).html(img);
			//$(img).load(function(){
				//when image has loaded, replace the current HTML 
				//inside the div with the ID referenced in the link rel
			//	$(rel).html(img);
			//}).attr("src", href);
			
			var linktag1 = '';
			var linktag2 = '';
			
			if (image_link)
			{
				linktag1 = '<a target="_blank" href="' + image_link+ '">';
				linktag2 = '</a>';
			}			
			//Creates a new image
			var img = new Image();
			$(rel).html(linktag1 + '<img src="' + image2load + '"/>' + linktag2);
								
			//the title is the caption to load... use NAME rather than TITLE so tooltip doesn't pop up...
			var caption = $(this).parent().find('.caption').html();
			//print out the caption 
			$(rel + "_caption").html(caption);
			
			$('#hero').css("background", "url(./images/gallery/hero_default.jpg) top center repeat-x #728DB3");
			$('#featured_img').css("display", "inherit");
			
			return false;
		});
	});
}


//ajax hero
function init_ajax_hero(){
	$("a.ajax_hero_load").each(function(){
		$(this).click(function(){
			//The rel attribute on the A link is the ID of the "featured" content page
			//this is where the image will go
			var rel = $(this).attr("rel");
			
			//the href is the image to load
			var image2load = $(this).attr("href");
			
			var image_link = $(this).attr("rev");
			
			var linktag1 = '';
			var linktag2 = '';
			
			if (image_link)
			{
				linktag1 = '<a target="_blank" href="' + image_link+ '">';
				linktag2 = '</a>';
			}			
			//Creates a new image
			var img = new Image();
			$(rel).html(linktag1 + '<img src="' + image2load + '"/>' + linktag2);
								
			//the title is the caption to load... use NAME rather than TITLE so tooltip doesn't pop up...
			var caption = $(this).parent().find('.caption').html();
			//print out the caption 
			$(rel + "_caption").html(caption);
			
			$('#hero').css("background", "url(" + image2load + ") no-repeat center top #728DB3");
			$('#featured_img').css("display", "none");
			
			return false;
		});
	});
}


function init_ajax_youtube(){
	$("a.init_ajax_youtube").each(function(){
		$(this).click(function(){
			//The rel attribute on the A link is the ID of the "featured" content page
			//this is where the image will go
			var rel = $(this).attr("rel");
			
			//the href is the youtube to load
			var href = $(this).attr("href");
			
			//Creates a new image
			
			var youtube_video1 = '<object width="560" height="349"><param name="movie" value="' ;
			var youtube_video2 =  href;
			var youtube_video3 = '=1&amp;hl=en_GB"></param><param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param><embed src="';
			var youtube_video4 =  href;
			var youtube_video5 = '?fs=1&amp;hl=en_GB" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="560" height="349"></embed></object>';

			$(rel).html(youtube_video1 + youtube_video2 + youtube_video3 + youtube_video4 + youtube_video5 );
			
			//the title is the caption to load... use NAME rather than TITLE so tooltip doesn't pop up...
			var caption = $(this).parent().find('.caption').html();
			//print out the caption 
			$(rel + "_caption").html(caption);
			
			$('#hero').css("background", "url(./images/gallery/hero_default.jpg) top center repeat-x #90ADD7");
			$('#featured_img').css("display", "inherit");
			return false;
		});
	});
}

