//------------------------------------------------------------
//
// Michelle William Photography jQuery Gallery
//
//------------------------------------------------------------

var $ = jQuery.noConflict();

$(document).ready(function(){
	
	/*------------------------------------------------------------
	Fade Nav ul.categories
	------------------------------------------------------------*/
	// this is nessessary as cufon wont update dynamic colour changes
	//$('.nav ul.categories li a').fadeTo(0, .5);
	//$('.nav ul.categories li a')hover(function(){$(this).fadeTo(0, .7);})
	
	
	
	/*------------------------------------------------------------
	Pad the Gallery Down
	------------------------------------------------------------*/
	function padGallery()
	{
		if($(window).height() > ($('.container').height()-15))
		{
			var pad = ($(window).height() - ($('.container').height()-15))/2;
		}
		else
		{
			var pad = 0;
		}
		$('.container').css({'padding-top' : pad, 'margin-bottom' : 0});
	}
	padGallery();
	$(window).bind('resize', padGallery);
	
	
	
	/*------------------------------------------------------------
	Gallery Thumbnail Left Right
	------------------------------------------------------------*/
	$('.gallery .gallery-nav .left').click(function(){
		var currentScrollLeft = $('.gallery .gallery-nav .mask').scrollLeft()
		if(currentScrollLeft < 790)
		{
			$('.gallery .gallery-nav .mask').stop().animate({scrollLeft : '-=' + currentScrollLeft}, 1000);
		}
		else
		{
			$('.gallery .gallery-nav .mask').stop().animate({scrollLeft : '-=' + 790}, 1000);
		}
	});
	
	$('.gallery .gallery-nav .right').click(function(){
		var ulWidth = 	$('.gallery .gallery-nav li:last').offset().left +
						$('.gallery .gallery-nav li:last').innerWidth() -
						$('.gallery .gallery-nav ul').offset().left;
		
		var currentScrollLeft = $('.gallery .gallery-nav .mask').scrollLeft()
		var amountLeft = ulWidth - currentScrollLeft - 790
		if(amountLeft < 790)
		{
			$('.gallery .gallery-nav .mask').stop().animate({scrollLeft : '+=' + amountLeft}, 1000);
		}
		else
		{
			$('.gallery .gallery-nav .mask').stop().animate({scrollLeft : '+=' + 790}, 1000);
		}

	});
	
	
	
	/*------------------------------------------------------------
	Gallery Category Navigation
	------------------------------------------------------------*/
	$.fn.showThumb = function(speed) { 
		if (speed == null){
   			speed = 500;
 		}
		//$(this).show(1000);
		$(this).animate({'width' : '79px'}, speed);
	}
	
	$.fn.hideThumb = function() { 
		//$(this).hide(1000);
		$(this).animate({'width' : '0px'}, 500);
	}

	var category = 'all';
	$('.nav ul.categories a').click(function(){
		
		category = $(this).attr('title');
		var liCat = $('.gallery .gallery-nav li.'+category);
		var liNotCat = $('.gallery .gallery-nav li:not(.'+category+')');
		
		if($(this).is('.active'))
		{
			// Single cat is showing, reveal all cats.
			liNotCat.showThumb(1000);	
			
			$('.nav ul.categories a').removeClass('active');
		}
		else
		{
			// all cats are showing, hide all cats, show chosen cat.
			liNotCat.hideThumb();
			liCat.showThumb();		
			
			$('.gallery .gallery-nav .mask').stop().animate({scrollLeft : 0}, 1000);
			
			$('.nav ul.categories a').removeClass('active');
			$(this).addClass('active');
		}
				
		return false;
	})
	
	
	/*------------------------------------------------------------
	Randomise Thumbs!!!!!!!!!!!
	------------------------------------------------------------*/
	$.fn.randomize = function(childElem) {
	  	return this.each(function() {
		  	var $this = $(this);
		  	var elems = $this.children(childElem);
		  
		  	elems.sort(function() { return (Math.round(Math.random())-0.5); });  
	
		  	$this.empty();  
	
		  	for(var i=0; i < elems.length; i++)
				$this.append(elems[i]);      
	
		});
	}
	
	$('.gallery-nav ul').randomize("li");
	
	
	/*------------------------------------------------------------
	Gallery Load First Image
	------------------------------------------------------------*/
	var imgUrl = $('.gallery .gallery-nav a:first').attr('href');
	var imgHTML = '<img src="'+imgUrl+'" />';
	$('.gallery .loading').fadeTo(500, 1);
	$('.gallery .image-loader').stop().fadeTo(0, 0);
	$('.gallery .image-loader').html(imgHTML);
	$('.gallery .image-loader img').load(function(){
		var paddingTop = (570 - $(this).height())/2;
		$(this).css({'padding-top' : paddingTop+'px'});
       	$('.gallery .image-loader').stop().fadeTo(500, 1);
       	$('.gallery .loading').fadeTo(500, 0);
   });
	
	
	
	/*------------------------------------------------------------
	Gallery Thumbnail Load Function
	------------------------------------------------------------*/
	$('.gallery .gallery-nav a').click(function(){

		var imgUrl = $(this).attr('href');	
		var imgHTML = '<img src="'+imgUrl+'" />';
		
		// swap main image
		$('.gallery .image-holder').stop().fadeTo(0, 1);
		$('.gallery .image-holder').html($('.gallery .image-loader').html());
		$('.gallery .image-loader').html('');
		$('.gallery .image-loader').stop().fadeTo(0, 0);
		
		// fade image holder
		
		$('.gallery .image-holder').stop().fadeTo(500, .2, function(){
			$('.gallery .loading').stop().fadeTo(500, 1);														
			// once faded, load image
			$('.gallery .image-loader').html(imgHTML);
			$('.gallery .image-loader img').load(function(){
				var paddingTop = (570 - $(this).height())/2;
				$(this).css({'padding-top' : paddingTop+'px'});
			   	$('.gallery .image-loader').stop().fadeTo(500, 1);
			   	$('.gallery .loading').stop().fadeTo(500, 0);
		   });
		});
		
		
		return false;
	});
	
	
});

$(window).load(function(){
	$('.gallery-nav ul li').fadeTo(1000, 1);					
});

