/* 

 *	Small Studio 2011
 
 * Author: Ben Lau
 
-------------------------------------------------------------------------------------------------- */
($(function(){
	
	// Run Small Studio, run!
	ss.init();
	
}));

/* Easings
-------------------------------------------------------------------------------------------------- */
$.easing.easeOutQuint = function(x,t,b,c,d){	return c*((t=t/d-1)*t*t*t*t + 1) + b; };

var ssConfig = {
	winHeight : $('#container').height(),
	resizeTimer : 0,
	$contentSection : $('.contentSection'),
	$project : $('#projectsCol').find('.project'),
	$featuredProject : $('.featured'),
	$blog : $('#blog'),
	$logo : $('#logo'),
	$h1 : $('#home h1'),
	$section : $('.section'),
	$sectionNav : $('.sectionNav'),
	$nav : $('#nav'),
	$navMoved : false,
	offsetLeft : 0,
	easeSpeed : 600,
	pageTarget : '',
	filterTarget : ''
}

var ss = {
	
	/* Initialise
	-------------------------------------------------------------------------------------------------- */
	init : function(){
		//ss.deepLink();
		ss.checkURLRedirect();
		ss.bindNav();
		ss.onLoadDetectWinHeight();
		ss.bindMaptooltips();
		ss.bindSectionNav();
		ss.bindProjectHover();
		ss.bindScrolling();
		ss.bindVideoFB();
		ss.bindContactNav();
	},
	
	
	/* Check for URL redirect
	-------------------------------------------------------------------------------------------------- */
	checkURLRedirect : function(){
		var url = window.location.href;
		url = url.split('?fb=');
		if(url.length > 1){
			url = url[1].split('#');
			var section = url[1];
			var page = url[0];
			//alert(section);
			//alert(page);
			var scrollCoord;
			var pageTrigger;
			switch(section){
				case 'about':
					scrollCoord = 1680;
					break;
				case 'services':
					scrollCoord = 2640;
					break;
				case 'work':
					scrollCoord = 720;
					break;
				default:
					break;
			}
			ss.animateScroll(scrollCoord, page);	
		}
	},
	
	/* Nav
	-------------------------------------------------------------------------------------------------- */
	bindNav : function(){
		$('#nav a').click(function(event){
			event.preventDefault();
			var target = this.hash.split('#')[1];
			if(target != ssConfig.pageTarget){
				ssConfig.pageTarget = target;
				ssConfig.$nav.hide();
				$(window).unbind('scroll');
				ss.getCoords(target);
			}
		})
	},
	
	/* Get Coords
	-------------------------------------------------------------------------------------------------- */
	getCoords : function(target){
		var scrollCoord;
		switch(target){
			case 'home': 
				scrollCoord = 0;
				break;
			case 'work':
				scrollCoord = 720;
				break;
			case 'about':
				scrollCoord = 1680;
				break;
			case 'services':
				scrollCoord = 2640;
				break;
			case 'blog':
				scrollCoord = 5520;
				break;
			case 'contact':
				scrollCoord = 6480;
				break;
			default:
				break;
		}
		ss.animateScroll(scrollCoord);
	},
	
	/* Animate Scroll
	-------------------------------------------------------------------------------------------------- */
	animateScroll : function(scrollCoord, checkedRD){
		if(!checkedRD){
			$('html,body').animate({scrollLeft: scrollCoord}, {duration: ssConfig.easeSpeed, easing: 'easeOutQuint', complete: ss.preNavMove});
		}
		else{
			$('html,body').animate({scrollLeft: scrollCoord}, {duration: ssConfig.easeSpeed, easing: 'easeOutQuint', complete: function(){
				var dwidth = $(window).width()-60;
				var dheight = $(window).height()-60;
				function preventDefault(e) { e.preventDefault(); }
				$('#fbrd_'+checkedRD).find('a').fancybox({
						scrolling: false,
						padding: 10,
						width: dwidth,
						height: dheight,
						autoDimensions : false,
						autoScale : false,
						overlayColor : '#000000',
						overlayOpacity : 0.8,
						onStart : function(){
							$('body').addClass('unscrollable');
							if (document.addEventListener){
								document.addEventListener('touchmove', preventDefault, false); 
							}
						},
						onComplete : function(){
							$('#fancybox-overlay').width($('body').width());
						},
						onCleanup : function(){
							if (document.removeEventListener){
								document.removeEventListener('touchmove', preventDefault, false); 
							}
							$('body').removeClass('unscrollable');
						}
				}).trigger('click');
			}});
		}
	},
	
	/* Get and set height on load
	-------------------------------------------------------------------------------------------------- */
	onLoadDetectWinHeight : function(){
				
		if(ssConfig.winHeight < 840 && ssConfig.winHeight > 600){
			ss.sixToEightForty(ssConfig.winHeight);
			}
		else if(ssConfig.winHeight <= 600){
			ss.lessThanSix();
			}
		ss.moveNav();
		
		$(window).resize(function(){
			clearTimeout(ssConfig.resizeTimer);
			ssConfig.resizeTimer = setTimeout(ss.resizeWindow, 400);
		});
	},
	
	/* On resize of window
	-------------------------------------------------------------------------------------------------- */
	resizeWindow : function(){
	
		var $winHeight = $('#container').height(); // needs update on window dimensions 
		
		if($winHeight < 840 && $winHeight > 600){
			ss.sixToEightForty($winHeight);
		}
		else if($winHeight <= 600){
			ss.lessThanSix();
		}
		else if($winHeight >= 840){
			ss.overEightForty();
		}
		
		if($winHeight > 690){
			//ssConfig.$sectionNav.add(ssConfig.$sectionNav.find('li')).removeAttr('style');
			ssConfig.$sectionNav.animate({'padding-top':140}, {duration:ssConfig.easeSpeed, easing:'easeOutQuint'})
				.find('li').animate({'margin-bottom':7}, {duration:ssConfig.easeSpeed, easing:'easeOutQuint'});
		}
		
		if($('#fancybox-wrap:visible').length && !ssConfig.fbIsvideo){
			var newFBHeight = $(window).height() - 55;
			var newFBWidth = $(window).width() - 55;
			var fbOffset = $(window).scrollLeft() + 20;
			
			$('#fancybox-wrap').css({ width: newFBWidth, height: newFBHeight, top: 20, left: fbOffset });
			$('#fancybox-content').css({width: newFBWidth-10, height: newFBHeight-10});
			$('#fancybox-content > div').css({height: newFBHeight-10, width: newFBWidth -10});
		}
		
	},
	
	/* Between 600 and 840
	-------------------------------------------------------------------------------------------------- */
	sixToEightForty : function(height){
		ssConfig.$contentSection.animate({'height':height}, {duration:ssConfig.easeSpeed, easing:'easeOutQuint'});
		ssConfig.$project.animate({'height':(height-120) / 6}, {duration:ssConfig.easeSpeed, easing:'easeOutQuint'}).find('strong').height((height-120)/6 - 31);
		ssConfig.$featuredProject.add('#video').add('#servicesMap').animate({'height': (height-120) / 2}, {duration:ssConfig.easeSpeed, easing:'easeOutQuint'});
		$('#home, #extra').height('100%');
		
		if(height < 781 && height >=600){
			ssConfig.$blog.find('.main').animate({'padding-top':0.17 * height},{duration:ssConfig.easeSpeed,easing:'easeOutQuint'}).end()
				.find('.archive').animate({'margin-top':0.03 * height},{duration:ssConfig.easeSpeed,easing:'easeOutQuint'}).end()
				.find('#blogDate').animate({'margin-top':0.03 * height},{duration:ssConfig.easeSpeed,easing:'easeOutQuint'}).end()
				.find('h3').animate({'margin-top':0.03},{duration:ssConfig.easeSpeed,easing:'easeOutQuint'});
		}
		
		if(height < 690 && height >= 600){
			ssConfig.$sectionNav.animate({'padding-top':0.198 * height}, {duration:ssConfig.easeSpeed, easing:'easeOutQuint'})
			.find('li').animate({'margin-bottom':0.005 * height}, {duration:ssConfig.easeSpeed, easing:'easeOutQuint'});
		}
		ssConfig.$section.height('100%');
		
		if(height < 811){
			$('#home').addClass('logoChange');
		}
	},
	
	// 226, 26, 35, 18
	
	/* Less than equal 600
	-------------------------------------------------------------------------------------------------- */
	lessThanSix : function(){
		//$('#content').css('overflow-y','auto');
		ssConfig.$contentSection.animate({'height':600}, {duration:ssConfig.easeSpeed, easing:'easeOutQuint'});
		ssConfig.$project.animate({'height':80}, {duration:ssConfig.easeSpeed, easing:'easeOutQuint'}).find('strong').height(49);
		ssConfig.$featuredProject.add('#video').add('#servicesMap').animate({'height':240}, {duration:ssConfig.easeSpeed, easing:'easeOutQuint'});
		$('#home, #extra').animate({'height':600}, {duration:ssConfig.easeSpeed, easing:'easeOutQuint'});
		//ssConfig.$logo.fadeOut(400);
		//ssConfig.$h1.height(505);
		
		ssConfig.$blog.find('.main').animate({'padding-top':103},{duration:ssConfig.easeSpeed,easing:'easeOutQuint'}).end()
			.find('.archive').animate({'margin-top':5},{duration:ssConfig.easeSpeed,easing:'easeOutQuint'}).end()
			.find('#blogDate').animate({'margin-top':10},{duration:ssConfig.easeSpeed,easing:'easeOutQuint'}).end()
			.find('h3').animate({'margin-top':0},{duration:ssConfig.easeSpeed,easing:'easeOutQuint'});
		
		ssConfig.$sectionNav.animate({'padding-top':119}, {duration:ssConfig.easeSpeed, easing:'easeOutQuint'})
			.find('li').animate({'margin-bottom':3}, {duration:ssConfig.easeSpeed, easing:'easeOutQuint'});
		ssConfig.$section.height(600);
		
		$('#home').addClass('logoChange');
	},
	
	/* Over 840
	-------------------------------------------------------------------------------------------------- */
	overEightForty : function(){
		ssConfig.$contentSection.animate({'height':840}, {duration:ssConfig.easeSpeed, easing:'easeOutQuint'});
		ssConfig.$project.animate({'height':120}, {duration:ssConfig.easeSpeed, easing:'easeOutQuint'}).find('strong').height(89);
		ssConfig.$featuredProject.add('#video').add('#servicesMap').animate({'height':360}, {duration:ssConfig.easeSpeed, easing:'easeOutQuint'});
		$('#home, #extra').animate({'height':'100%'}, {duration:ssConfig.easeSpeed, easing:'easeOutQuint'});
		//ssConfig.$logo.fadeIn(400);
		ssConfig.$section.height('100%');
		
		ssConfig.$blog.find('.main').animate({'padding-top':226},{duration:ssConfig.easeSpeed,easing:'easeOutQuint'}).end()
			.find('.archive').animate({'margin-top':26},{duration:ssConfig.easeSpeed,easing:'easeOutQuint'}).end()
			.find('#blogDate').animate({'margin-top':35},{duration:ssConfig.easeSpeed,easing:'easeOutQuint'}).end()
			.find('h3').animate({'margin-top':18},{duration:ssConfig.easeSpeed,easing:'easeOutQuint'});
		
		$('#home').removeClass('logoChange');
	},
	
	/* Map tooltip
	-------------------------------------------------------------------------------------------------- */
	bindMaptooltips : function(){
		$('#servicesMap h4').bind({
			mouseenter: function(){
				$(this).siblings('.tooltip').css('opacity',0).stop().show().animate({
					'left':84,
					'opacity':1
				}, {duration: 400, easing:'easeOutQuint'});
			},
			mouseleave: function(){
				$(this).siblings('.tooltip').stop().animate({
					'left':74,
					'opacity':0
				},   {duration: 250, easing:'easeOutQuint', complete: function(){	$(this).hide();  }});
			}
		});
	},
	
	/* Bind project hover
	-------------------------------------------------------------------------------------------------- */
	bindProjectHover : function(){
		// Maybe if statement whether it's not disabled?
		$('#projectsCol').delegate('a', 'mouseenter mouseleave', function(e){
			if(e.type === 'mouseenter'){
				$(this).find('.title').addClass('hover');
			}
			else if(e.type === 'mouseleave'){
				$(this).find('.title').removeClass('hover');
			}
		});
		
		$('#projectsCol').delegate('a', 'mouseenter', function(){
			function preventDefault(e) { e.preventDefault(); }
																							
			var dwidth = $(window).width()-60;
			var dheight = $(window).height()-60;
			$(this).fancybox({
				scrolling: false,
				padding: 10,
				width: dwidth,
				height: dheight,
				autoDimensions : false,
				autoScale : false,
				overlayColor : '#000000',
				overlayOpacity : 0.8,
				onStart : function(){
					calling = true;
					$('body').addClass('unscrollable');
					if (document.addEventListener){
						document.addEventListener('touchmove', preventDefault, false); 
					}

				},
				onComplete : function(){
					$('#fancybox-overlay').width($('body').width());
				},
				onCleanup : function(){
					if (document.removeEventListener){
						document.removeEventListener('touchmove', preventDefault, false); 
					}
					$('body').removeClass('unscrollable');
					calling = false;
				}
			});
		});
		
		
		
		
		ss.bindFilter();
	},
	
	/* Bind project Filter
	-------------------------------------------------------------------------------------------------- */
	bindFilter : function(){
		var $sectionNav = $('#work').find('.sectionNav');
		$sectionNav.find('a').bind({
			click: function(e){
				e.preventDefault();
				var clicked = this.hash.split('#')[1];
				if(ssConfig.filterTarget != clicked){
					$sectionNav.find('li').removeClass('on');
					$(this).parent('li').addClass('on');
					$('#work').find('img').animate({'opacity':1}, 100);
					ss.doFilter(clicked);				
				}
			}
		});
		
	},
	
	doFilter : function(clicked){
		$('#work').find('.project').each(function(){
			var $this = $(this);
			if(clicked != "all"){
				ssConfig.filterTarget = clicked;
				if(!$this.hasClass(clicked)){
					$this.find('img').animate({'opacity':0.2}, 200);
				}
			}
			else{
				ssConfig.filterTarget = '';
			}
		});
	},
	
	preNavMove : function(){
		if(!ssConfig.$navMoved){
			ssConfig.$navMoved = true;
			ss.moveNav();
		}
		else{
			ssConfig.$navMoved = false;
		}
	},
	
	moveNav : function(){
		var scrollOffset = ($('html').scrollLeft() < 1) ? $('body').scrollLeft() : scrollOffset = $('html').scrollLeft();
		if(scrollOffset != ssConfig.offsetLeft){
			ssConfig.$nav.css('left', scrollOffset);
			ssConfig.offsetLeft = scrollOffset;
		}
		ssConfig.$nav.fadeIn(400, function(){
			ss.bindScrolling();
		});
	},
	
	bindScrolling : function(){
		$(window).bind('scroll', function(){
			ssConfig.$nav.hide();
			clearTimeout(ssConfig.resizeTimer);
			ssConfig.resizeTimer = setTimeout(function(){
				ss.moveNav();
			}, 400);
		});
	},
	
	/* Bind pop up video
	-------------------------------------------------------------------------------------------------- */
	bindVideoFB : function(){
		
		function preventDefault(e) { e.preventDefault(); }
		
		$('a#videoTrigger').fancybox({
			autoDimensions : false,
			padding: 0,
			width: 800, 
			height: 600,
			autoScale : false,
			scrolling: true,
			overlayColor : '#000000',
			overlayOpacity : 0.8,
			onStart : function(){
					$('body').addClass('unscrollable');
					if (document.addEventListener){
						document.addEventListener('touchmove', preventDefault, false); 
					}
					
					ssConfig.fbIsvideo = true;
					
				},
			onComplete : function(){
				$('#fancybox-overlay').width($('body').width());
				
				function supports_video() {
  					return !!document.createElement('video').canPlayType;
				}
				
				if(supports_video()){
					var v = document.getElementById("movie");
					v.play();
				}
				else{
					jwplayer("mediaplayer").setup({
						flashplayer: "jwplayer/player.swf",
						file: "video/video.mp4",
						autostart : true,
						image: "jwplayer/preview.jpg",
						width:800,
						height:600
					});
				}
				
			},
			onCleanup : function(){
				if(typeof jwplayer!="undefined"){
					jwplayer("mediaplayer").stop();
				}
				if (document.removeEventListener){
					document.removeEventListener('touchmove', preventDefault, false); 
				}
				$('body').removeClass('unscrollable');
				
				ssConfig.fbIsvideo = false;
			}
		});

	},
	
	/* Bind section nav fancybox
	-------------------------------------------------------------------------------------------------- */
	bindSectionNav : function(){
		
		$('#about .sectionNav, #services .sectionNav, #servicesMap').delegate('a', 'mouseenter', function(){
			function preventDefault(e) { e.preventDefault(); }
																							
			var dwidth = $(window).width()-60;
			var dheight = $(window).height()-60;
			$(this).fancybox({
				scrolling: false,
				padding: 10,
				width: dwidth,
				height: dheight,
				autoDimensions : false,
				autoScale : false,
				overlayColor : '#000000',
				overlayOpacity : 0.8,
				onStart : function(){
					calling = true;
					$('body').addClass('unscrollable');
					
					if (document.addEventListener){
						document.addEventListener('touchmove', preventDefault, false); 
					}
					
				},
				onComplete : function(){
					$('#fancybox-overlay').width($('body').width());
				},
				onCleanup : function(){
					if (document.addEventListener){
						document.removeEventListener('touchmove', preventDefault, false); 
					}
					$('body').removeClass('unscrollable');
					calling = false;
				}
			});
		});
		
	},
	
	
	
	/* Bind section nav fancybox
	-------------------------------------------------------------------------------------------------- */
	bindContactNav : function(){
		
		$('#contactOpen').delegate('a', 'mouseenter', function(){
			function preventDefault(e) { e.preventDefault(); }
																							
			var dwidth = $(window).width()-60;
			var dheight = $(window).height()-60;
			$(this).fancybox({
				type: 'iframe',
				scrolling: false,
				padding: 10,
				width: dwidth,
				height: dheight,
				autoDimensions : false,
				autoScale : false,
				overlayColor : '#000000',
				overlayOpacity : 0.8,
				onStart : function(){
					$('body').addClass('unscrollable');
					
					if (document.addEventListener){
						document.addEventListener('touchmove', preventDefault, false); 
					}
					
				},
				onComplete : function(){
					$('#fancybox-overlay').width($('body').width());
				},
				onCleanup : function(){
					if (document.removeEventListener){
						document.removeEventListener('touchmove', preventDefault, false); 
					}
					$('body').removeClass('unscrollable');
				}
			});
		});
		
	}
	
	
	
}