var searchType = function(id) {
	return (id == 'synthetic_hair') ? 'Synthetic Hair' : 'Human Hair';		
}

$(document).ready(function() {
	
	$('#search_forms').hide();
	$search_buttons = $('.search_button');
	
	// toggle menu		
	$search_buttons.show().hover(function() {
		$(this).find('ul').show();
	},
	function() {
		$(this).find('ul').hide();
	});

	// toggle cursor
	$search_buttons.find('ul li').hover(function() { 
		$(this).toggleClass('hover') 
	}, 
	function() { 
		$(this).removeClass('hover') 
	}).click(function() {
		$link = $(this);
		$list = $link.parent();
		$list.hide();
		$search_type = searchType($list.parent().attr('id'));
		$.post('/our_collection/search/', {'search[for]': $link.html(), 'search[type]': $search_type}, function(data) {
			$('#search_results').html(data);
		});
	});
	
	// Wig colours
	$('#wig_colours a').click(function(event) {
		$spinners = $('#spinner, #spinner_img');
		$spinners.show();
		$colour_id = $(this).find('img').attr('id').substring(5,10);

		$.post('../wig_image/', {wig_image: $colour_id}, function(data) {
			$('#wig_image img:not(#spinner_img)').attr('src', data);
			$spinners.hide();
		})
		event.preventDefault();
	});
	
	
	////$wig_image = $('#wig_image img');
	////$wig_image.insertBefore('<span id="spinner"></span><img src="/images/ajax-loader.gif" id="spinner_img" alt="Loading..." />');
	//$spinner = $('#spinner');
	////$spinner.fadeIn(150);
	//$colour_id = $(this).find('img').attr('id').substring(5,10);
	//$.post('../wig_image/', {wig_image: $colour_id}, function(data) {
	//	$('#wig_image img').attr('src', data);
	//	//$spinner.fadeOut(150)
	//})
});