var searching, timer;
var selected = 0;

jQuery(function(){

	$("#search").append('<div id="searchbox"></div>');
	$("#search").append('<img id="loading" src="/images/loading.gif" />');

	$("#searchfield").keyup(function(event) {

		if ((event.keyCode == 38 || event.keyCode == 40) && searching == true) {
			if (event.keyCode == 40 && selected < 5) {
				$('#searchbox table tr:nth-child('+(selected+1)+')').removeClass("selected");
				selected = selected + 1;
				$('#searchbox table tr:nth-child('+(selected+1)+')').addClass("selected");
			} else if (event.keyCode == 38 && selected > 0) {
				$('#searchbox table tr:nth-child('+(selected+1)+')').removeClass("selected");
				selected = selected - 1;
				$('#searchbox table tr:nth-child('+(selected+1)+')').addClass("selected");
				if (selected == 0) {
					$('#searchfield').select();
				}
			}
			event.preventDefault();
		} else if (selected > 0 && event.keyCode == 13) {
			window.location = $('#searchbox table tr:nth-child('+(selected+1)+') td:first-child a').attr("href");
			event.preventDefault();
		} else if (event.keyCode == 9 || event.keyCode == 37 || event.keyCode == 39 || event.keyCode == 38 || event.keyCode == 40) {
			event.preventDefault();
		} else if ($(this).val() != "" && $(this).val().substr(0,7) != "http://" && $(this).val().substr(0,8) != "spotify:") {
			var currentSearch = $(this).val();
			$("#loading").fadeIn('fast');
			
			clearTimeout(timer);
			
			timer = setTimeout(function() {

				$("#searchbox").load("/suggest", {query: currentSearch}, function() {
					$("#searchbox").fadeIn('fast');
					$("#loading").fadeOut('fast');
					selected = 0;
					searching = true;
				});				
				
			}, 2000);
			
		} else {
			selected = 0;
			searching = false;
			clearTimeout(timer);
			$("#loading").fadeOut('fast');
			$("#searchbox").fadeOut('fast');
		}

	});

});