//JavaScript Document
//developed by Stuart Runyan
//for www.stuartrunyan.com
$(document).ready(function(){
	
	/* Global Variables */
	var tumblrHtml = "";	
	
	function siteFirstLoad() {
		/* Set Content to hide so I can reveal with an effect */
		$('#container-top').hide();
		$('#menu').hide();
		$('#menu ul li').css("width","0");
		$('#menu ul li#nabout a').addClass('current');
		$('#logo').css({
			"top": "200px",
			"left": "35%",
			"fontSize" : "4em",
			"display" : "none"
		});
		/* Effect to reveal page */
		$('#logo').fadeIn(1000).animate({
			top: "0",
			left: "0",
			fontSize: "1.8em"
		}, 2000, function(){
			$('#menu').slideDown(800);
			$('#menu ul li#nabout').animate({width: "100px"}, 400, function(){
				$('#menu ul li#nportfolio').animate({width: "120px"}, 400, function(){
					$('#menu ul li#nblog').animate({width: "80px"}, 400, function(){
						$('#menu ul li#ncontact').animate({width: "110px"}, 400, function(){
							$('#container-top').slideDown(800);
						});	 
					});			 
				});
			});
		});
	};
	
	/* Portfolio opacity slides */
	function portfolioSlides(){
		$('.client h2').css({
			"height" : "155px",
			"opacity" : "0.5"
		});
		$('.client').hover(
			function(){
				$(this).find('h2').stop(true,true).animate({
					height: "24px",
					opacity: "1"
				}, 200);
			},
			function(){
				$(this).find('h2').stop(true,true).animate({
					height: "155px",
					opacity: "0.5"
				}, 600);
			}
		)
	};
	
	/* Captures portfolio page links and loads the content through ajax */
	function portfolioLinks(){
		$('.client a').click(function(){
			var path = $(this).attr("href");
			$('#container-top').stop(true,true).slideUp(600, function(){
		 /* The space here is very important |  it's what tells jquery to parse the DOM to this element and load the innerHTML, so glad I figured this out! */
				$('#container-top').load(path + ' #container', function(){
					portfolioSlides();
					clientEffects();
					gallery();
					$('#container-top').stop(true,true).slideDown(800);	
				});
			});	
			return false;
		});	
	};
	
	function clientEffects(){
		$('#client-image-desc').hide();
		$('#client-image-desc').css("opacity","0.3");
		$('#client-image').hover(function(){
			$('#client-image-desc').stop(true,true).animate({opacity:"0.95"}, 0).slideDown();
		},function(){
			$('#client-image-desc').stop(true,true).animate({opacity:"0.5"}, 200).slideUp();
		});
	};
	
	function gallery(){
		$('#thumbnail-wrapper .thumbnail a').click(function(){
			var thumbnailHref = $(this).attr('href');
			var thumbnailDesc = $(this).children('img').attr('alt');
			
			$('#client-image img').stop(true,true).fadeOut(400, function(){
				$('#client-image #client-image-desc').html(thumbnailDesc);
				$('#client-image img').attr('src', thumbnailHref).delay(200).fadeIn(600);;
			});
			
			return false;
		});
	}
		
	/* Contact form functionality */	
	function formSubmit(){
		$('#contact_form').submit(function() {
			var data_str = $('#contact_form').serialize(); // takes all field info from the form and builds a string to be sent with the form post
			$.post('/scripts/ajax_post.php', data_str, function(data, status){eval(data);} );
			
			return false; // stops form from refreshing the page
		});	
	}
	function clear_errors () {
		$('#contact_form').children('span').html('');
	}
	function gen_error (index, message) {
		$('[name="'+index+'"]').prev('span').html(message);
	}
		
	/* Gets JSON fron tumblr to load my blog feed into my site */
	function tumblrLoad(){
		$.getJSON("http://stuartrunyan.tumblr.com/api/read/json?num=5&callback=?", function(data) { 							
			$.each(data.posts, function(i,posts){ 
				var type = this.type;
				var date = this.date;
				var title = this["regular-title"];
				var url = this.url; 
				
				//This massive beast of a switch statement handles all the tumblr post type cases
				switch(type){
					case "regular":
					var bodytext = this["regular-body"]; 
					tumblrHtml += '<div class="post"><h2 class="post-title"><small class="post-date">'+date+'</small>'+title+'</h2><div class="post-content"><p>'+bodytext+'</p></div></div>'; 
					break;
					
					case "link":
					var linkdesc = this["link-description"]; 
					var linktext = this["link-text"]; 
					var linkurl = this["link-url"]; 
					tumblrHtml += '<div class="post"><h2 class="post-title"><small class="post-date">'+date+'</small><a href="../'+linkurl+'">'+linktext+'</a></h2><div class="post-content"><p>'+linkdesc+'</p></div></div>';
					break;
					
					case "quote":
					var quotetext = this["quote-text"]; 
					var quotesource = this["quote-source"]; 
					tumblrHtml += '<div class="post"><h2 class="post-title"><small class="post-date">'+date+'</small></h2><div class="post-content"><quote>'+quotetext+'</quote><p>'+quotesource+'</p></div></div>';
					break;
					
					case "photo":
					var photourl_500 = this["photo-url-500"];
					var photocaption = this["photo-caption"];
					tumblrHtml += '<div class="post"><h2 class="post-title"><small class="post-date">'+date+'</small></h2><div class="post-content"><img src="'+photourl_500+'" /><p>'+photocaption+'</p></div></div>';
					break;
					
					case "video":
					var videoplayer = this["video-player"];
					var videocaption = this["video-caption"];					
					tumblrHtml += '<div class="post"><h2 class="post-title"><small class="post-date">'+date+'</small></h2><div class="post-content"><p>'+videoplayer+'</p><p>'+videocaption+'</p></div></div>';
					break;
					
					case "audio":
					var audioplayer = this["audio-player"];
					var audiocaption = this["audio-caption"];					
					tumblrHtml += '<div class="post"><h2 class="post-title"><small class="post-date">'+date+'</small></h2><div class="post-content"><p>'+audioplayer+'</p><p>'+audiocaption+'</p></div></div>';
					break;
					
					case "conversation":
					var videoplayer = this["video-player"];					
					tumblrHtml += '<div class="post"><h2 class="post-title"><small class="post-date">'+date+'</small>'+title+'</h2><div class="post-content"><p>'+bodytext+'</p></div></div>';
					break;
										
					case "answer":
					var videoplayer = this["video-player"];					
					tumblrHtml += '<div class="post"><h2 class="post-title"><small class="post-date">'+date+'</small>'+title+'</h2><div class="post-content"><p>'+videoplayer+'</p></div></div>';
					break;
				}
			}); 
		}); 
	};
	
	/* Controls fading in and out of content on menu clicks, as well as loading the portfolio page effects and rebinding */
	$('#menu ul li a').click(function(){
		var path = $(this).attr('href');
		var menuId = $(this).parent().attr('id');
		
		$('#menu ul li a').removeClass('current');
		$(this).addClass('current');
		$('#container-top').slideUp(600, function(){
	 /* The space here is very important |  it's what tells the jquery to parse the DOM to this element and load the innerHTML, so glad I figured this out! */
			$('#container-top').load(path + ' #container', function(){
				portfolioSlides();
				portfolioLinks();/* <- event rebinding http://docs.jquery.com/Frequently_Asked_Questions#Why_do_my_events_stop_working_after_an_AJAX_request.3F */
				formSubmit(); /* sets binding for form AJAX submitting */
				if(path == "/blog.php"){
					$('#blog').html(tumblrHtml);
				}
				//Set body ID for proper bkg images for each section
				switch(menuId){
					case "nabout":
					$('body').attr('id','dabout');
					break;
					case "nportfolio":
					$('body').attr('id','dportfolio');
					break;
					case "nblog":
					$('body').attr('id','dblog');
					break;
					case "ncontact":
					$('body').attr('id','dcontact');
					break;
				};
				$('#container-top').slideDown(800);	
			});
		});		
		return false;
	});
	
	//Loading animation for AJAX requests
	$('#loading-animation').ajaxStart(function(){
		$(this).fadeIn();			   
	});
	$('#loading-animation').ajaxStop(function(){
		$(this).fadeOut();			   
	});
	$('#loading-animation').ajaxError(function(){
		$('#loading-animation').append('Loading Error');			   
	});
	//Hides imediatley so it wont appear during site launch
	$('#loading-animation').hide();

	/* this only runs once because the clicks from the menu are intercepeted and returned false, 
	thus never loading the page again, 
	thus not trigering this function again, 
	giving me the desired effect of it running on the first load of the site */
	siteFirstLoad();
	
	/* loads tumblr feed in background so it seems seamless */
	tumblrLoad();
	
	

});