// JavaScript Document
$(document).ready(function() { 

		//$(".ArchiveWork").slideDown(5000);
		
		//$("#WorkDesc").css("visibility","hidden");
		//$("#WorkDesc").fadeTo("slow",1);
		
		$("img.ImgThumbnail").animate({
			opacity:0.3
		});

		CheckPos();

		// => Hover Effect for Thumbnails
		$("img.ImgThumbnail").hover(
			function() {

				var CurrentImgID 	= $("img[id^='WorkImage-']").attr("id");
				var CurrentHoverImg = $(this).parent("a").parent("span").attr("class");				
				if(CurrentImgID != CurrentHoverImg) {
				
					// Reset all images to alpha 30
					$(".ImgThumbnail").stop().animate({
						opacity: 0.3
					});	

					$(this).stop().animate({
						opacity: 1
					});
				}
			},

			function() {

				var CurrentImgID 	= $("img[id^='WorkImage-']").attr("id");
				var CurrentHoverImg = $(this).parent("a").parent("span").attr("class");				
				
				if(CurrentImgID != CurrentHoverImg) {
					$(this).stop().animate({
						opacity: 0.3
					});
				}
			}
		);


		// => Hover Effect for Big Image
		/* $("img.WorkLargeImage").hover(
			
			function() {
				$("#WorkDesc").css("visibility","visible");
				$("#WorkDesc").fadeIn("slow");
			},
			function() {
				$("#WorkDesc").fadeOut("slow");
			}
		); */
	
		$("a[class^='LargeImg-']").live('click',function(event) {
			if (event.button != 0) { return true; }	
			$("#WorkDesc").fadeOut(500);
			
			var NewImage		= $(this).attr("class");
			var NewImageDesc    = $(this).attr("rel");
			var NewImageID 		= $(this).parent("span").attr("class");
			NewImage 			= NewImage.replace("LargeImg-","");
			NewImageID 			= NewImageID.replace("WorkImage-","");
			//alert(NewImage);
			
			
			$("img.WorkLargeImage").fadeOut(500, function() {
				$("#WorkDesc").html(NewImageDesc);				 // => Change Desc
				$("img.WorkLargeImage").attr("id","WorkImage-" + NewImageID);		 // => Change ID
				//$(this).attr("src",).fadeTo("slow",1); // => Change Image
				$(this).load(function() {$("#WorkDesc").fadeIn(500); $(this).fadeIn(500);} ).attr({ src: "../Uploads/Image/" + NewImage });
				CheckPos();
			});
			return false;

		});

		
		$("#NextImg").live('click',function(event) {
			if (event.button != 0) { return true; }	

			if($("#NextImg").attr("src") != "../Images/next-off.jpg"){
				$("#WorkDesc").fadeOut(500,0);
			}
			
			// => Get the current imageID, needed to traverse the filmstrip with next()
			var CurrentImgID = $("img[id^='WorkImage-']").attr("id");
			CurrentImgID = CurrentImgID.replace("WorkImage-","");
			
			//alert("CurrentImgID => " + CurrentImgID);

			// => Get the new image ID, desc, src1
			var NewImage 		= $("span.WorkImage-" + CurrentImgID).parent("div.content-item").next().children("span").children("a").attr("class");
			var NewImageID 		= $("span.WorkImage-" + CurrentImgID).parent("div.content-item").next().children("span").attr("class"); 
			var NewImageDesc	= $("span.WorkImage-" + CurrentImgID).parent("div.content-item").next().children("span").children("a").attr("rel");
			NewImage 			= NewImage.replace("LargeImg-","");
			NewImageID 			= NewImageID.replace("WorkImage-","");

			//alert(NewImage);
			//alert("NewImageID => " + NewImageID);

			$("img.WorkLargeImage").fadeOut(500, function() {
				$("#WorkDesc").html(NewImageDesc);									// => Change Desc
				$("img.WorkLargeImage").attr("id","WorkImage-" + NewImageID);		 // => Change ID
				//$(this).attr("src",).fadeTo("slow",1); // => Change Image
				$(this).load(function() { 
					$("#WorkDesc").fadeIn(500);
					$(this).fadeIn(500);} ).attr({ src: "../Uploads/Image/" + NewImage });
				CheckPos();
			});
			return false;
		});


		$("#PrevImg").live('click',function(event) {
			if (event.button != 0) { return true; }	
			//$("#WorkDesc").css("visibility","hidden");	

			if($("#PrevImg").attr("src") != "../Images/prev-off.jpg"){
				$("#WorkDesc").fadeOut(500,0);
			}					

			// => Get the current imageID, needed to traverse the filmstrip with next()
			var CurrentImgID = $("img[id^='WorkImage-']").attr("id");
			CurrentImgID = CurrentImgID.replace("WorkImage-","");
			
			//alert("CurrentImgID => " + CurrentImgID);
			//alert($("li.WorkImage-" + CurrentImgID).prev().children("a").html());
			
			// => Get the new image ID, desc, src
			var NewImage 		= $("span.WorkImage-" + CurrentImgID).parent("div.content-item").prev().children("span").children("a").attr("class");
			var NewImageID 		= $("span.WorkImage-" + CurrentImgID).parent("div.content-item").prev().children("span").attr("class"); 
			var NewImageDesc	= $("span.WorkImage-" + CurrentImgID).parent("div.content-item").prev().children("span").children("a").attr("rel");
			NewImage 			= NewImage.replace("LargeImg-","");
			NewImageID 			= NewImageID.replace("WorkImage-","");
			
			//alert("New Image -> " + NewImage);
			//alert("New ImageID -> " + NewImageID);
			//alert("New Image Desc -> " + NewImageDesc);
			
			//$("#WorkDesc").fadeTo("slow",0);
			$("img.WorkLargeImage").fadeOut(500, function() {
				$("#WorkDesc").html(NewImageDesc);				 // => Change Desc
				$("img.WorkLargeImage").attr("id","WorkImage-" + NewImageID);		 // => Change ID
				//$(this).attr("src",).fadeTo("slow",1); // => Change Image
				$(this).load(function() { 
					$("#WorkDesc").fadeIn(500);
					$(this).fadeIn(500);} ).attr({ src: "../Uploads/Image/" + NewImage });
				CheckPos();
			});
			return false;
		});

				
		// Check to see if we are at the beginning or at the end of the filmstrip
		function CheckPos() {
			
			//$("#PrevImg").css("display","none");
			//$("#NextImg").css("display","none");

			var FirstImage = $("#content-holder > div.content-item:first > span").attr("class");
			var LastImage  = $("#content-holder > div.content-item:last > span").attr("class");
			var CurrentImg = $("img[id^='WorkImage-']").attr("id");

			//alert(CurrentImg);
			//alert($("span." + CurrentImg).children("a").children("img").attr("src"));
			
			//$("span." + CurrentImg).children("a").children("img").animate({
			//	opacity:1
			//});

			if(CurrentImg != FirstImage ) {	
				//alert("prev on");
				$("#PrevImg").parent("div.gallery_links").html("<a href='#' id='PrevImg'><img src='../Images/prev.jpg' alt='' title='' /></a>&nbsp;")
			} else {
				//alert("prev off");
				$("#PrevImg").parent("div.gallery_links").html("<img src='../Images/prev-off.jpg' id='PrevImg' />");
				//$("#PrevImg").css("display","none");
			}

			if(CurrentImg != LastImage ) {
				$("#NextImg").parent("div.gallery_links").html("<a href='#' id='NextImg'><img src='../Images/next.jpg' alt='' title='' /></a>&nbsp;")
			} else {
				$("#NextImg").parent("div.gallery_links").html("<img src='../Images/next-off.jpg' id='NextImg' />");
			}	

			Cufon.replace('div#WorkDesc');
		}

		$("#content-slider").slider({
			animate: true,
			
			change: handleSliderChange,
			slide: handleSliderSlide
		 });
		
		
		
		function handleSliderChange(e, ui)
		{
		  var maxScroll = $("#content-scroll").attr("scrollWidth") - $("#content-scroll").width();
			
		  $("#content-scroll").animate({
				scrollLeft: ui.value * (maxScroll / 100) }, 1000);
		}
		
		function handleSliderSlide(e, ui)
		{
		  var maxScroll = $("#content-scroll").attr("scrollWidth") -
						  $("#content-scroll").width();
		  $("#content-scroll").attr({scrollLeft: ui.value * (maxScroll / 100) });
		}

		CheckPos();

});