(function ($) {

    $.fn.Calories = function (searchUrl) {
    	if(searchUrl == '') searchUrl = location.href;
        setCalories($(this).attr("id"), searchUrl);
        return true;
    }
})(jQuery);

var result_Count   =  0;
var result_Selected = -1;
var delay = 300;
var searchPage = null;

var divResultsID = "divAutoCompleteResults";//ниспадающее меню
var divTxtResultsID = "divAutoCompleteTxtResults";//список выбранных позиций

var divSummResultID = "divSummTxtResults";

var txtSearchBox = null;
var divResults  = null;

function setCalories(searchBoxID, searchUrl) {

	// initialize vars
    searchPage = searchUrl;
    
	// register mostly used vars
	txtSearchBox = $("#" + searchBoxID);
    
	divTxtResults = $("#" + divTxtResultsID);
	divSummResult = $("#" + divSummResultID);
	inputSearchBox= $("#" + searchBoxID);

	// create the results div
	createResultsDiv();
	
	// on blur listener
	txtSearchBox.blur(function(){ setTimeout("clearResults()", 200) });

	// on click
	txtSearchBox.click(function (e) {
		var lastSearch = txtSearchBox.val();
		updateResults(lastSearch);
		//alert('click on txtSearchBox');
		
	});
	
	// on key up listener
	txtSearchBox.keyup(function (e) {

	    // get keyCode (window.event is for IE)
	    var keyCode = e.keyCode;// || window.event.keyCode;
	    var lastSearch = txtSearchBox.val();

	    // check for an ENTER 
	    if (keyCode == 13) {
	        OnEnterClick();
	        return;
	    }

	    // check an treat up and down arrows
	    if (OnUpDownClick(keyCode)) {
	        return;
	    }

	    // check for an ESC
	    if (keyCode == 27) {
	        clearResults();
	        return;
	    }

	    // if is text, call with delay
	    setTimeout(function () { updateResults(lastSearch) }, delay);

	});
}
function updateSumm(){
	var sumResult = 0;
	var isChildren = 0;
	var sumGramm = 0;
	
	divTxtResults.find('div.result').remove();
	divTxtResults.find('div.tools').remove();
	divTxtResults.find('div.showhidden').remove();
	
	divTxtResults.children(':visible').each(function(i){
		isChildren = 1;
		$(this).find('span.ccal').html(Math.round($(this).find('div.ccal').text()*$(this).find('input@[name=grams]').val())/100);
		sumResult = sumResult + Math.round($(this).find('div.ccal').text()*$(this).find('input@[name=grams]').val())/100;
		sumGramm = sumGramm + Math.round($(this).find('input@[name=grams]').val()*100)/100;
	});

	if(isChildren){
		divTxtResults.append('<div class="result"><span class=name>Итого в ' +  Math.round(sumGramm*100)/100 + ' гр </span><span class="ccal">' +  Math.round(sumResult*100)/100 + ' ккал</span></div>');
	}
	
	if(divTxtResults.children(':hidden').length>0){
		divTxtResults.append('<div class="showhidden" style="display:none;"><a href="#">Показать скрытые (' + divTxtResults.children(':hidden').length +' шт.) </a></div>');
		$('div.showhidden').fadeIn('fast', function(){
			$(this).click(function(){
				divTxtResults.children(':hidden').fadeIn('fast', function (){
					updateSumm();
				});
				$('div.showhidden').hide();
				return false;
			});
		});
	}
	
	if(divTxtResults.children(':hidden').length == 0 && isChildren == 0){
		divTxtResults.css("display","none");
	}
}

// treat the auto-complete action (delayed function)
function updateResults(lastSearchWord)
{
	// get the field value
	var searchWord = txtSearchBox.val();

	// if it's empty clear the resuts box and return
	if(searchWord == ''){
		clearResults();
		return;
	}

	// if it's equal the value from the time of the call, allow
	if(lastSearchWord != searchWord || searchWord.length < 2){
		return;
	}
	
	inputSearchBox.css("background", "url(/media/img/ajax.loading.gif) no-repeat 3px 3px");
	
	$.ajax({
	    type: "POST",
	    //ToDo: relative url
	    url: searchPage,
	    data: inputSearchBox.attr('name') + "=" + searchWord,
	    cache: false,
	    dataType: "json",
	    success: function (response) {

	        // get the total of results
	        inputSearchBox.css("background", "url(/media/img/bg-search.gif) no-repeat 5px 6px");
	        
	        divResults.empty();
	        
            // update the results div
			for(var oid in response){
				divResults.append('<div><input type="text" name="grams" style="display:none;" value="100" />'
						 + '<span class=name>' + response[oid]['name'] + '<a class="delete" href="#" style="display:none;"></a></span>'//ккалл
						 + '<span class="ccal">' + response[oid]['ccal'] + '</span>'//ккалл
						 + '<div class="ccal" style="display:none;">' + response[oid]['ccal'] + '</div>'//ккалл
						 + '<span class="fat" style="display:none;">' + response[oid]['fat'] + '</span>'//жиры
						 + '<span class="protein" style="display:none;">' + response[oid]['protein'] + '</span>'//белки
						 + '<span class="carbohydrates" style="display:none;">' + response[oid]['carbohydrates'] + '</span>'//углеводы

						 //+ '<span class="water" style="display:none;">' + response[oid]['water'] + '</span>'//вода
						 //+ '<span class="section" style="display:none;">' + response[oid]['section'] + '</span>'//раздел
						 + '</div>');
			}
	            
	        if(divResults.length > 0){
	            
	            divResults.highlight(searchWord);
	            divResults.css("display", "block");

	            // for all divs in results
	            var divs = $("#" + divResultsID + " > div");
                
                //setting the number of suggested items
                result_Count = divs.size();

	            // on mouse over clean previous selected and set a new one
	            divs.mouseover(function () {
	                divs.each(function () { this.className = "unselected"; });
	                this.className = "selected";
	            })

	            // on click copy the result text to the search field and hide
	            divs.click(function () {
			        $(this).removeHighlight();
			        
			        $(this).find('span').show();
			        $(this).find('input').show();
			        
			        divTxtResults.append('<div>' + $(this).html()+'</div>');
					divTxtResults.find('input').change(function (){
						updateSumm();
					});
					
	                divTxtResults.find('a.delete').click(function (){
	                	$(this).parent().parent().fadeOut('fast', function(){
	                		updateSumm();
	                	});
	                	return false;
	                });
	                divTxtResults.find('div').mouseover(function () {
	                	$(this).find('a.delete').show()
	                });
	                divTxtResults.find('div').mouseout(function () {
	                	$(this).find('a.delete').hide()
	                });
	                
	                divTxtResults.show();
	                updateSumm();
	            });
	        }else{
	        	clearResults();
	        }
	        
	    }
	});
}

// clear auto complete box
function clearResults()
{
	divResults.html('<div>Ничего не найдено</div>');
	divResults.css("display","none");
	//divResults.empty();
}

// create the results div accordingly to the search field
function createResultsDiv() {

    //  create the div results
    $("body").append('<div id="' + divResultsID + '"></div>');
    divResults = $("#" + divResultsID);

	// get the field position
	var searchBox_Position    = txtSearchBox.offset();
	var searchBox_Top    = searchBox_Position.top;
	var searchBox_Left   = searchBox_Position.left;

	// get the field size
	var searchBox_Height = txtSearchBox.height();
	var searchBox_Width  = txtSearchBox.width();

	// apply the css styles - optimized for Firefox
	divResults.css("position","absolute");
	divResults.css("left", searchBox_Left - 2);
	divResults.css("top", searchBox_Top + searchBox_Height );
	divResults.css("width", searchBox_Width - 2);
	divResults.css("z-index","2");
}


// treat up and down key strokes defining the next selected element
function OnUpDownClick(keyCode) {
	if(keyCode == 40 || keyCode == 38){

		if(keyCode == 38){ // keyUp
			if(result_Selected == 0 || result_Selected == -1){
				result_Selected = result_Count-1;
			}else{
				result_Selected--;
			}
		} else { // keyDown
			if(result_Selected == result_Count-1){
				result_Selected = 0;
			}else {
				result_Selected++;
			}
		}

		// loop through each result div applying the correct style
		divResults.children().each(function(i){
		    if (i == result_Selected) {
		        //txtSearchBox.val($(this).find("#" + hdnSelecetedTextID)[0].value);
				this.className = "selected";
			} else {
				this.className = "unselected";
			}
		});

		return true;
	} else {
		// reset
		result_Selected = -1;
		return false;
	}
}
function OnEnterClick() {
    divResults.children().each(function (i) {
        if (i == result_Selected) {
	        $(this).removeHighlight();
	        $(this).find('span').show();
	        $(this).find('input').show();
	        $(this).find('a').show();
	        
	        divTxtResults.append('<div>' + $(this).html()+'</div>');
			divTxtResults.find('input').change(function (){
				updateSumm();
			});
			
            divTxtResults.find('a.delete').click(function (){
               	$(this).parent().parent().fadeOut('fast', function(){
            		updateSumm();
            	});
            	return false;
            });
            divTxtResults.find('div').mouseover(function () {
            	$(this).find('a.delete').show()
            });
            divTxtResults.find('div').mouseout(function () {
            	$(this).find('a.delete').hide()
            });
			
            divTxtResults.show();
            updateSumm();
        }
    });
    clearResults();
}