$(function() {
	$("img").lazyload({
		placeholder : "/imgs/transparent.gif",
		effect : "fadeIn",
		threshold: 150
	});
	
	// Hide filter from showing by default and enable additional functionalitiy
	$('#update_view').hide();
	$('#filter_form').hide();
	
	$('#filter').prepend('<a href="#" id="filter_toggle">Show filter</a>');
	$('#tags').after('<a href="#" id="select_toggle">Unselect all</a>'); 
	
	$('#select_toggle').click(function() {
		if ($('#select_toggle').text() == 'Unselect all') {
			checked = false;	
			$('#select_toggle').text('Select all');
		} else {
			checked = true;
			$('#select_toggle').text('Unselect all');		
		}
		
		$('#filter_form :checkbox').each(function(index, checkbox) {
			$(checkbox).attr('checked', checked);	
		});
		filter();
		return false;
	});
	
	$('#filter_toggle').click(function() {
		if ($('#filter_toggle').text() == 'Show filter') {
			$('#filter_toggle').text('Hide filter');
			$('#filter_form').show('500');
		} else {
			$('#filter_toggle').text('Show filter');			
			$('#filter_form').hide('500');			
		}
	});
	
	$('#filter_form').change(function() {
		filter();
	});
	
	$('#filter_form').submit(function() {
		filter();
		return false;
	});
});

function filter()
{
	var tags = {};
	
	$('#filter_form :checkbox').each(function(index, checkbox) {
		tags['tag-'+checkbox.value] = 'hide';
	});
	
	fields = $('#filter_form').serializeArray();
	
	$.each(fields, function(i, field){
		tags['tag-'+field.value] = 'show';
	});
	
	current = 0;
		
	$('.project').each(function(i, box) {
		hide_box = true;
		
		classes = box.className.split(' ');
		
		$.each(classes, function(i, value) {
			if (tags[value] == 'show') {
				hide_box = false;
				return false;
			}
		});
		
		if (hide_box) {
			$(box).hide(500);
		} else {
			current++;
			$(box).show(500);	
		}
	});
	
	$('#showing_x_of_y .current').text(current).animate({ opacity: 0.5 }).animate({ opacity: 1 });

	// Forces images previous below the fold to load
	$(window).trigger('scroll');
}
