// JavaScript Document
$(document).ready(function() {
$(".motif_nav,.motif_nav_tall,.large_image,.clothing, img").hide();	
//initiate vars
var z=1;
var all_images;
var wrapper=$(".wrapper_main");

$("img").css({"opacity":"0"}).show();
//fade funstion
$.fn.wait_fade = function(){
	var p=all_images.index(this);
	var n=all_images.length;
	if(!this.complete){
		$(this).animate({"opacity":"1"},800);
	setTimeout(function() {
		if((p+1)!=n){
	all_images.eq(p+1).wait_fade();
	}				
	 },100);
		}else{
	$(this).load(function(){
	$(this).animate({"opacity":"1"},800);
	setTimeout(function() {
		if((p+1)!=n){
	all_images.eq(p+1).wait_fade();
	}				
	 },100);
						  });
		}
	};

//get hash (motif selection) and remove #
var motif_name=window.location.hash.substr(1);

//--- ON LOAD check hash and show these styles ---\/

if(motif_name==""){ //if hash empty show all
	all_images=wrapper.find("div:visible").find("img");
	all_images.eq(0).wait_fade();
	$("#all").find("a").css({"borderBottom":"1px solid #333333"});
	
}else{ //if hash exists show that style
   wrapper.find("div[class*=style]").hide();
   wrapper.find("div[class*=motif]").hide();
   wrapper.find("div[id*="+motif_name+"]").show().find("div[class*=motif_title]").show();
   all_images=wrapper.find("div:visible").find("img");
   all_images.eq(0).wait_fade();
   $(".styles_menu").find("#"+motif_name).find("a").css({"borderBottom":"1px solid #333333"});
}

//style menu 
$(".style_item").click(function(){
							   var motif_name=$(this).attr("id");
							   if(motif_name!="all"){
								wrapper.find("div[class*=motif]").hide().find("img").css({"opacity":"0"});
							   wrapper.find("div[class*=style]").hide();
							   wrapper.find("div[id*="+motif_name+"]").show().find("div[class*=motif_title]").show();
							   
							   $("div[class*=motif]").each(function(){
							   if ($(this).css("width")=="342px"){
							   $(this).find("div[class*=nav]").show();
							   }
							   });
							   
							   all_images=wrapper.find("div:visible").find("img");
							   all_images.eq(0).wait_fade();
							   window.location.hash=motif_name;
							   $(".style_item").find("a").css({"borderBottom":"none"});
							    $(".styles_menu").find("#"+motif_name).find("a").css({"borderBottom":"1px solid #000000"});
								}else{
								wrapper.find("div:not([class*=nav])").show().find("div[class*=motif_title]").show();
								var all_images=wrapper.find("div:visible").find("img");
								all_images.css({"opacity":"0"});
								all_images.eq(0).wait_fade();
								window.location.hash="";
								 $(".style_item").find("a").css({"borderBottom":"none"});
								 $("#all").find("a").css({"borderBottom":"1px solid #000000"});
								}
							   });
/*-----------------------WIDE motif actions----------------*/
//----motif hover
$(".motif").hover(function(){
			z++;
			$(this).css({"z-index":z, "overflow":"visible"});
			$(this).find(".motif_info").fadeIn(300);
			/*$(this).find(".plus").fadeIn(200);*/
			},function(){
			$(this).find(".motif_info").fadeOut(100);
			/*$(this).find(".plus").fadeOut(100);*/
			});
//----motif click
$(".motif").find(".motif_image").click(function(){
			z++;	
			$(this).css({"z-index":z, "overflow":"visible"});
			$(this).parent().find(".motif_info").hide();
			var motif_name=$(this).attr("title");
			if ($(this).attr("alt")=="small"){
			var imageSrc=($(this).attr("src")).replace("thumb","small/"+motif_name+"1");
			$(this)
			.attr({"alt":"large"})
			.animate({"width":"420px", "height":"300px"},
							function (){
				$(this).attr({"src":imageSrc});
				$(this).parent().find(".motif_info").fadeIn(300);})
			.parent().animate({"width":"420px", "height":"300px"},function(){
																var d=$(window).scrollTop()+$(window).height();
																var offset=$(this).offset();
																var a=offset.top;
																var b=d-a
																var c=370-b;
																var new_scroll=$(window).scrollTop()+c;
																if(b<370){
																$("html,body").animate({scrollTop: new_scroll}, 300);}
																})
			.css({"z-index":z})
			.find(".motif_info").css({"height":"60px","width":"420px", "top":"300px"})
			.find(".motif_nav").show();
			$(this).parent().find(".plus").text("-");
			} else {
			$(this)
			.attr({"alt":"small"}).animate({"width":"210px", "height":"150px"}, function (){
				$(this).parent().find(".motif_info").fadeIn(300);})
			.parent().animate({"width":"210px", "height":"150px"})
			.find(".motif_info").css({"height":"37px","width":"210px", "top":"150px"})
			.parent().find(".motif_nav").hide();
			$(this).parent().find(".plus").text("+");
			}
			});
/*-----------------------TALL motif actions----------------*/
//----motif hover
/*$(".motif_info_tall, .motif_info").hover(function(){
									 $(this).parent().find(".plus").hide();
									 },function(){
										  $(this).parent().find(".plus").show();
										 });*/
$(".motif_tall").hover(function(){
			z++;
			$(this).css({"z-index":z, "overflow":"visible"});
			$(".motif_info_tall").hide();
			$(this).find(".motif_info_tall").fadeIn(200);
			$(this).find(".plus").fadeIn(200);
			},function(){
			$(this).find(".motif_info_tall").fadeOut(100);
			/*$(this).find(".plus").fadeOut(100);*/
			});
//----motif click
$(".motif_tall").find(".motif_image").click(function(){
			z++;			
			$(this).parent().find(".motif_info_tall").hide();
			var motif_name=$(this).parent().attr("id");
			//if small image
			if ($(this).attr("alt")=="small"){
			var imageSrc=($(this).attr("src")).replace("thumb","small/"+motif_name+"_1");
			$(this)
			.attr({"alt":"large"})
			.animate({"width":"342px", "height":"444px"},
							function (){
				$(this).attr({"src":imageSrc});
				$(this).parent().find(".motif_info_tall").fadeIn(300);
				})
			.parent().animate({"width":"342px", "height":"444px"},function(){
																var d=$(window).scrollTop()+$(window).height();
																var offset=$(this).offset();
																var a=offset.top;
																var b=d-a
																var c=510-b;
																var new_scroll=$(window).scrollTop()+c;
																if(b<510){
																$("html,body").animate({scrollTop: new_scroll}, 300);}
																})
			.css({"z-index":z})
			.find(".motif_info_tall").css({"height":"60px","width":"342px", "top":"442px"})
			.find(".motif_nav_tall").show()
			.parent()
			.find(".clothing").show();
			
			$(this).parent().find(".plus").text("-");
			//if large image
			} else {
			$(this)
			.attr({"alt":"small"}).animate({"width":"171px", "height":"220px"}, function (){
				$(this).parent().find(".motif_info_tall").fadeIn(300);})
			.parent().animate({"width":"171px", "height":"220px"})
			.find(".motif_info_tall").css({"height":"37px","width":"171px", "top":"220px"})
			.parent()
			.find(".motif_nav_tall").hide()
			.parent()
			.find(".clothing").hide();
			$(this).parent().find(".plus").text("+");
			}
			});
/*-----------------------motif video tall----------------*/
$(".video_link").click(function(){
			z++;
			$(".video").css({"zIndex":z});
			var video_name=$(this).attr("id");
				$(".video_container").flash({
				src: "../../products/"+wrapper.attr("id")+"/video/"+video_name+"/"+video_name+".swf",
				width: 342,
				height: 220
				});
				$(".video").fadeIn(300);
				});
			
/*-----------------------motif navigation actions ----------------*/
//----motif nav hover
$(".zoom, .right, .left").hover(function(){
										 $(this).css({"borderBottom":"2px solid #000000"});
										 },function(){
										$(this).css({"borderBottom":"1px solid #000000"});
										 });
//----motif nav left 
$(".left").click(function(){
						  var current_number=parseInt($(this).parent().find(".current_number").html());
						  var total_number=parseInt($(this).parent().find(".total_number").html());
						  var motif_path=$(this).parent().parent().parent().find(".motif_image").attr("src").slice(0,-5);
						  if(current_number==1){
							$(this).parent().parent().parent().find(".motif_image").fadeOut(100, function(){
							$(this).attr({"src":motif_path+total_number+".jpg"});
							$(this).load(function(){$(this).fadeIn(500);});
							current_number=total_number;
							$(this).parent().find(".current_number").html(current_number);
																								   });
						 }else{
							$(this).parent().parent().parent().find(".motif_image").fadeOut(200, function(){
							var prev_image=current_number-1;
							$(this).attr({"src":motif_path+prev_image+".jpg"});
							$(this).load(function(){$(this).fadeIn(500);});
							current_number=prev_image;
							$(this).parent().find(".current_number").html(current_number);
																								   });
						}
						  });
//----motif nav right 
$(".right").click(function(){
						  var current_number=parseInt($(this).parent().find(".current_number").html());
						  var total_number=parseInt($(this).parent().find(".total_number").html());
						  var motif_path=$(this).parent().parent().parent().find(".motif_image").attr("src").slice(0,-5);
						  if(current_number==total_number){
							$(this).parent().parent().parent().find(".motif_image").fadeOut(200, function(){
							$(this).attr({"src":motif_path+"1.jpg"});
							$(this).load(function(){$(this).fadeIn(500);});
							current_number=1;
							$(this).parent().find(".current_number").html(current_number);
																								   });
						 }else{
							$(this).parent().parent().parent().find(".motif_image").fadeOut(200, function(){
							var next_image=current_number+1;
							$(this).attr({"src":motif_path+next_image+".jpg"});
							$(this).load(function(){$(this).fadeIn(500);});
							current_number=next_image;
							$(this).parent().find(".current_number").html(current_number);
																								   });
						}
						  });

/*-----------------------zoom navigation ----------------*/
//----large image nav
$(".large_close, .large_right, .large_left, .large_close_vid").find("span").hover(function(){
										 $(this).css({"borderBottom":"3px solid"})
										 },function(){
										$(this).css({"borderBottom":"2px solid"})
										 });

var current_product_large;
var current_number_large;
var total_number_large;
var motif_path_large;
//----motif nav zoom 
$(".zoom").click(function(){
						 z++;
						 $(".large_image").css({"zIndex":z});
						 current_product_large=$(this).parent().parent().parent();
						 current_number_large=parseInt($(current_product_large).find(".current_number").html());
						 total_number_large=parseInt($(current_product_large).find(".total_number").html());
						 motif_path_large=$(current_product_large).find(".motif_image").attr("src").replace("small", "large").slice(0,-5);
						$(".zoomed_image").attr({ "src":motif_path_large+current_number_large+".jpg"});
						//remove nav for 1 img
						if(total_number_large==1){
							$(".large_left, .large_right").hide();
							}else{
								$(".large_left, .large_right").show();
								}
						
						
						 $(".large_image").fadeIn(300);
						 $(".zoomed_image").css({"display":"block"}).load(function(){
												$(this).animate({"opacity":"1"});
												$(".large_loading").hide();
												//current_product_large.hide();
												});
						   });
//----zoom nav right 
$(".large_right").click(function(){
						  if(current_number_large==total_number_large){
							$(".zoomed_image").hide();
							$(".large_loading").show();
							$(".zoomed_image").attr({ "src":motif_path_large+"1.jpg"});
							$(".zoomed_image").load(function(){$(this).fadeIn(300);$(".large_loading").hide();});
							current_number_large=1;
							$(current_product_large).find(".current_number").html(current_number_large);																	  
						 }else{
							$(".zoomed_image").hide();
							$(".large_loading").show();
							var next_image_large=current_number_large+1;
							$(".zoomed_image").attr({"src":motif_path_large+next_image_large+".jpg"});
							$(".zoomed_image").load(function(){$(this).fadeIn(300); $(".large_loading").hide();});
							current_number_large=next_image_large;
							$(current_product_large).find(".current_number").html(current_number_large);
							}
						  								});
//----zoom nav left 
 $(".large_left").click(function(){
						  if(current_number_large==1){
							$(".zoomed_image").hide();
							$(".large_loading").show();
							$(".zoomed_image").attr({ "src":motif_path_large+total_number_large+".jpg"});
							$(".zoomed_image").load(function(){$(this).fadeIn(300);$(".large_loading").hide();});
							current_number_large=total_number_large;
							$(current_product_large).find(".current_number").html(current_number_large);
																								  
						 }else{
							$(".zoomed_image").hide();
							$(".large_loading").show();
							var prev_image_large=current_number_large-1;
							$(".zoomed_image").attr({"src":motif_path_large+prev_image_large+".jpg"});
							$(".zoomed_image").load(function(){$(this).fadeIn(300);$(".large_loading").hide();});
							current_number_large=prev_image_large;
							$(current_product_large).find(".current_number").html(current_number_large);
							}
						  								});
 //----zoom nav close 
$(".large_close").click(function(){
								 $(".zoomed_image").attr({ "src":" "});
								 $(".large_image").fadeOut(300);
								 $(current_product_large).find(".motif_image").attr({"src":motif_path_large.replace("large","small")+current_number_large+".jpg"});
								 current_product_large.show();
								 });
$(".large_close_vid").click(function(){
									 $(".video").fadeOut(300);
									 $(".video_container").html("");
									 });

});
