//handle colour flags
function init_swatches()
{
	$('.swatch_val').hide();
	
	//run through each colour flag and see if it's checked if so tick it.
	$('.swatch').each(function(){
	
	    check = $(this).find('input:checkbox');
		if(check.is(':checked')){
			$(this).addClass('ticked');
			$(this).append('<div class="swatch_tick"></div>');
		}
	});
}



/***************************
/ clears all the filter
/ by unchecking everything
***************************/
function clear_filter()
{
	
	$('.swatch').each(function(){
			
	    check = $(this).find('input:checkbox');
		check.attr('checked',false);
		check.removeClass('ticked');
			check.parent().find('.swatch_tick').remove();
		
	});
	$('#narrow_search').submit();
}




/***************************
/ toggles the state of the 
/ checkbox and returns the
/ state true=checked
/***************************/
function toggle_checkbox(cb)
{
	var state;
		check = cb.find('input:checkbox');
		if(check.is(':checked')){
		
			cb.removeClass('ticked');
			check.attr('checked',false)
			cb.find('.swatch_tick').remove();
			state = false;
			
		}
		else {
			check.attr('checked',true)
			cb.addClass('ticked');
			cb.append('<div class="swatch_tick"></div>');	
			state = true;
			
		}
		
	return state;
}





 $(document).ready (function ()  {
	 
 	$('#clear_filter').show();
 	$('#clear_filter').click(function(){
 	  clear_filter();
	 });
 $('.swatch').click(function(){
 
		toggle_checkbox($(this));
		$('#narrow_search').submit();
		
	
	});
 	$('#search_submit').hide();
 	init_swatches();
});