/*--------------------------------------------------------------------
* This file controls the front-end grid view of PhotoGenoa.
*
* Dependencies: jQuery 1.3.2 and jQuery UI 1.7.1
*
* You should not need to modify this file unless you've heavily customized
* PhotoGenoa by, for instance, changing the size of the thumbnails it
* generates (in config.php).	
*
* -------------------------------------------------------------------- */

		




/*--------------------------------------------------------------------
* The following code controls the zoom slider on the album pages.
* 
* Set the first three variables as you like. (The max_thumb_size variable 
* should equal the actual width of your thumbnails. If you allow photoGenoa to 
* automatically create your thumbnail images, do not change this value.)
* 
* -------------------------------------------------------------------- */
  

$(document).ready(function() {
	
	//Minimum size of thumbnails, in pixels:
	var min_thumb_size = 75;
	
	//Maximum size of thumbnails, in pixels:
	var max_thumb_size = 320;
	
	//Minimum number of thumbnails on each line at max zoom level
	//Stay between 2-5:
	var minimum_photos_on_one_line = 3;
	
	//Vertical photo size-reducing multiplier:
	var vertical_reducer_multiplier = .8;
	
	
	
	
//*****************************************************************************************************************************	
//*****************************************************************************************************************************	
//********************************************* Do Not Modify Anything Below This Line ****************************************
	
	//Reduce the size of vertical photos 
	$('.photo-wrapper').height( $('.photo-wrapper').height() * vertical_reducer_multiplier);  //The muliplier reduces the overall size of vertical images relative to horizontal ones. This produces a tighter, more visually-pleasing grid of photos.
	
	
	/*
	 Figure out the maximum thumbnail size to fit the above min number of photos on one line
	*/	
			var container_width = parseFloat( $('#photoBin').css('width'), 10 ); //photoBin is the div that holds all photoGenoa content.
	
			var init_left_margin = $('.photo-wrapper').css('margin-left');
			var init_right_margin = $('.photo-wrapper').css('margin-right');
			var init_margin = parseFloat(init_left_margin, 10) + parseFloat(init_right_margin, 10); //Strip the "px" from the returned margins

			var space_for_margins_at_max_thumb_size = init_margin * minimum_photos_on_one_line;
			var space_for_photos_at_max_thumb_size = container_width - space_for_margins_at_max_thumb_size - minimum_photos_on_one_line; //we subtract an extra pixel for each photo just to give us a little buffer for browser idiosyncricies. (Similar to firefox fix below.)


			var max_thumb_size_for_photoBin_width = Math.floor(space_for_photos_at_max_thumb_size / minimum_photos_on_one_line);
	
			//Thumbnails should never be larger than the actual thumbnail image size. 
			//if #photoBin were wide enough, the calculated thumbnail width could be 45,000 pixels.
			//That's bad, so we limit the thumbnail width here:
			if (max_thumb_size_for_photoBin_width < max_thumb_size) {
				max_thumb_size = max_thumb_size_for_photoBin_width;
			}
	
	
	
	var init_thumb_size = parseFloat( $('.photo-wrapper').css('width'), 10);
	var firefox_fix = 1; //Adding 1 pixel to the totalWidth calculation below fixes an animation bug in Firefox. I have no idea why this works. Safari works perfectly without this hack. It may have something to do with how FF handles borders/padding/etc. No clue, but this fixes the problem
	
	
	
	/*
	 Slider Control
	 NOTE: setting the slider up with percentages (rather than min/max values corresponding to actual pixel sizes) results in smoother animation
	*/
			var start = Math.floor( (init_thumb_size - min_thumb_size) / ( (max_thumb_size - min_thumb_size) / 100) ); //Determines starting position of slider handle. We're working in % here.
	
			$('#slider').slider({
				orientation: 'horizontal',
				animate: true,
				range: "min",
				value: start,
				slide: function(ev, ui) {
					$('.photo-wrapper').width(min_thumb_size + (ui.value * (max_thumb_size - min_thumb_size)/100));
					$('.text-wrapper').width(min_thumb_size + (ui.value * (max_thumb_size - min_thumb_size)/100));

					$('.photo-wrapper').height( ((min_thumb_size + (ui.value * (max_thumb_size - min_thumb_size)/100))) * vertical_reducer_multiplier);  //The muliplier reduces the overall size of vertical images relative to horizontal ones. This produces a tighter, more visually-pleasing grid of photos.

					totalWidth = init_margin + firefox_fix + $('.photo-wrapper').outerWidth();  //total width of each photo box, including padding, border and margins
					singleLinePossible = Math.floor(container_width / totalWidth);  //Number of photos that can fit on one line

					pixelsUsed = (singleLinePossible * totalWidth);
					pixelsAvailable = container_width - pixelsUsed;
					pixelsPerMargin = Math.floor( (pixelsAvailable / singleLinePossible) / 2 );

					newMargin = (init_margin / 2) + pixelsPerMargin;

					$('.photo-wrapper').css({'margin-left' : newMargin + 'px', 'margin-right' : newMargin + 'px'});
				}
			});	
});



