$(document).ready(function(){
	
	/* 2 types of navigation
	
	1) Clicking on the thumbnails
	2) Clicking on the image to click through - always to the next one - then the first when reaches end
	
	*/
	
// TYPE 1 Javascript		
					
				$("ul.thumbs li a").click(function(event){
	
				// stop links from working
				event.preventDefault();
				
				// so is this the last item in the gallery
				 if ($(this).parents('li').is(':last-child') == true) {
				 
				 	//if so get the first child of the parent ul's li's a's href and use that		
				 	$("#container a").attr('href',$(this).parents().siblings(':first-child').find('a').attr('href'));
				 } else {
				 
				 	//else use the next childs a's href for the link
				 	$("#container a").attr('href',$(this).parents('li').next().find('a').attr('href'));
				 }
				  	
				// deal with highlight
					$("ul.thumbs li").removeClass('active');
					$(this).parent().addClass('active');
				
				// what if it's an flv that is currently showing
					
					// remove the embed
					$("#container embed").remove();			
					// remove current image
					$("#container img").remove();


				// if new target is an flv
				if ($(this).attr('href').slice(-3) == "flv") {
				
					 $('#container a').after('<embed src="/j/dynamic.swf" flashvars="flvurl='+$(this).attr('href')+'" type="application/x-shockwave-flash" width="470" height="389"></embed>');
				// do the embed goodness
				} else {				
				
				// else load our new image
				  var img = new Image();
				  $(img)
				    
				    // once the image has loaded, execute this code
				    .load(function () {
				      
				      // set the image hidden by default    
				      $(this).hide();
				    
				      // add image
				      $('#container a').append(this);
				    
				      // fade our image in 
				      $(this).fadeIn();
				    })
	
	  			  // set the src attribute of the new image to our image
	    			.attr('src', this.href);
	  			
	  			// end if
	    		}
    	
	    					
				});
				
// TYPE 2 javascript - now for the clicking on the image
				
				$("#container a").click(function(event){
				
				event.preventDefault();
				
				// is this the last one?
				if ($("ul.thumbs li.active").is(':last-child') == true) {
				
					// get the current active one // remove class // find first li // add the class
					$("ul.thumbs li.active").removeClass('active').siblings(':first-child').addClass('active');
					// change the link to the first image
					$("#container a").attr('href',$("ul.thumbs li.active a").attr('href'));
					
				// nope
				} else {
				
					// get the current active one // find the next li // add the class
					$("ul.thumbs li.active").removeClass('active').next('li').addClass('active');
					// change the lnk to next image
					$("#container a").attr('href',$("ul.thumbs li.active a").attr('href'));
				}
				
				//	remove current image
					$("#container img").remove();
				// remove embed tag if flv
					$("#container embed").remove();
					
					
				// if new target is an flv
				if ($(this).attr('href').slice(-3) == "flv") {
				
					 $('#container a').after('<embed src="/j/dynamic.swf" flashvars="flvurl='+$(this).attr('href')+'" type="application/x-shockwave-flash" width="470" height="389"></embed>');
				// do the embed goodness
				} else {				
					
				
				//  add new image // see type 1 nav for explanation of below code
				 	var img = new Image();
				  	$(img)
				    .load(function () {  
				      $(this).hide();
				      $('#container a').append(this);
				      $(this).fadeIn();
				    })
	    			.attr('src', this.href);
	    		} // end if flv	
	    							
				});				
	});