//	private namespace
var HYDRA		=	{};


//////////////////////////////////////////////////////////////////////////////////////////////
//
//	 panel object constructor
//

HYDRA.panel	=	function( inputId, panelId, dataSet, dataType )
	{

		
	//	get 'this' at top level for use inside of anonymous jquery event functions
	var cc				=	this;
	
	//	grab jquery objects for later use
	this.inputId		=	$('#'+inputId);
	this.panelId 		=	$('#'+panelId);
	
	//	public variables
	this.dataSet 		=	dataSet;
	this.filteredSet 	=	dataSet;
	this.dataSetCity	=	new Array();
	this.dataSetId		=	new Array();
	this.jsonData		=	"";
	this.dataType		=	dataType;
	this.started		=	"no";
	this.panelWidth		=	0;
	this.prevSearch		=	"";
	
	
	
	//////////////////////////////////////////////////////////////////////////////////////////////
	//
	//	Events
	//
	
	//	hide panel when close button is clicked
	$('#'+panelId+' > .close > a').click( function()
	{
		cc.hide();
		return false;
	});
	
	
	
	//	turn off field autocompletion
	this.inputId.attr('autocomplete', 'off');
	
	
	
	//	when clicked, run show()
	this.inputId.click( function()
	{
			// cc.ajaxCall(dataSet);
			// cc.panelId.show();
			cc.show();	
			cc.started	=	"yes";

	});



	//////////////////////////////////////////////////////////////////////////////////////////////
	//
	//	Keypresses
	//
	
	this.inputId.keyup( function( key ) 
	{
		
		switch(key.which)
		{

			//	when the escape key is pressed, hide panels
			case 27:
			
				$('.fayt').hide();
		
				return false;			
			  	break;   


			//	when the...
			case 40:

				return false;
			  	break;
			
			//	when anything else is pressed
			default:
			

				cc.ajaxCall(dataSet);
				return true;
				break;
		}
		return true;
		
	});
	
	
	
	//	when not clicked on, hide the panel
	$('html').click( function(target)
	{
		
		if( target.target.id != inputId && target.target.id != panelId)
		{
			cc.hide();
		}
		
	});

	


	//////////////////////////////////////////////////////////////////////////////////////////////
	//
	//	Shows the Panel
	//
	
	this.show 		=	function()
	{
			if ( cc.dataType == 'array') 
			{
				this.populate( cc.dataSet );
				this.panelId.show();
			};

			if ( cc.dataType == 'ajax') 
			{
				this.panelId.show();
				// this.panelId.css('display', 'inline');
			};

	};
	
	
	
	//////////////////////////////////////////////////////////////////////////////////////////////
	//
	//	Hides the panel
	//
	
	this.hide		=	 function()
	{
		 this.panelId.hide();
	};
	
	
	
	
	//////////////////////////////////////////////////////////////////////////////////////////////
	//
	//	Makes an ajax call and pops the results into an array to be populated
	//
	
	this.ajaxCall	=	function()
	{
	
		//	set up the JSON object to be sent
		this.jsonObject	=	{ 
			
			"searchTerm"	: 	this.inputId.val()
			
		}
				
		// check if this request is the same as the last, if different, make call
		if ( cc.prevSearch != this.inputId.val() ) 
		{
			
			cc.prevSearch	=	this.inputId.val();
			
			//	make the ajax call
			$.ajax({
				data: 		this.jsonObject,
				dataType: 	"json",
				url: 		"/locations/findAsYouType",
				success: 	function(data)
				{

					//	reset all arrays for the incoming data
					cc.jsonData				=	data;
					cc.dataSetCity.length	=	0;
					cc.dataSetId.length		=	0;


					//	loop through all the objects elements
					jQuery.each(cc.jsonData, function(i, val)
					{	

						//	push the returned json data into arrays
						cc.dataSetCity.push(cc.jsonData[i].city.name);
						cc.dataSetId.push(cc.jsonData[i].city.id)
					});

					//	populate the div
					cc.populate(cc.dataSetCity);						

			  	}
			});		
		}
		};

	

	
	//////////////////////////////////////////////////////////////////////////////////////////////
	//
	//	Takes the filtered Array and plugs it into the appropriate div, depending on how many items there are
	//
	
	this.populate	= 	function(items)
	{
		
		//	find the amount of elements in each column
		this.colCount	=	parseInt( items.length / 4);

		//	if there's a remainder, add another to each column
		if( items.length % 4 > 0 )
		{
			this.colCount++;
		}


		//	if there aren't enough to fill one column, just use the length of the states array 
		if (items.length  <= 4 )
		{
			this.colCount = items.length;
		}

		cc.panelWidth	=	170;
		this.colNum		=	1;
		
		//	empty and hide all the columns - must be done becase IE won't float them if the panel has no width
		$('#'+inputId+'_fayt_col1').empty();
		$('#'+inputId+'_fayt_col2').empty();
		$('#'+inputId+'_fayt_col3').empty();
		$('#'+inputId+'_fayt_col4').empty();

		$('#'+inputId+'_fayt_col1').hide();
		$('#'+inputId+'_fayt_col2').hide();
		$('#'+inputId+'_fayt_col3').hide();
		$('#'+inputId+'_fayt_col4').hide();

		
		if( items[0]	==	'No results found' || items.length	==	0)
		{
			cc.panelId.hide();
		}
		
		if( cc.panelId.css('display') == 'none' && items.length > 0 && items[0]	!=	'No results found' && cc.started == "yes")
		{
			 cc.panelId.show();
		}

		for ( var i=0; i <  items.length; )
		{
			this.colObj	=	'#'+inputId+'_fayt_col'+this.colNum;
			$(this.colObj).show();
			$(this.colObj).append('<ul id="state_list"></ul>');

			for ( var ci=0;  ci < this.colCount; ci++ )
			{
				// if there are states left
				if ( items[i] ) 
				{
	
					$(this.colObj).children().append('<li><a class="city_list_option" href="/show_region/'+cc.dataSetId[i]+'">' + items[i] + '</a></li>');
					
					i++;
				}
			}
			
			this.colNum++;
			$('#SearchCity_fayt').css('width', cc.panelWidth)
			cc.panelWidth += 170;
			
		}
	};
	
	
	//	initial grab of ajax data
	if ( cc.dataType == 'ajax') 
	{
		 this.ajaxCall(dataSet);
	}


}	//	end panel object constructor








$(document).ready(function() {
	
			
	//	Make objects for the panels
	HYDRA.box2	=	new HYDRA.panel('SearchCity', 'SearchCity_fayt', '', 'ajax');
	
	$('#hidden-cup-rating').css('display', 'none');	
	
	/////////////////////////////////////////////////////////////////////////////
	//
	//	selects all <input> values when clicked
	//
	
		$('input').click(function()
		{
			$(this).select();
		});
	



	/////////////////////////////////////////////////////////////////////////////
	//
	//	Confirm Ban User
	//

		$('.ban').click(function()
		{
			var answer = confirm("Are you sure you want to ban this user?")
			if (answer){
			}
			else{
				return false;
			}
			return true;
		});
		
		
	/////////////////////////////////////////////////////////////////////////////
	//
	//	Confirm Delete User
	//

		$('.delete').click(function()
		{
			var answer = confirm("Are you sure you want to delete this user?")
			if (answer){
			}
			else{
				return false;
			}
			return true;
		});
	
	

	/////////////////////////////////////////////////////////////////////////////
	//
	//	Login popup box show and hide
	//

	$('#showLogin').click( function()
	{
		$('#login_pop').toggle();
		return false;
	});


	$('#close_pop').click( function()
	{
		$('#login_pop').hide();
		return false;
	});



	/////////////////////////////////////////////////////////////////////////////
	//
	//	Cup-Rating system
	//		

	$('#cup-rating').show();

	HYDRA.rated		=	'no';


	//	on hover of a cup / unHover
	$('#cup-rating > li > a').hover( function()
	{
		if ( HYDRA.rated == 'no') {
			$(this).parent().prevAll().children('a').css('background-position', 'bottom left');
			$(this).parent().nextAll().children('a').css('background-position', 'top left');
			$(this).css('background-position', 'bottom left');
		};
	}
	,
	//	unHover
	function()
	{
		if (HYDRA.rated == 'no') {
			
			$(this).parent().prevAll().children('a').css('background-position', 'top left');
			$(this).css('background-position', 'top left');
		};
	}
	);
	
	
	// on click of a cup
	$('#cup-rating > li > a').click( function()
	{
		$(this).css('background-position', 'bottom left');
		$(this).parent().prevAll().children('a').css('background-position', 'bottom left');
		$(this).parent().nextAll().children('a').css('background-position', 'top left');
		
		this.current	=	$(this).text()-1;
		$('#hidden-cup-rating > dl > dd > input').eq(this.current).attr('checked', 'yes');
		
		HYDRA.rated	=	'yes';
		return false;
	});
	

	/////////////////////////////////////////////////////////////////////////////
	//
	//	Registration page hide and show 'other' input when it's selected
	//
	
	$('#ProfileHowDidYouHear').click( function()
	 {
		if( $(this).val()	==	'Other')
		{
			$('.other_hide').show();
		}
		else
		{
			$('.other_hide').hide();
		}
	});
	
	
	/////////////////////////////////////////////////////////////////////////////
	//
	//	Help Center Toggle answers
	//	

		$('.help > li > p').hide();
		
		$('.help > li > a').click( function()
		{

			$(this).siblings().slideToggle();
			return false;
		});

		
});