var recipeSearchQ = Array();

$(document).ready(function() {	
	$('.jsHide').hide();
	$('.jsShow').show();
	
	$('.jsSubmitForm').click(function() {
		$(this).parents('form').submit();
	});
	
	ajaxSubmitForm($('#recipeSeach'), recipeSearch);
	$('#recipeQ').keyup(function(e) {
		if($(this).val().length >= 3) {
			var index = recipeSearchQ.push('');
			recipeSearchQ[index-1] = $(this).val();
			setTimeout(function () { seachDelay( index-1 )}, 500); // Call the searchfunction with a delay in ms

//			recipeSearchQ.push($('#recipeQ').val());
//			index = recipeSearchQ.length;
//			functionCall = function() {seachDelay(index-1)};
//			setTimeout(functionCall, 500);
		}
	});
	$('#recipeSeach').submit(function() {
		$('#searchResult').children().remove();
		$('#searchResult').after('<div class="loaderImage"><img src="/img/loader.gif"></div>');
	});
});

function seachDelay(index) {
	var currVal = $.trim($('#recipeQ').val()); // The current value without starting and ending whitespaces 
	if(recipeSearchQ[index-1] == recipeSearchQ[index]) { // If this request has the same search query as the previous, fix for very fast writers
		return;
	}
	var prevVal = $.trim(recipeSearchQ[index]); // The previous value without starting and ending whitespaces
	if(currVal != prevVal) { // If the user has written somthing since the function call
		return;
	}
	$('#recipeSeach').submit();
}

function recipeSearch(data) {
	resultList = $('#searchResult');
	$('.loaderImage').remove();
	$('#resultLink').html('');
	
	$(resultList).children().remove();
	if(data['results'] == 0) {
		$(resultList).append('<li class="noStyle bold">'+data['message']+'</li>');
	} else {
		for(var i in data['result']){
			$(resultList).append('<li class="topBorder"><a href="/recept/'+data['result'][i]['Recipe']['string_id']+'">'+data['result'][i]['Recipe']['title']+'</a></li>');
		}
		$('#resultLink').html('Länk till resultatet, <a href="/recept/sok/'+data['query']+'">'+data['query']+'</a>');
	}
}

function ajaxSubmitForm(form, callback) {
	$(form).submit(function(e) {
		e.preventDefault();
		url = $(this).attr('action');
		method = $(this).attr('method');
		data = '';
		// TODO, extend to more then just input
		$(this).find('input').each(function() {
			if($(this).attr('name').length > 0) {
				data = data + '&' + $(this).attr('name') + '=' + $(this).val();
			}
		});
		$.ajax({
			type: method,
			url: url,
			data: 'data[AjaxJSON]=1' + data,
			cache: false,
			dataType: 'json',
			success: function(data){
				callback(data);
			}
		});
		return false;
	});
	
		//$(form).submit();
	
}