var thumbState = new Array();
$(document).ready(function(){

	$.ajax({
		type: "GET",
		url: "floor-tool-assets/floor-tool.xml",
		dataType: "xml",
		success: buildTool
  });
});


function buildTool(xml){

	// ---------------------------------------------------------------------
	// Categories
	// ---------------------------------------------------------------------
	 
	$(xml).find("category").each(function(i) {
		i ++;
		$("#filters").append("<li class='filter_category' id='category" + i + "'><div class='filter_title'>" + $(this).attr("title") + ":</div></li>");
		
		$("#category" + i).append("<ul></ul>");
		
		$(this).find("option").each(function() {
			var inputID = $(this).parent("category").attr("title").replace(" ","") + "_" + $(this).text().replace(" ","");
			$("#category" + i + " ul").append("<li class='filter_item'><input id='" + inputID + "' type='checkbox'> <label for='" + inputID + "'>" + $(this).text() + "</label></li>");
		});
		
	});

	$("#filters").wrapInner("<ul>");
	

	// ---------------------------------------------------------------------
	// Images
	// ---------------------------------------------------------------------

	$(xml).find("product").each(function(i) {
		i ++;

		var classes = "";
		$(this).find("filter").each(function() {
			classes += $(this).attr("category") + "_" + $(this).text().replace(/ /g, "") + " ";
		});

		$("#floor_tool_thumbnails").append("<li class='" + classes + "'><a href='#' rel='image_" + i + "'><img src='" + $(this).find("thumbnail").text() + "' alt='" + $(this).find("name").text() + "' /></a></li>");
	});

	$("#floor_tool_thumbnails").wrapInner("<ul>")
	
	$("#floor_tool_thumbnails img").hover(
		function() {$(this).addClass("hover")},
		function() {$(this).removeClass("hover")}
	);
	
	$("#floor_tool_thumbnails a").click(function() {

		//  Highlighting selected image
		$("#floor_tool_thumbnails a").removeClass("selected");
		$(this).addClass("selected");

		//  Displays selected image
		$("#floor_tool_large_images li").css("display","none");
		$("#floor_tool_large_images li#" + $(this).attr("rel")).css("display","block");

		// Prevents page from scrolling back to the top
		return false;

	});
	
	$(xml).find("product").each(function(i) {
		i ++;
		$("#floor_tool_large_images").append("<li id='image_" + i + "'><img src='" + $(this).find("image").text() + "' alt='" + $(this).find('name').text() + "' /></li>");
	});
	
	$("#floor_tool_large_images").wrapInner("<ul></ul>");
	
	$("#floor_tool_large_images li").css("display","none");
	$("#floor_tool_large_images li:first-child").css("display","block");
	
	
	//Attaching listners to filters
	$("#filters").find('ul li input').each(function(){$(this).bind('click', function(e){filterItems();});});
	updateFilters();
	
	
}
function updateFilters(){
	thumbs = $('#floor_tool_thumbnails li');
	for(i=0;i<thumbs.length; i++){
		thumbState[i]=1;
	}
}
function filterItems(){
	var thumbs = $('#floor_tool_thumbnails li');
	var thumbArray = updateThumbs(thumbs); 
	
	var categories = $('#filters .filter_category');
	
	var filters = new Array();
	var filterChecks = new Array();
	
	for(i=0; i<categories.length; i++){
		
		var filterInputs =  $(categories[i]).find('input');
		filters[i] = new Array();
		filterChecks[i] = new Array();
		
		for(j = 0; j<filterInputs.length; j++){
			if($(filterInputs[j]).is(':checked')){
				filterChecks[i][j] = 1;
			}else{
				filterChecks[i][j] = 0;
			}
			filters[i][j] = $(filterInputs[j]).attr('id');
		}
		
	}
	var nothumbs = true;
	for (var i = 0; i < thumbs.length; i++) {
		if(passesFilter(filters, filterChecks, thumbs[i])){
			nothumbs = false;
			if(thumbState[i] == 0){
				$(thumbs[i]).show('slow');
				thumbState[i] = 1;	
			}
			
		}else{
			if (thumbState[i] == 1) {
				$(thumbs[i]).hide('slow');
				thumbState[i] = 0;
			}
		}
	}
	if(nothumbs == false){
		$('#nothumbs').hide();
	}else{
		$('#nothumbs').show();
	}
	
}

function passesFilter(filters, filterChecks, item){
	var check = true;
	
	
	for (i = 0; i < filters.length; i++) {
		var allowedClasses = new Array();
		var atleastOneChecked = false;
		var count = 0;
		if (check == true) {
			for (j = 0; j < filterChecks[i].length; j++) {
				//inside filter item
				if (filterChecks[i][j] == 1) {
					atleastOneChecked = true;
					allowedClasses[count] = filters[i][j];
					count++;
				}
			}
			if (atleastOneChecked == true) {
				
				var innerCheck = false;
				for (k = 0; k < allowedClasses.length; k++) {
					if ($(item).hasClass(allowedClasses[k])) {
						innerCheck = true;
					}
				}
				if (innerCheck == false) {
					check = false;
				}
			}
			else {
				
				check = true;
			}
		}
	}
		

	return check;
}
function updateThumbs(thumbs){

	var result = new Array();
	for(i=0;i<thumbs.length;i++){
		if($(thumbs[i]).is(':hidden')){
			result[i] = 0;
		}else{
			result[i] = 1;
		}
	}
	return result;

}