/***************************************
  JS written by Scott Carver, naturally  
****************************************/



$(document).ready(function () {

	$(".tooltip-grid *[title]").tooltip({ position: "top center", offset:[80, 30]});

	initializeFonts(); 			// typekit js
	initializeSqueezebox(); 	// defined below
	onPostLoad(); 				// setup slideshows and js trickery


	if((navigator.userAgent.match(/iPhone/i)) || (navigator.userAgent.match(/iPod/i))) {
   hideMobileURL();
}
	


	/******************************************
		SqueezeBox Function, calls un/up
	******************************************/

	$(".readmore").click(function (event) {
		event.preventDefault();
		var squeezeURL = $(this).attr('href');
		var squeezeID  = $(this).parent('div:eq(0)').attr('id');
		var squeezeID = '#'+squeezeID;
		
		//closeStory();
		$('#drawer_top_frame, #drawer_bottom_frame').empty();
		
		if ($('#masonry').hasClass('inside')) {
			var squeezeTO = 'inside';
			unSqueeze(squeezeURL, squeezeID, squeezeTO);
			
		} else if ($('#masonry').hasClass('above')) {
			 var squeezeTO = 'above';
			 upSqueeze(squeezeURL, squeezeID, squeezeTO);
		} else {
			var squeezeTO = 'below';
			upSqueeze(squeezeURL, squeezeID, squeezeTO);
		}
		
	});  
	

	
	/******************************************
		Handlers for navigation modes
	******************************************/

	$("#load-above").click(function (event) {
		
		$('.fullstory .story').empty();
		$('.item').removeClass('fullstory');
		$('.item').addClass('teaser');
		$('.thumbnail .spinner').remove();
		resetGrid();
	
		$('#load-inside').removeClass('selected');
		$('#load-below').removeClass('selected');
		$(this).addClass('selected');
		$('#masonry').removeClass('inside');
		$('#masonry').removeClass('below');
		$('#masonry').addClass('above');
	
	});  

	$("#load-inside").click(function (event) {
	
		$('#drawer_top_frame').removeClass('filled').empty();
		$('#drawer_bottom_frame').removeClass('filled').empty();
		//resetGrid();
		
		$('#load-above').removeClass('selected');
		$('#load-below').removeClass('selected');
		$(this).addClass('selected');
		$('#masonry').removeClass('above');
		$('#masonry').removeClass('below');
		$('#masonry').addClass('inside');
	});  
	
	$("#load-below").click(function (event) {	
	
		$('.fullstory .story').empty();
		$('.item').removeClass('fullstory');
		$('.item').addClass('teaser');
		$('.thumbnail .spinner').remove();
		resetGrid();
		
		$('#load-above').removeClass('selected');
		$('#load-inside').removeClass('selected');
		$(this).addClass('selected');
		$('#masonry').removeClass('above');
		$('#masonry').removeClass('inside');
		$('#masonry').addClass('below');
	});  
	



	$("#about_bug").click(function () {	


		var siteURL = 'wp-content/themes/SqueezeBox/js/';
		var featuredFrame = '#drawer_top_frame';
		$(featuredFrame).addClass('filled');
		$(featuredFrame).slideUp(200);
		$(featuredFrame).empty();
		
		$('.thumbnail .spinner').remove();
		
		$('.spinner').fadeIn();

		$(featuredFrame).load(siteURL+'aboutsite.php', function() {
		
		  	$('.spinner').fadeOut();
		  	onPostLoad();
			$(featuredFrame).slideDown();
			//alert('something');
			$.scrollTo(featuredFrame, 200);
	
			// $(featuredFrame+' .hentry').append('<div class="close-fullstory" onclick="closeStory();"></div>');
			
		});
		

	});  
	



	
	//these allow you to use the arrow keys to navigate between stories
$(document).bind('keydown', 'left',function (evt){prevStory();  return false;});
$(document).bind('keydown', 'right',function (evt){nextStory(); return false;});
$(document).bind('keydown', 'esc',function (evt){closeStory(); return false; });
	
	$('.close-fullstory').click(	function () { 	closeStory(); 		});
	$('.nextstory').click(			function () { 	nextStory(); 		}); 
	$('.prevstory').click(			function () { 	prevStory(); 		}); 
	// $(squeezeID.' .post-metainfo .comments').click(function () { });
	
	


$(function() {

   /*
   
   $('.pause').click(function() {  
		$('.slideshowNav .pause').next().addClass('paused');
		$('.slideshowNav .play').next().removeClass('playing');
		$('.slideshowNav .slides').next().cycle('pause'); return false; 
    });
    
    $('.play').click(function() { 
		$('.slideshowNav .pause').next().removeClass('paused');
		$('.slideshowNav .play').next().addClass('playing');
		$('.slideshowNav .slides').next().cycle('resume'); return false; 
    });
    
  */
    
   
    	
		
		

    

});




/******************************************************

JQUERY COOKIE - retrieve it or set default on first visit

******************************************************/

// Set the viewmode cookie
	var cookieName = 'viewmode';
	var cookieOptions = {expires: 90, path: '/'};
	// alert( $.cookie('viewmode'));
	
	
	if( $.cookie('viewmode') == null ) { 
	   	// cookie not set? Lets do it now
	   	$.cookie( 'viewmode', 'gridview',  cookieOptions );
	   	
	} else if( $.cookie('viewmode') == 'gridview' )  { 
		// do nothing, the viewmode defaults to gridview
	
	} else if( $.cookie('viewmode') == 'listview' )  {	
		// switch icon to list-view			
		$('#grid-view').removeClass('selected');
		$('#list-view').addClass("selected");
	}
	
	
/*
$('#grid-view').click(function(){ 

		$('#list-view').removeClass('selected');
		$(this).addClass('selected');
		$.cookie('viewmode', 'gridview', cookieOptions);
	
		
		$('#masonry').removeClass('rows');
		$('#masonry').addClass('grid');
		location.hash = '#grid';
		 resetGrid();
		
});


$("#list-view").click(function(){ 

		$('#grid-view').removeClass('selected');
		$(this).addClass('selected');
		$.cookie('viewmode', 'list-view', cookieOptions);
		
		
		$('#masonry').removeClass('grid');
		$('#masonry').addClass('rows');
		location.hash = '#list';
		resetGrid();
		
});
*/




/******************************************************

STAT PARTY! - show stats from Wordpress, PHP, jQuery and Modernizr

******************************************************/

 $('.showbrowserstats').click(function() {  
	$('.spinner').fadeIn();
	$('#dashboard').slideToggle(); 
	$('.spinner').fadeOut();
 });


/*

$(function() {
$("#contentpath").change(function(){

	var contentpath = "." + this.value;
	
	$('#masonry').removeClass('inside');
	$('#masonry').addClass('above');
	
	
	//alert(contentpath);
	
	
	
	// alert(contentpath);
	
	});
		
	// $("#contentpath").change();
 });
*/

});



// END document.ready
// --------------------------
// BEGIN standalone functions 








/*
FUNCTIONS
----------------
Build  Fancybox
Trigger Hashchange
Initialize Fonts
Initialize Squeezebox
Load Content Inside
Load Content Above
On Post Load
-Start Slideshow
Close Story
Next Story 
Previous Story
*/




/******************************************************
		Build Fancybox
******************************************************/

function buildFancyBox() {
	
	
		$(".fancybox").fancybox({
		'transitionIn'	:	'elastic',
		'transitionOut'	:	'elastic',
		'speedIn'		:	600, 
		'speedOut'		:	200, 
		'overlayShow'	:	false
		});

}


 	

/******************************************************
		Trigger Hashchange
******************************************************/

$(function(){

	$(window).hashchange( function(){
		var hash = location.hash;
		$(hash).children('.readmore').click();
		//alert('a test');
		$(hash).click();
 	})

	$(window).hashchange();
  
});






/******************************************************
		Initialize Fonts
******************************************************/

function initializeFonts() {

		try{
			Typekit.load();
		}catch(e){
		
		}

}  // end initializeFonts




/******************************************************
		Initialize SqueezeBox
******************************************************/

function initializeSqueezebox() {

		// initialize smooth dropdown menu in top navigation
		$('#menu-primary').superfish();  
	
		// standard init of masonry plugin 
		resetGrid();
	
		// initialize jquery masonry in footer
		$('#footer_frame').masonry({
				columnWidth: 240,
				animate: true,
				easing: 'easeOutElastic'
		});

}  // end initializeSqueezebox();




/******************************************************
		Reset Grid
******************************************************/

function resetGrid() {


		// initialize jquery masonry plugin 
		$('#masonry').masonry({  
				columnWidth: 240,
				animate: true,
				easing: 'easeOutElastic'
		});
	

}  


/******************************************************
		Load Content Inside Grid
******************************************************/

function unSqueeze(squeezeURL, squeezeID) {
			
			location.hash = squeezeID;
			
			var storyID = squeezeID+' .story';
			$(squeezeID+' .story').empty();
			
			$('.thumbnail .spinner').remove();
			$(squeezeID+' .thumbnail').append('<div class="spinner"></div>');
			$('.spinner').fadeIn();
			
			// I'm using .hentry instead of .post/.portfolio because it's more consistent
			$(storyID).load(squeezeURL+" .hentry", function() {
			
				$('.item').addClass('teaser');
				$('.item').removeClass('fullstory');
				$(squeezeID).removeClass("teaser");
				$(squeezeID).addClass("fullstory");

				
				//remove the contextual spinner
				//$(squeezeID+' .thumbnail .spinner').remove()
				
		
				$(squeezeID).show(0, function() {
						
						// resetGrid();
						
           			 	$('#masonry').masonry({
							columnWidth: 240,
							animate: false
						});
						
						$('.spinner').fadeOut();
						
						$.scrollTo(squeezeID, 0);
						
          		});
				
				onPostLoad();
			
				$(squeezeID+' .hentry').append('<div class="close-fullstory" onclick="closeStory();"></div>');
				
				//alert(squeezeID);
			});

        
} // end unSqueeze();


/******************************************************
		Load Content Above Grid
******************************************************/

function upSqueeze(squeezeURL, squeezeID, squeezeTO) {
		
		if (squeezeTO == 'above') {
			var featuredFrame = '#drawer_top_frame';
		} else if (squeezeTO == 'below') {
			var featuredFrame = '#drawer_bottom_frame';
		}
	
		location.hash = squeezeID;
		
		$(featuredFrame).addClass('filled');
		$(featuredFrame).slideUp(200);
		$(featuredFrame).empty();
		
		$('.thumbnail .spinner').remove();
		$(squeezeID+' .thumbnail').append('<div class="spinner"></div>');
		$('.spinner').fadeIn();

		$(featuredFrame).load(squeezeURL+" .hentry", function() {
		
		  	$('.spinner').fadeOut();
		  	onPostLoad();
			$(featuredFrame).show();
			$.scrollTo(featuredFrame, 200);
	
			$(featuredFrame+' .hentry').append('<div class="close-fullstory" onclick="closeStory();"></div>');
			
		});
		
		
        
} 

/******************************************************
		On Post Load
******************************************************/

function onPostLoad() {

		startSlides();

} 


/******************************************************
		Start Slides
******************************************************/

function startSlides() {
		
       /* setup cycle slideshow */
		$('.slides').each(function(){
			var $this = $(this);
			$this.cycle({ 
				next: $this.prev('.next'),
				prev: $this.prev('.prev'),
				speed:  'slow', 
				pager: $this.prev('.slideshowNav')
				});
		});
		
		


		/* 
			$('.slides').each(function() {
			
				$('.slides').cycle({
					fx:     'fade',
					next:   '',
					prev:   '.prev',
					pager:  '.slideshowNav'
				});
			
			 });
		
		   */ 

		
		
		/* initialize defaults */
		//$('.pause').addClass('paused');
		//$('.slides').cycle('pause'); 
   
}


/******************************************************
		Close Story
******************************************************/

function closeStory() {
		
        $('.item').addClass('teaser');
        $('.item').removeClass('fullstory');
             $('.thumbnail .spinner').remove();
        $('.close-fullstory').remove();
      //$('.item').removeClass('opaque'); 
		
		
	   $('#drawer_top_frame, #drawer_bottom_frame').removeClass('filled');	
	   
	   $('#drawer_bottom_frame, #drawer_top_frame').slideUp(200);
	   $('#drawer_bottom_frame, #drawer_top_frame').empty();
		
		location.hash = '#';
		
       resetGrid();
   
}

/******************************************************
Open Next Story
******************************************************/

function nextStory() {

		$('.fullstory').next('.item').children('.readmore').click();
}


/******************************************************
Open Previous Story
******************************************************/

function prevStory() {

		$('.fullstory').prev('.item').children('.readmore').click();

}




/******************************************************
Hide iPhone URL Bar
******************************************************/

function hideMobileURL() {

	
		addEventListener("load", function() { setTimeout(hideURLbar, 0); }, false);
	
		function hideURLbar(){
		window.scrollTo(0,1);
		}
	

}






// easing equation used by scrollto, see if it's possible to combine with the same easing equations used in masonry

$.easing.elasout = function(x, t, b, c, d) {
		var s=1.70158;var p=0;var a=c;
		if (t==0) return b;  if ((t/=d)==1) return b+c;  if (!p) p=d*.3;
		if (a < Math.abs(c)) { a=c; var s=p/4; }
		else var s = p/(2*Math.PI) * Math.asin (c/a);
		return a*Math.pow(2,-10*t) * Math.sin( (t*d-s)*(2*Math.PI)/p ) + c + b;
};




