function AdvSearch(){
	this.strContainterName = '#AdvancedSearch';
	//This is not max height. This is the height that it will expand to.
	this.intMaxHeight = 535;
	this.intMinHeight = 0;
}

AdvSearch.prototype = {
	Show: function(){
		var self = this;
		var objSearchBar = $(this.strContainterName);
		
		objSearchBar.show().animate({ 
			height: self.intMaxHeight
		}, 320 , function(){
			$('#SearchBar').find('div.AdvancedButton div').css('backgroundPosition','0 0px');
		});
	},
	
	Hide: function(){
		var self = this;
		var objSearchBar = $(this.strContainterName);
		
		objSearchBar.animate({ 
			height: self.intMinHeight
		}, 320, function(){
			$(this).hide();
			$('#SearchBar').find('div.AdvancedButton div').css('backgroundPosition','0 -13px');
		});
	},
	
	Toggle: function() {

		if($(this.strContainterName).height() < this.intMaxHeight)
			this.Show();
		else
			this.Hide();
	}
}

function Filter(listRows){
	this.lists = null;
	this.listRows = listRows;
}

Filter.prototype = {
	Add: function(row, value, text){
	
		if(this.HasItem(row, value)) return;
	
		var filter = this.Create();
		filter.find('input')
			.val(value)
			.attr('name', 'category[]');
		filter.find('span').html(text);
		
		this.lists.find('ul[list='+row+']').append(filter);
		
		this.lists.find('ul[list="Region"] input').attr('name', 'region[]'); 
	},
	
	HasItem: function(row, value){
	
		items = this.lists.find('ul[list='+row+'] li input[value='+value+']');

		if(items.length > 0)
		{
			return true;
		}
		
		return false;
	},
	
	Create: function(){
		var filter = $('<li />')
				.append('<span />')
				.append('<input type="hidden" value="" />')
				.append('<div />');
				
			filter.find('div').click(function(){
				$(this).parent().remove();
			}).hover(function(){
				$(this).css('backgroundPosition','0px 0px');
				$(this).css('cursor','pointer');
			}, function(){
				$(this).css('backgroundPosition','14px 0px');
				$(this).css('cursor','default');
			});
			
		return filter;
	},
	
	Remove: function(target){
		target.remove();
	},
	
	BuildList: function(target){
		this.lists = target;
		
		$.each(this.listRows, function(index, val){
			$('<div class="Row"/>').append('<span class="RowName">'+val+'</span><ul class="FilterList" list="'+index+'"/>')
				.appendTo(target);
		});
		
		
	}
	
}

$(document).ready(function() {
	var form = $('form');
	
	$.keyCode = { 
		ENTER: 13
	};
	
	//instantiate an instance of the search 
	var objSearch = new AdvSearch();
	
	//bind the toggle to the click event, and hover to change pointer
	$('#SearchBar div.Search  div  div.AdvancedButton').click(function(){
		objSearch.Toggle();
	}).hover(function() {
		$(this).css('cursor','pointer');
	} , function() {
		$(this).css('cursor','default');
	});
	
	//bind a click event to the search icon as well as hover events
	//enable the enter key ONLY when the textbox has focus, on blur removes it
	$('#SearchBar div.Search  div  img').click(function(){
		form.submit();
	}).hover(function() {
		$(this).css('cursor','pointer');
	} , function() {
		$(this).css('cursor','default');
	}).focus(function(){
		$(this).keyup(function(e) {
			if(e.keyCode == $.keyCode.ENTER) {
				form.submit();
			}
		});
	}).blur(function(){
		$(this).unbind('keyup');
	});
		
	var filters = new Filter(rows);
	//build the filter list in the target area
	filters.BuildList($('#AdvancedSearch div.Filters'));
	
	//bind the selectboxes to add on change
	$('#AdvancedSearch').find('select')
		.change(function()
		{
			//get the list name, this is used to add items to the filter list
			listName = $(this).attr("list"); 
			//add the filter
			filters.Add(listName, $(this).val(), $(this).find(":selected").text());
			//reset the select box
			$(this).val(0);
		});

});