// JavaScript Document
jQuery(document).ready(function($){	

//Resize the photo depending on window dimensions. In an external function so it can be called when the window resizes.
function resizephoto() {
	$('.mainphoto').show();

	$('.thebigphoto').each(function() {

	var maxWidth = $(window).width()-130; // Max width for the image
    var maxHeight = $(window).height()-300;    // Max height for the image (header 205px) -- default 250px
    var ratio = 0;  // Used for aspect ratio
    var width = flickrwidth;    // Current image width
    var height = flickrheight;  // Current image height
    
    // Check if the current width is larger than the max
    if(width > maxWidth){
    ratio = maxWidth / width;   // get ratio for scaling image
    $(this).css("width", maxWidth); // Set new width
    $(this).css("height", height * ratio);  // Scale height based on ratio
    height = height * ratio;    // Reset height to match scaled image
    width = width * ratio;    // Reset width to match scaled image
    }
    
    // Check if current height is larger than max
    if(height > maxHeight){
    ratio = maxHeight / height; // get ratio for scaling image
    $(this).css("height", maxHeight);   // Set new height
    $(this).css("width", width * ratio);    // Scale width based on ratio
    width = width * ratio;    // Reset width to match scaled image
	height = height * ratio;
    }
    

    $('.photometa').width(width+80);


    $('.photoinfo').css("margin-left",(width/2)-122);

    $('.content').css("height",height-30);
    $('.content').hide();
   
    $('.button').click(function(){						
    $(".content").toggle("slide", { direction: "up" }, 1000);
    });
    
	
    $('.button').fadeTo(0,.5);
    $(".button").hover(function(){
    $(this).fadeTo('fast',1);
    },
    function() {
    $(this).fadeTo('fast',.5);
    });
    
    $('.mainphoto').fadeIn();
	}); //mainphoto each resize


}; //function resize photo


$.address.change(function(event){

//		$('.photolink').address(); //this is, actually, redundant...
		
		//what variables do I need to properly deal with this photo?
		//id (of the photo to be called)
		//seq (sequence, for the numerical context)
		//prev_id (id of the previous photo in context)
		//next_id (id of the next photo in context)
			var id = event.value.replace("#","").replace("/","");
	
	
	//set all the sidebar photos to fade and hover // up here so it's out of the clunky if() statement.
	 $('.photolink').fadeTo(0,.5).hover(function(){
            	$(this).fadeTo(100,1);
           	}, function() {
            	$(this).fadeTo(50,.5);
            });
		

	if (id != 'contact' && id != 'about') {
			var seq = parseInt($(".photolink[href*='" +id+ "']").children().attr("id").replace("photo-",""));
            var prevseq = seq-1;
            var nextseq = seq+1;
			var first_id = $("#photo-1").parent().attr("href").replace("#","");
			
            if (prevseq > 0) {
			var prev_id = $("#photo-"+prevseq+"").parent().attr("href").replace("#","");
			} else {
			//var prev_id = 0;
			}

			if (nextseq <= total) {
			var next_id = $("#photo-"+nextseq+"").parent().attr("href").replace("#","");
			} else {
			//var next_id = 0;
			}
		        
			var idstring = 'photo-'+seq; //used to unbind certain images hover state.
          
		//done defining variables, now let's get to work.
        
        
            //Deal with the preview images, set the current one to solid, all the others fade hover as normal.
           
            $('#'+idstring+'').parent().fadeTo('0',1).unbind('mouseenter').unbind('mouseleave');
			
        //AJAX!
	} else {
	seq = "&infin;"; //infinity symbol -- thought it would be cool.
	}
		 jQuery.get("wp-content/themes/preview_pane_theme/scripts/photos.php",{photoid:id},function(data){
			$('.mainphoto').fadeOut().remove();
			$('#main_content').prepend(data);
			$('.mainphoto').fadeIn('slow');

			resizephoto();

			if (typeof prev_id != 'undefined'){
            $('.prev').html('<a href="#'+prev_id+'"><img src="wp-content/themes/preview_pane_theme/images/prev.gif" alt="back one image" width="50" height="56" /></a>').fadeIn();
            } else {
            $('.prev').html('');
            }
            
            if (typeof next_id != 'undefined'){
            $('.next').html('<a href="#'+next_id+'"><img src="wp-content/themes/preview_pane_theme/images/next.gif" alt="forward one image" width="50" height="56" /></a>').fadeIn();
			$('.biglink').attr('href','#'+next_id);
            } else {
            $('.next').html('');
			$('.biglink').attr('href','#'+first_id).attr('title','first photo');
            }
            
            $('.arrows').fadeTo(0,.5);
            $(".arrows").hover(function(){
            $(this).fadeTo('fast',1);
            },
            function() {
            $(this).fadeTo('fast',.5);
            });
          
          	
          
            //inserts the count into the document where appropriate, e.g. "3 of 10"
            $('.count').html(seq);          
 	
           delete id;
           delete seq;
           delete prevseq;
           delete nextseq;
           delete prev_id;
           delete next_id;
		   delete flickrheight;
		   delete flickrwidth;
               
               			
                	}); //jquery.get callback
 			   
   			}); //address.change
 

 
 }); //document.ready