// JavaScript Document

$(document).ready(function() {

/* document setup */
	$("#up").fadeOut(); //hide the up button initially
	$("#ui_feedback").animate({ 
	        opacity: 0.3
	      }, 1500 );  //change strength of the credits opatcity here
/* end document setup */
	
	
		var counter = 0;   //track loop progress vs total items
			$.each(_images,function(e,v) {
			$(new Image()).load(function() {   
				counter ++;
				//alert($(this).attr('src') + ' has loaded!'); 
					//$('#caption_content').html("Image " + e + " Loaded: value = " + v + "array length: " + _images.length) ;
					//$('#ui_feedback').html("thumbnail " + counter + " loading...");
					var new_credit = _credits[0];
				if(counter == _images.length) {
							new_credit = _credits[_images.length - 1]; // this is to get the credit of the last one
							$('#ui_feedback').html("All images loaded");
							$('#ui_feedback').html(new_credit).fadeIn('fast');}
				}).attr('src',this);   
			});

	
	$("#middle_thumbs a").click(function() {
			var new_credit = _credits[this.id];				
			$('#ui_feedback').html(new_credit);
			$('#ui_feedback').show();
			var new_image = _images[this.id];
			
			
				var img = new Image();
				img.src = new_image;
				var newwidth = img.width;
			//	alert(img.width + 'x' + img.height);
	
	
			$('#left-column').fadeOut('fast',function() {
				$('#left-column img').attr('src', new_image); 
			}).fadeIn('fast',function() {
				//var newwidth = $('#left-column img').width();
				if (newwidth<="280") {
					$('.arrow').hide();					
				}   
				else
				{
					$('#arrow_open').show();	 
				}
			});
		return false;

	}); 
	
	/*
	
	var img2 = new Image();
	img2.src = 'http://www.google.com/intl/en_ALL/images/logo.gif';
	alert(img.width + 'x' + img.height);
	
	*/

   $("#up").click(function() {
		var tposition = 1 - $("#middle_thumbs ul").position().top;
		if (tposition<="550") { // one screen's height, plus a little extra if they're clicking fast
			$("#up").fadeOut();
			$("#down").fadeIn();
		} else {
			$("#up").fadeIn();
		}
	   	$("#middle_thumbs ul").animate({top: "+=350"});
	 });

   $("#down").click(function() { 
        var height = $("#middle_thumbs ul img").length/2*80-350;//-800; 
		//divide by two because there is two columns | times by 80 because that's the height of the images | subtract the visible portion + one scroll 
		
		var tposition = $("#middle_thumbs ul").position().top;  
		tposition = tposition * -1
		if (tposition>=height) {
			$("#down").fadeOut();
			$("#up").fadeIn();
		} else {
			$("#down").fadeIn();
		}
   		$("#middle_thumbs ul").animate({top: "-=350"}); 
	});   
	

	
	$("#arrow_open").click(
	      function () {
			var imgwidth = $('#left-column img').width();
			var myimgwidth = imgwidth-10;			
			if (imgwidth > 270) {
		    $('#arrow_open').hide();
			$('#arrow_close').show();
	        //$('#left-column').animate({width:imgwidth}, 300 );
			var img_lhs_margin = 850 - imgwidth;
			$('#left-column').animate({width:820}, 300 );
			$('#left-column img').animate({marginLeft: img_lhs_margin/2}, 750 );
			$('#ui_feedback').animate({marginLeft: img_lhs_margin/2}, 750 );
			$('#ui_feedback').animate({width:myimgwidth},1000); //comment this out if you don't want the credits to grow
			}
	      });    
	      
	      
	      
	$("#arrow_close").click( 
		function () {
			var imgwidth = $('#left-column img').width();
			if (imgwidth > 270) {
			$('#arrow_open').show();
			$('#arrow_close').hide();     
			$('#left-column').animate({width:"266px"}, 300 );
			$('#left-column img').animate({marginLeft: '0px'}, 550 ); 
			$('#ui_feedback').animate({marginLeft: '0px'}, 550 ); 			
		}    
	});            
			
	$("#left-column").click( 
	    function () {
			var imgwidth = $('#left-column img').width();
			if (imgwidth > 270) {
				$('#arrow_open').show();
				$('#arrow_close').hide();     
				$('#left-column').animate({width:"266px"}, 300 );
				$('#left-column img').animate({marginLeft: '0px'}, 550 ); 
				$('#ui_feedback').animate({marginLeft: '0px'}, 550 ); 				
			}
		});    
	
 });