$(document).ready(function() {
  // Hides notice bar when it is not used
  if(jQuery.trim($("#notice_bar").html()).length == 0)
    $("#notice_bar").hide();

	$("ul.colour_selector li").each(function() {
		
		var _col = this;
		
		jQuery("input:checkbox", _col).each(function (i) {
			this.style.display = "none";
			
			jQuery(this).siblings("p").wrap('<a href="" class="colour-button '+ this.value +'"></a>');
			
			if (this.checked) {
				jQuery(this).siblings("a").each(function (i) {
					$(this).addClass("selected");
					jQuery("span", _col).addClass("selected");
				})
			}
			
		});

		jQuery("a.colour-button", _col).click(function () { 
			chk_box = $(this).siblings("input:checkbox")[0];
			chk_box.checked = !chk_box.checked;
			
			if (chk_box.checked) {
				jQuery("span", _col).addClass("selected");
				$(this).addClass("selected");
			} else {
				jQuery("span", _col).removeClass("selected");
				$(this).removeClass("selected");
			}
			 
			return false;
		});
		
	});
	
	$("ul.thread_selector li").each(function () {
		var _col = this;
		
		jQuery("input:checkbox", _col).each(function (i) {
			this.style.display = "none";
			
			jQuery(this).siblings("span").wrap('<a href="" class="thread-button '+ this.value +'"></a>');
			
			if (this.checked) {
				jQuery(this).siblings("span a").each(function (i) {
					$(this).addClass("selected");
				});
			}
			
		});
		
		jQuery("a.thread-button", _col).click(function () { 
			chk_box = $(this).siblings("input:checkbox")[0];
			chk_box.checked = !chk_box.checked;
			
			if (chk_box.checked) {
				$(this).addClass("selected");
			} else {
				$(this).removeClass("selected");
			}
			 
			return false;
		});
		
	});
	
	var selectable_items = jQuery("ul.colour_selector input:checkbox").length;
	
	jQuery("ul.colour_selector.selects_all").append('<li class="select-all"><a href="" id="colour_select_all">Select all</a></li>');
	
	jQuery("ul.colour_selector a#colour_select_all").click(function () {
	
		var num_selected = 0;
		jQuery("ul.colour_selector input:checkbox").each(function () {
			if (this.checked) {
				num_selected++;
			}
		});
				
		if (num_selected >= selectable_items) {
			jQuery("ul.colour_selector a.colour-button").removeClass("selected");
			jQuery("ul.colour_selector input:checkbox").attr("checked", false);
		} else {
			jQuery("ul.colour_selector a.colour-button").addClass("selected");
			jQuery("ul.colour_selector input:checkbox").attr("checked", true);
		}
		
		return false;
	});
	
	$('#image_rotate').innerfade({ 
			speed: 3000, 
			timeout: 10000, 
			type: 'sequence', 
			containerheight: '348px'
	});
	
	
	$("form#setup_shop").validate();
	//$("form#new_customer").validate();
	
	// Change image with fade effect
	$('img.product_thumbnail').click(function(){
    var new_image_path = $(this).parent().attr('href');
    var default_image = $('.product_image img.default_image');
    var replacement_image = $('.product_image img.fadeto_image');
    if(default_image.is(':visible')) {
      replacement_image.attr('src', new_image_path);
      replacement_image.fadeIn(600);
      default_image.fadeOut(600);
    } else {
      default_image.attr('src', new_image_path);
      default_image.fadeIn(600);
      replacement_image.fadeOut(600);
    }
    return false;
	});
	
	//Click on what is personlise print info in thread window
  $('a.what_is_personlise').click(function(){
    var new_image_path = '/images/static/what_is_personlise.gif';
    var default_image = $('.product_image img.default_image');
    var replacement_image = $('.product_image img.fadeto_image');
    if(default_image.is(':visible')) {
      replacement_image.attr('src', new_image_path);
      replacement_image.fadeIn(600);
      default_image.fadeOut(600);
    } else {
      default_image.attr('src', new_image_path);
      default_image.fadeIn(600);
      replacement_image.fadeOut(600);
    }
    return false;
  	
  })	
	// Make lists collapsable in shop navigation
	$('.shop_navigation a.item_selected').click(function(){
	  $(this).find('~ ul').slideToggle('fast');
	});
	
	//Hide product description, then show it onlu when mouse hover
	$('.product_preview .product_info').hide();
	
	$('.product_preview').mouseover(function(){
	  $(this).find('.product_info').show();
	}).mouseout(function(){
	  $(this).find('.product_info').hide();
	});
});