$(document).ready(function(){
	
	
	$('#thbox').click(
		function() {
			$("#flashvideoBox").fadeOut("slow", function() {
			$('#flashvideoBox').html("<param name='movie' value='http://www.youtube.com/v/F8LDUhLSWuI&amp;autoplay=1'></param><param name='allowFullScreen' value='true'></param><param name='allowscriptaccess' value='always'></param><embed src='http://www.youtube.com/v/F8LDUhLSWuI&amp;autoplay=1' type='application/x-shockwave-flash' allowscriptaccess='always' allowfullscreen='true' width='537' height='344'></embed>");			
			//$('#flashvideoBox').html('<iframe width="537" height="344" src="http://www.youtube.com/embed/F8LDUhLSWuI" frameborder="0" allowfullscreen></iframe>');
			});
			$("#flashvideoBox").fadeIn("slow");
	});
	
	//Change The Big Image from the small COLOR thumbs
	$('div[class^=colorimages]').click(
		function() {
			var $this = $(this);
			var tempid = $this.attr("id");
			var id = tempid.split("_");
			
			
			$("#extraprice").fadeOut("slow");
			$("#displaysizes").fadeOut("slow");
			$("#displayImage").fadeOut("slow", function() {
										  
				checkAJAX();
				var url = "/Scripts/Ajax/changeimage2.ajax.asp";
				url += "?sid="+Math.random();
				url += "&imageID="+id[1];
				xmlHttp.onreadystatechange = updateImage;
				xmlHttp.open("GET",url,true);
				xmlHttp.send(null);
			
			});
		
	});
	
	//OPEN THE LIGHTBOX
	$('.makeBigger').click(
		function() {
			
			var $this = $(this);
			var tempid = $this.attr("id");
			var id = tempid.split("_");
			
			//ADD IN ALL OF THE CORRECT DIVS TO BUILD THE LIGHTBOX
			//$("<div id='myoverlay'><img src='/images/photoloader.gif' id='photoloader'></div></div>").before("#sideheader");
			//$("<div id='picholder'></div>").before("#myoverlay");
			//$("<div id='closephoto'><img src='/images/ico_closeviewer.png' /></div>").before("#picholder");
			$("#myoverlay").show("slow");
			$("#closephoto").fadeIn("slow", function(){
													 
				checkAJAX();  //Pull First BIG  Photo
				var pullfirsturl = "/Scripts/Ajax/pullthumbs.ajax.asp";
				pullfirsturl += "?sid="+Math.random();
				pullfirsturl += "&imageID="+id[1];
				pullfirsturl += "&action=pullFirst";
				xmlHttp.onreadystatechange = pullFirstPhoto;
				xmlHttp.open("GET",pullfirsturl,true);
				xmlHttp.send(null);
			//Debug.Trace(xmlhttp.readyState);
			});
			
			//Build the picture navigation
			//$("<div id='photoviewer'></div>").before("#myoverlay");
			
			checkAJAX(); // call ajax to populate the picture  nav
			var pullthumbsurl = "/Scripts/Ajax/pullthumbs.ajax.asp";
			pullthumbsurl += "?sid="+Math.random();
			pullthumbsurl += "&imageID="+id[1];
			pullthumbsurl += "&action=pullthumbs";
			xmlHttp.onreadystatechange = populatePhotoVavBar;
			xmlHttp.open("GET",pullthumbsurl,true);
			xmlHttp.send(null);
			
			
			//CLOSE the entire LIGHTBOX with photo.
			$("#closephoto").click(
				function () {
					
					$("#photoviewer").hide("slow",function() {
							//$("div").remove("#photoviewer");
					});
					$("#picholder").hide("slow",function() {
							//$("div").remove("#picholder");
					});
					$("#myoverlay").hide("slow",function() {
							//$("div").remove("#myoverlay");
					});
					$("#closephoto").hide("slow",function() {
							//$("div").remove("#closephoto");
					});
				});

		});

	
}); // END DOCUMENT.READY


function populatePhotoVavBar() {
	if( xmlHttp.readyState == 4 )
	{
		var thumbdata = xmlHttp.responseText
	
		// Populate the DIV with the thumbnails
		$('#photoviewer').html(thumbdata);
		// First wait until loaded to SlideDown.
		 $('#photoviewer img').bind("load", function() {
			   $("#photoviewer").slideDown( "normal", function() {
												 //alert("yes")
					//Hover action for THUMBS
					$("div[id=thumbphoto]").hover(
						function() {
							$(this).css("border" , "2px; solid #333333");
						},
						function() {
							$(this).css("border","1px solid #dddddd");
						});
					
					//ONCLICK action on each thumbnail to open larger photo
					$("img[class=thumbimg]").click(
						function () {
							var $this = $(this);
							var tempid = $this.attr("id");
							$("#picholder").fadeOut("fast",function(){
								checkAJAX();
								var url = "/Scripts/Ajax/pullthumbs.ajax.asp";
								url += "?sid="+Math.random();
								url += "&imageID="+tempid;
								url += "&action=pullSingle";
								xmlHttp.onreadystatechange = pullOnePhoto;
								xmlHttp.open("GET",url,true);
								xmlHttp.send(null);
							});
							
						});	
				});  
	     });
	}
		
}

function pullOnePhoto() {
	if( xmlHttp.readyState == 4)
	{
		var picdata = xmlHttp.responseText;
		$('#picholder').html(picdata);
		    $('#picholder img').bind("load", function() {
		     $('#picholder').fadeIn();  
	     });
	}
}

function pullFirstPhoto() {
	if( xmlHttp.readyState == 4)
	{
		var picfirstdata = xmlHttp.responseText;
	
		$('#picholder').html(picfirstdata);
		    $('#picholder img').bind("load", function() {
		     $('#picholder').fadeIn();  
	     });
	}
}

//Send the new updated version of list to the page
function updateImage()
{
	if( xmlHttp.readyState == 4)
	{
		var newdata = xmlHttp.responseText
		var splitdata = newdata.split("||||");
		
		var displayimages = splitdata[0];
		var displaysizes = splitdata[1];
		var extraprice = splitdata[2];
		
		
		$('#displayImage').html(displayimages);
		$('#displayImage img').bind("load", function() {
			$('#displayImage').fadeIn();  
		 });
		
		$("#displaysizes").html(displaysizes);
		$("#displaysizes").fadeIn("slow");
		
		$("#extraprice").html(extraprice);
		$("#extraprice").fadeIn("slow");
	}
}

function changeheaderimage(rollover,count)
{
	//alert(rollover)
	if(rollover)
	{
		document.getElementById("floathead_"+count).src = "/lynx/imagesSITEDYNAMIC/Images/Headers/"+rollover;
	}
}