var ReloadPageTimer;
$(document).ready(function () {

    $.ui.autocomplete.prototype._renderItem = function( ul, item ) {

     var t = item.label.replace(new RegExp("(?![^&;]+;)(?!<[^<>]*)(" + $.ui.autocomplete.escapeRegex(this.term) + ")(?![^<>]*>)(?![^&;]+;)", "gi"), "<span style='font-weight:bold;'>$1</span>");

      return $( '<li></li>' )
      .data( 'item.autocomplete', item )
      .append( '<a> <img src="'+item.icon+'"> <span  style="vertical-align:top;">' + t + '</span> </a>' )
      .appendTo( ul );
    };
    
	$("#search-user").autocomplete({
    			source: baseUrl + "action/search-user", 
    			minLength: 2,
    			select: function(event, ui) {
                			$("#search-user").val( ui.item.label );
                			$("#search-user-id").val( ui.item.id );
                			return false;
                		}
    		             
    });

	// Die PHP Datei schreib ein Array "filter" in dem als Strings die einzelnen Filter-Optionen hinterlegt sind!
	for (i in filter) {
		// Die OnClick-Eigenschaft für jeden Filter-Link setzen
		$(".filter-" + filter[i]).click(function(e) {
			// Original-Verhalten vom Link verhindern
			e.preventDefault();
			btn = $(this);
			// Radiobutton-Verhalten
			if(btn.hasClass('radio')) {
				if(!btn.hasClass('selected')) {
					for (i in filter) {
						if(btn.hasClass("filter-" + filter[i])) {
							$(".filter-" + filter[i]).removeClass('selected');
						}
					}
					btn.addClass('selected');
				}
			}
			//Checkbox-Verhalten
			if(btn.hasClass('check')) {
				btn.toggleClass('selected');
			}
			filterVal = $(this).attr("id")
			if(filterVal) filterVal = filterVal.split("-");
			if(filterVal[1] != "selectbox") {
				//console.log(filterVal[1]);
				PrepareLoad();
			}
		}); 
		$("#" + filter[i] + "-selectbox").change(function() {
			for (i in filter) {
				if($(this).hasClass("filter-" + filter[i])) {
					$("#" + filter[i] +"-x").click();
				}
			}
			PrepareLoad();
		}); 
	}
});

function PrepareLoad() {
	window.clearTimeout(ReloadPageTimer);
	ReloadPageTimer = window.setTimeout("LoadUsers()", 1000);
	if($("#loading").size() == 0) {
		$("div#users-wrapper table tbody").prepend('<tr><td colspan="4"><div id="loading">Aktualisiere...</div></td></tr>');
		$("#loading").hide();
		$("#loading").slideDown("slow");
	}
}

function LoadUsers() {
	var filterstring = "";
	for (i in filter) {
		//console.log(filter[i]);
		// Haben wir es mit Radios oder Checkboxen zu tun?
		if($(".filter-" + filter[i]).hasClass('radio')) {
			filterID = $(".filter-" + filter[i]).filter(".selected").attr("id");
			if(filterID) filterID = filterID.substr(0,filter[i].length);
			filterVal = $(".filter-" + filter[i]).filter(".selected").attr("id")
			if(filterVal) filterVal = filterVal.substr(filter[i].length+1);
			if(filterVal == "x") {
				filterVal = $("#"+ filter[i] +"-selectbox").val();
			}
			filterstring += filterID +'='+filterVal;
		}
		if($(".filter-" + filter[i]).hasClass('check')) {
			number = $(".filter-" + filter[i]).filter(".selected").size();
			if(number > 0) {
				filterstring += $(".filter-" + filter[i]).filter(".selected").attr("id").substr(0,filter[i].length) + '=';
				for(j = 0; j < number; j++) {
					filterstring += $(".filter-" + filter[i]).filter(".selected").eq(j).attr("id").substr(filter[i].length+1) + ',';
				}
				filterstring = filterstring.substr(0, filterstring.length-1);
			}
		}
		filterstring += "&";
	}
	filterstring = filterstring.substr(0, filterstring.length-1);

//	console.log(filterstring);

	// AJAX Load mit Callback
	$("#content").load(baseUrl + 'personen/', { ajaxCall : true, ajaxFilter : filterstring }, function() {
//		console.log("Done");
	}); 
}