$(document).ready(function(){		
													 
	//initialize overlay script
	Shadowbox.init();	
	
	getData();
	
	// build the html
	function buildPage(json) {			
		
		var ame = json.members;	
		
		//see which checkboxes are checked
		var n = $('#filters input:checked');		
		var d = $('#filters option:selected');
			
		//get class name of selected radio button
		var checked = $(n[0]).attr('class');			
		var dept = $(d).text();

		// display the gallery header	
		$('#members-header').text(checked + ' Academy Members - ' + dept);
			
			// loop through members
			for(var i=0; i<ame.length; i++) {				
			
				// get filter criteria
				var yearfilter = ame[i].filter;				
				var deptfilter = ame[i].department;
				
				if(checked != 'Emeritus') {					
					if((checked == yearfilter) || (checked == 'All' && yearfilter != 'Emeritus')) {						
						if((dept == deptfilter) || (dept == 'All Departments')) {									
							// build html excluding emeritus
							$('#thumbnails').append('<li class="' + ame[i].filter + '"><a rel="shadowbox;width=600;height=480" class="movie" title="" href="#' + ame[i].lastname + '"><img src="' + ame[i].imgsml + '" height="130" width="100" alt="' + ame[i].fullname + '" /><span>' + ame[i].fullname + '</span></a><span class="dept">' + ame[i].department + '</span><span>' + ame[i].title + '</span></li><div id="' + ame[i].lastname + '" class="hidden"><div class="inline-content"><img class="big-img" src="' + ame[i].imglrg + '" height="252" width="200" alt="' + ame[i].fullname + '" /><h2 class="member-name">' + ame[i].fullname + '</h2><h3 class="department">' + ame[i].department + '</h3><p>' + ame[i].bio + '</p><!--<p><a href="' + ame[i].pdf + '" target="_blank">Print Bio</a></p>--></div></div>');							
						}						
					}					
				} 		
			
				else if (checked == 'Emeritus') {
					if(checked == yearfilter) {			
						if((dept == deptfilter) || (dept == 'All Departments')) {						
						$('#thumbnails').append('<li class="' + ame[i].filter + '"><a rel="shadowbox;width=600;height=480" class="movie" title="" href="#' + ame[i].lastname + '"><img src="' + ame[i].imgsml + '" height="130" width="100" alt="' + ame[i].fullname + '" /><span>' + ame[i].fullname + '</span></a><span class="dept">' + ame[i].department + '</span><span>' + ame[i].title + '</span></li><div id="' + ame[i].lastname + '" class="hidden"><div class="inline-content"><img class="big-img" src="' + ame[i].imglrg + '" height="252" width="200" alt="' + ame[i].fullname + '" /><h2 class="member-name">' + ame[i].fullname + '</h2><h3 class="department">' + ame[i].department + '</h3><p>' + ame[i].bio + '</p><!--<p><a href="' + ame[i].pdf + '" target="_blank">Print Bio</a></p>--></div></div>');					
						}
					}			
				} 				
			}	
			
			// not sure why I had to run this setup but it fixed a bug with the shadow box
		Shadowbox.setup();		
		}
	
	// load json data
	function getData() {
		$.getJSON('../js/membership.js', buildPage);
	}
	
	// clear thumbnails and re-grab json
	function clearThumbs() {
		$('#thumbnails').empty();	
    	getData();
	}
	
	// reset the dropdown menu to "All Departments"
	function resetSelect() {
		$('#filters option[value="All"]').attr('selected', 'selected');
	}
				
	// reset select and clear thumbs when selecting radio button
	$('#filters input:radio').click(function () { 				
		clearThumbs();
		resetSelect();
  	});		
		
	// just clear thumbs when selecting a department from the drop down
	$('#filters select').change(function () { 		
		clearThumbs();
  	});
	
});