// Jquery Utilities Document

$(document).ready(function() {
						   
/**********navigation***********/

	//production hover
	$("li#prod-hold").hover(
	  function () {
		$("ul#raphael").css("visibility","hidden");
	  }, 
	  function () {
		$("ul#raphael").css("visibility","visible"); 
         
	  });
	//Raphael hover
	$("li#raphael-hold").hover(
	  function () {
		$("ul#production").css("visibility","hidden");
	  }, 
	  function () {
		$("ul#production").css("visibility","visible"); 
         
	  });
	
	$("li#raphael-hold").hover(
	  function () {
		$("ul#photography").css("visibility","hidden");
	  }, 
	  function () {
		$("ul#photography").css("visibility","visible"); 
         
	  });
	//photography hover
	$("li#photo-hold").hover(
	  function () {
		$("ul#raphael").css("visibility","hidden");
	  }, 
	  function () {
		$("ul#raphael").css("visibility","visible"); 
         
	  });
	
 	  $("li#photo-hold").hover(
	  function () {
		$("ul#gallery").css("visibility","hidden");
	  }, 
	  function () {
		$("ul#gallery").css("visibility","visible"); 
         
	  });
	 //Gallery
	 $("li#gallery-hold").hover(
	  function () {
		$("ul#photography").css("visibility","hidden");
	  }, 
	  function () {
		$("ul#photography").css("visibility","visible"); 
         
	  });
	 
/**********details page***********/

$(window).load(function () {
						 

	// set width of 'img-group-hold' div
	$(".img-group-hold").each(function() {
		
			var id = $(this).attr("id");
			var img1 = $(this).find(".img").width();
			var img2 = $(this).find(".img2").width();
			//alert("div id: " + id + " image 1 width: " + img1 + " image 2 width: " + img2);
			var browser=navigator.userAgent.toLowerCase();
			if(browser.indexOf("safari") != -1) {
				$(this).width(img1 + img2 + 1);
				//alert("safari");
			}else {
				$(this).width(img1 + img2 + 1);
				//alert($(this).width());
				//$(this).getImageWidth($(this), img1, img2);
			}
		
	});
	//add selected class to first 'img-group-hold'
	$("#hold1").removeClass('img-group-hold').addClass('selected');
	

});
//show caption on hover event
	$("#t1 td div.img-group-hold img").hover(
	  function () {
		var id = $(this).attr("id");
		//alert(id);
		$("#img" + id).css("visibility","visible");
	  }, 
	  function () {
		var id = $(this).attr("id");
		$("#img" + id).css("visibility","hidden");
	  }
	);
		//show/highlight both images
		$('#t1 td div.img-group-hold').live('mouseover mouseout', function(event) {
			  if (event.type == 'mouseover') {
			    $(this).find('img').css('opacity','1.0');
			  } else {
			  	//check for IE version 8
			  	if (jQuery.browser.msie && jQuery.browser.version == "8.0") {
			    	$(this).find('img').attr('style', '0.5');// on mouseout
			    }else {
			    	$(this).find('img').attr('style', '');// on mouseout

			    }
			  }
		});
		
		//show/highlight both images in .selected class
		$('#t1 td .selected').live('mouseover mouseout', function(event) {
			  if (event.type == 'mouseover') {
			    $(this).find('img').css('opacity','1.0');
			  } else {
			    $(this).find('img').attr('style', '1.0');// on mouseout
			  }
		});

//get all images
function allImgs(id, lrgId, celebId) {
	
	//variables
	var imgSrc = '';
	var newImgId = '';
	var newImgId2 = '';
	var newImgSrc = '';
	var newImgSrc2 = '';
	var newLrgImg = '';
	var newLrgImg2 = '';
	
	//loop through thumbnails and find current image selected
	$('#t1 img').each(function(idx, item) {
    	//imgSrc += item.src;
		if($(this).is('#' + id)) {
			//set 'imgSrc' to selected image src
			imgSrc = item.src;
			//alert("equal : " + imgSrc);
			return false;
		}
	});
	
	//var num = $('#t1 .img-group-hold').length;
	//alert(num);
	
	//set new id for large images
	newImgId = id;
	newImgId2 = id;
	
	// navigate left
	if(lrgId) {
				//'newImgId' decrement back two values
				newImgId--;
				newImgId--;
				//remove current selected class
				$('.selected').removeClass('selected').addClass('img-group-hold');
				// add selected class to new group pair
				$('#hold' + newImgId).removeClass('img-group-hold').addClass('selected');
			
				//'newImgId2' increment forward one value
				newImgId2++;
				//then 'newImgId2' decrement back two values
				newImgId2--;
				newImgId2--;
	}
	//navigate right
	else {
				//'newImgId2' increment forward three values
				newImgId2++;
				newImgId2++;
				//remove current selected class
				$('.selected').removeClass('selected').addClass('img-group-hold');
				// add selected class to new group pair
				$('#hold' + newImgId2).removeClass('img-group-hold').addClass('selected');
			
				newImgId2++;
				//'newImgId' decrement back one value
				newImgId--;
				//then 'newImgId2' increment forward three values
				newImgId++;
				newImgId++;
				newImgId++;
				//alert("first image id: " + newImgId + " second image id: " + newImgId2)
	}
	// is there a even first image
	if($('#t1 td div.selected').find('.img').length != 0) {
		newImgSrc = $('#' + newImgId).attr('src');
		newLrgImg = newImgSrc.replace(/small/,'xlarge');
	}else {
		newImgSrc = "";
		newLrgImg = "images/blank.jpg";

	}
	
	// is there a even last image
	if($('#t1 td div.selected').find('.img2').length != 0) {
		newImgSrc2 = $('#' + newImgId2).attr('src');
		newLrgImg2 = newImgSrc2.replace(/small/,'xlarge');
	}else {
		newImgSrc2 = "";
		newLrgImg2 = "images/blank.jpg";
	}

	//window.alert("new id : " + newImgId + " new src : " + newImgSrc + "new large image1 : " + newLrgImg + "new large image2 : " + newLrgImg2);
	var img1Width, img2Width
	//advertising/Fashion
	if(!celebId) {
		$('#image1').attr("src", newLrgImg);
		$('#image2').attr("src", newLrgImg2);
	}
	//Celebrities
	else {
		$('#celebImage1').attr("src", newLrgImg);
		$('#celebImage2').attr("src", newLrgImg2);
		
		/*img1Width = $('#celebImage1').width();
		img2Width = $('#celebImage2').width();
		$('#celebHold1').width(img1Width);
		$('#celebHold2').width(img2Width);*/
	}

}

	//Advertising/Fashion show previous button
	/*$("#large-img-hold").hover(
	  function () {
		var imgWidth = $("#large-img-hold .large1").attr("width");
		var disp = 'block';
		if($("#large-img-hold .large1").attr("src") == "images/blank.jpg") {
			disp = 'none';
		}
		//window.alert('width : ' + imgWidth);
		$("#btn-prev").css({
			'display' : disp ,
			'right' : imgWidth + 'px'
		  }
		);
	  }, 
	  function () {
		$("#btn-prev").css({
			'display' : 'none',
			'right' : '0'
		  }
		);
	  });*/
	
	//Advertising/Fashion show next button
	/*$("#large-img-hold2").hover(
	  function () {
		var imgWidth = $("#large-img-hold2 .large2").attr("width");
		var disp = 'block';
		if($("#large-img-hold2 .large2").attr("src") == "images/blank.jpg") {
			disp = 'none';
		}
		$("#btn-next").css({
			'display' : disp,
			'left' : imgWidth + 'px'
		  }
		);
	  }, 
	  function () {
		$("#btn-next").css({
			'display' : 'none',
			'left' : '0'
		  }
		);
	  });*/
	
	//Celebrities show previous button
	/*$("#celebHold1").hover(
	  function () {
		$("#btn-celeb-prev").css({
			'display' : 'block',
			'left' : '-40px'
		  }
		);
	  }, 
	  function () {
		$("#btn-celeb-prev").css({
			'display' : 'none',
			'left' : '0'
		  }
		);
	  });
	
	//Celebrities show next button
	$("#celebHold2").hover(
	  function () {
		$("#btn-celeb-next").css({
			'display' : 'block',
			'left' : '441px'
		  }
		);
	  }, 
	  function () {
		$("#btn-celeb-next").css({
			'display' : 'none',
			'left' : '0'
		  }
		);
	  });*/
	
	//Advertising and Fashion large image select
	$("#large-img-hold img").click(function () {
		var imgId = $('.selected img').attr('id');
		//window.alert(imgId);
		if(imgId != 1) {
			allImgs(imgId, $(this).attr('id'));
			//selectImg();
		}
		
	});

	$("#btn-prev").click(function () {
		var imgId = $('.selected img').attr('id');
		//window.alert(imgId);
		if(imgId != 1) {
			allImgs(imgId, $("#large-img-hold img").attr('id'));
			//selectImg();
		}
		
	});
	
	$("#btn-next").click(function () {
		var imgId = $('.selected img').attr('id');
		var imgId2 = $('.selected img:last').attr('id');
		var maxn = $('#t1 img').length;
		//maxn--;
		//window.alert("max images : " + maxn + " selected img : " + imgId);
		if(imgId2 != maxn) {
			allImgs(imgId);
			//selectImg();
		}
	})
	$("#large-img-hold2 img").click(function () {
		var imgId = $('.selected img').attr('id');
		var imgId2 = $('.selected img:last').attr('id');
		var maxn = $('#t1 img').length;
		//maxn--;
		//window.alert("max images : " + maxn + " selected img : " + imgId);
		if(imgId2 != maxn) {
			allImgs(imgId);
			//selectImg();
		}
	});
	
	//Celebrities large image select
	$("#celebImage1").click(function () {
		var imgId = $('.selected img').attr('id');
		//window.alert(imgId);
		if(imgId != 1) {
			allImgs(imgId, $(this).attr('id'), 1);
			//selectImg();
		}
											  
	});
	
	$("#celebImage2").click(function () {
		var imgId = $('.selected img').attr('id');
		var imgId2 = $('.selected img:last').attr('id');
		var maxn = $('#t1 img').length;
		//maxn--;
		//window.alert("max images : " + maxn + "selected img : " + imgId);
		if(imgId2 != maxn) {
			allImgs(imgId, null, 1);
			//selectImg();
		}
	});
	
// display large images when thumbnail is clicked
	$("#t1 td div.img-group-hold").click(function () { 
		  //http://forum.jquery.com/topic/change-img-src-and-a-href-on-click
		  //alert("image pair div holder clicked ");
		  var id = $(this).attr("id");
		  var selectedId = $(".selected").attr("id");
		  //alert(selectedId);
		  var imgUrl1 = $(this).find(".img").attr("src");
		  var imgUrl2;
		  // is there a even last image
		  if($(this).find(".img2").length != 0) {
		  	imgUrl2 = $(this).find(".img2").attr("src");
		  }else{
			   imgUrl2 = "images/blank.jpg";
		  }
		  var largeUrl = imgUrl1.replace(/small/,'xlarge');
		  var largeUrl2 = imgUrl2.replace(/small/,'xlarge');
		  //alert(largeUrl);
		  if($("#large-img-hold").find.length != 0 && $("#large-img-hold2").find.length != 0) {
		  	$("#image1").attr("src", largeUrl);
			$("#image2").attr("src", largeUrl2);
		  }		  
		  //Celebrities
		  if($("#celeb-large-img-hold").find.length != 0) {
			  $("#celebImage1").attr("src", largeUrl);
			  $("#celebImage2").attr("src", largeUrl2);	  	  
		  }
		  
		  //add 'selected' class to 'img-group-hold' div
		  //$(this).toggleClass("selected");
		  if(selectedId != "") {
			  	$('.selected').removeClass('selected').addClass('img-group-hold');
                
		  }
		  if($(this).attr("id") == id) {
				//alert("active: " + id); 
				$(this).removeClass('img-group-hold').addClass('selected');

		  }
		  
	});
});