$(document).ready(function() {
 
	initFilters();
	initPagingWithFilter(".paged", ".short", "ul.paging");
});
 
/***************************************************************************************/
function initFilters() {
 
  showAllItems();	
  hideEmptyDiv();
 
  window.filters = new Array();
  window.courseFilter = new Array();
  window.ingredientFilter = new Array();
  window.filteredIngredients = new Array();
  window.filteredCourses = new Array();
  window.filteredRecipes = new Array();
 
  $("#receptenfilter input[type=checkbox]").click(function() {
    updateFilters($(this));
    updateRecipeUI();
  });
}
 
function updateFilters(clicked) {
	filters = [];
	courseFilter = [];
	ingredientFilter = [];
 
	$("#receptenfilter .gang input[type=checkbox]:checked ").each(function() {
		if($(this).val() != "on")
			courseFilter.push($(this).val());
	});
 
	$("#receptenfilter .bestanddeel input[type=checkbox]:checked").each(function() {
		ingredientFilter.push($(this).val());
	});
 
  	//bij allegangen de andere gangen afchecken
	if($(clicked).attr("id") == "allegangen") {
		 $("#receptenfilter .gang input[type=checkbox]").each(function() {
			if($(this).attr("id") != "allegangen")
				$(this).removeAttr("checked");
		});
	}else{
		var allegang = $("#receptenfilter #allegangen");
		//allegang.checked = false;
		if(courseFilter.length > 0)
			allegang.removeAttr("checked");
	}
 
 	filteredCourses = new Array();
 
	if(courseFilter.length > 0) {
		$("#recipes article").each(function() {
			var recipe = this;
 
			courseFilter.forEach(function(el) {
				if($(recipe).find("a[data-course=" + el + "]").length > 0)
					filteredCourses.push(recipe);
			});
		});
	} else if($("#receptenfilter #allegangen").attr("checked")) {
		$("#recipes article").each(function() {
			filteredCourses.push(this);
		});
	}
 
 	filteredRecipes = new Array();
 
  	if(ingredientFilter.length == 0)
		filteredRecipes = filteredCourses;
	else {
		filteredCourses.forEach(function(recipe) {
			ingredientFilter.forEach(function(ing) {
				if($(recipe).find("a[data-ingredient=" + ing + "]").length > 0)
					filteredRecipes.push(recipe);
			});
		});
	}
	/*
	console.log("courses filter: " + courseFilter.length);
	console.log("ing filter: " + ingredientFilter.length);
 
	console.log("filtered courses: " + filteredCourses.length);
	console.log("recipes: " + filteredRecipes.length);
	*/
}
 
function updateRecipeUI() {
	$("#recipes article").hide();
	$("#recipes article").removeClass("visible");
 
	hideEmptyDiv();
 
	if(filteredRecipes.length == 0) {
		if( $("#receptenfilter #allegangen").attr("checked"))
			showAllItems();
		else
			showEmptyDiv();
	} else {	  
		filteredRecipes.forEach(function(recipe) {
			showItem(recipe);	
		});
	}
	initPagingWithFilter(".paged", ".short", "ul.paging");
}
 
 
 
function showEmptyDiv(){
	$("#pagingempty").show();
	$(".paging").hide();
}
 
function hideEmptyDiv(){
	$("#pagingempty").hide();
	$(".paging").show();
} 
 
function showItem(theItem){
	$(theItem).show();
	$(theItem).addClass("visible");
}
 
function showAllItems(){
	$("#recipes article").show();	
	$("#recipes article").addClass("visible");
}
 
function initPagingWithFilter(container, item, nav){
 
	var itemsPerPage = 5;
	var currentPage, totalPages;
 
	var container = $(container);
	var nav = $(nav);
 
	var items =  $(container).children(".visible");
 
	//console.log("items: " + $('.visible').length);
 
	totalPages = Math.ceil( $('.visible').length/itemsPerPage);
 
	nav.empty();
 
	// back button
	var backButton = nav.append('<li><a class="backLink" href="#">&laquo;</a></li>');
 
	for(var i = 0; i < totalPages; i++){
		// populate nav with page links
		var pageItem = nav.append('<li><a class="pageLink" href="#" data-page="' + i + '">' + (i+1).toString() + "</a></li>");
	}
 
	// next button
	var nextButton = nav.append('<li><a class="nextLink" href="#">&raquo;</a></li>');
 
	$('li a', nav).click(function(evt){
		evt.preventDefault();
 
		if($(this).hasClass('pageLink')){		
			pageTo(parseInt($(this).attr('data-page')));
		}else if($(this).hasClass('backLink')){
			pageTo(currentPage - 1);
		}else if($(this).hasClass('nextLink')){
			pageTo(currentPage + 1);
		}
	});
 
	pageTo(0);
 
	function pageTo(newPage){
		currentPage = newPage;
 
		// active page state
		$('li a', nav).removeClass('active');
		$('li a[data-page=' + currentPage + ']').addClass('active');
 
		// manage next & back button visibility
		if(currentPage == totalPages - 1){
			$('li .nextLink', nav).hide();
		}else{
			$('li .nextLink', nav).show();
		}
 
		if(currentPage == 0){
			$('li .backLink', nav).hide();
		}else{
			$('li .backLink', nav).show();
		}
 
		// show hide
		items.each(function(i){
			if(i >= currentPage*itemsPerPage && i < currentPage*itemsPerPage+itemsPerPage){
				$(this).fadeIn("slow");
			}else{
				$(this).hide();
			}
		});
	}
}
}