/* 
	Title: When Monsters Attack scripts
	Description: Without this, the website would be nothing.
	Author: Thom Vincent
	Date: 22 January 2012
*/


function shareImage( href ) {
	var url = href;
	var windowName = '';
	var windowOther = 'top=50,left=50,width=650,height=630,scrollbars=0,resizeable=0';
	window.open(url, windowName, windowOther);	
};

$(document).ready(function(){  


	//The container for the thumbnails
	var container = $('#thumbnails');
	var grid = $('#thumbnails .grid');
	var image = $('article p img');




	//Masonry
    container.masonry({
    	columnWidth: 160,
		gutterWidth: 60,
		isFitWidth: true,
		isAnimated: !Modernizr.csstransitions
	});	
	
	//Infinite scroll loader	
    container.infinitescroll({
		navSelector  : '.navigation',    //Selector for the paged navigation 
		nextSelector : '.navigation a:first',  //Selector for the NEXT link (to page 2)
		itemSelector : '#thumbnails .grid',     //Selector for all items you'll retrieve
		extraScrollPx: 480,
		animate: true,       
		loading: {
			img: 'http://www.whenmonstersattack.com/wp-content/themes/whenmonstersattack/img/loading.gif',
			msgText: '',
			finishedMsg: '',
        }
	},


	//Trigger Masonry as a callback
    function( newElements ) {

	//Hide new items while they are loading
	var $newElems = $( newElements ).css({ opacity: 0 });
	//Ensure that images load before adding to Masonry layout
	$newElems.imagesLoaded(function(){
		//Show elems now they're ready
        container.masonry( 'appended', $newElems, true ); 
        $newElems.delay(1000).animate({ opacity: 1 }, 1000, function() { 
        
        	$('#thumbnails .thumbnail img').each(function(index) {
		   	    $(this).delay(100*index).fadeIn(200);
			});	

        
        });

		//Highlight selected thumbnail
		$newElems.each(function() {
			$(this).hover( function() {
				$(this).stop().fadeTo(500,1).siblings().stop().fadeTo(500,0.2);
			}, function() {
				$(this).stop().fadeTo(500,1).siblings().stop().fadeTo(500,1);
        	});
    	});	

	});

	}
	); //End InfiniteScroll

	//Highlight selected thumbnail
	/*
	grid.each(function() {
		$(this).hover( function() {
			$(this).stop().fadeTo(500,1).siblings().stop().fadeTo(500,0.2);
		}, function() {
			$(this).stop().fadeTo(500,1).siblings().stop().fadeTo(500,1);
       	});
   	});	
	*/
	

	//Fade in large image onLoad
	image.bind("load", function () { 
		var imageHeight = $('article p img').height();
		$('article p').animate({
			height: imageHeight
			  }, 500, function() {
				image.fadeIn(1000);
				//This line here is making it jump about 65 pixels up
				$('article p').css('height','auto');
		});		
	});


	//Fade in each thumbnail on load
	//$('#thumbnails .thumbnail img').css('display','none');
	$('#thumbnails .thumbnail img').each(function(index) {
   	    $(this).delay(100*index).fadeIn(200);
	});	
	
	  
	//About section
	$('.about').click(function(){
		$('#about').slideToggle(500);
		if ($(window).scrollTop() > 190) {
			$('#about').slideDown(500);
			$('body,html').animate({
				scrollTop: 0
				}, 500);
				return false;
			}
		return false;
	});



	
	//Mobile menu
	$('#mobileOptions').change(function(){
		if ( this.value != "") {
			window.location = this.value;
		}
	});
	

	//Open non monsters links in a new browser
	$("a").each(function(){
		if (this.href.indexOf(location.hostname) === -1) { $(this).attr('target', '_blank'); } 
	});
	
	//Protect email address
	$('a.email').nospam({ replaceText: true });

	
	
	//Drop shadow on the header
	var distance = 0;
	var blur = 0;
	var dropshadow =20;
	var offset = 0;

	$(window).scroll(function () { 
	
		distance = $(this).scrollTop();
		distance = distance*0.05;
		
		if (distance > dropshadow) {
			blur = dropshadow;
		} else {
			blur = distance;
		}

		offset = parseInt( blur / 10 );
      	$('header').css('box-shadow','0 '+offset+'px '+blur+'px 0 #999999');
    });	


	//Make the back to home button appear
	$(window).scroll(function () {
		if ($(this).scrollTop() > 590) {
			$('.homeButton').fadeIn(500);
		} else {
			$('.homeButton').fadeOut(500);
		}
	});
	//Click action for the back to home button
	$('.homeButton').click(function () {
		$('body,html').animate({
			scrollTop: 0
		}, 500);
		return false;
	});
	
	//Popup window for the sharing things
	$('.popup').click(function(e){
		shareImage( $(this).attr('href') );
		return false;
	});
	
});