$(document).ready(function(){
	
	$.fn.supersized.options = {
		startwidth: 1339,
		startheight: 1000,
		vertical_center: 0,
		slideshow: 0,
		navigation: 0,
		transition: 0
	};
	$('#supersize').supersized();
	$('#our-clients img').tipTip({defaultPosition: 'left'});
	$('#devour-logo').supersleight({shim: '/wp-content/themes/devourdesign/images/x.gif'});
	$('.wpcf7-submit').supersleight({shim: '/wp-content/themes/devourdesign/images/x.gif'});
	try{Typekit.load();}catch(e){};
	
	// Run the setup scripts
	archiveSetup();
	navAnimation();
	subnavAnimation();
	footerSetup();
 	gallerySetup();
	siteurlSetup();
	// commentlinkSetup();
	// introSetup();
	// projectsSetup();
	openNewWindow('.external');

	// Set up hpsetup() variables
	//save selectors as variables to increase performance
	var $window = $(window);
	var windowHeight = $window.height(); //get the height of the window
	var	$sections = $('.home #page-content section');
	var $firstBG = $('#project0');
	var $firstMid = $("#project0 .bg");
	var $secondBG = $('#project1');
	var $secondMid = $("#project1 .bg");
	var $thirdBG = $('#project2');
	var $thirdMid = $("#project2 .bg");
	var	$inertia_bg = 0.2;
	var	$inertia_mid = 0.4;	
	hpSetup();
		
	// Highlight current archive
	function archiveSetup() {
		var current_url = window.location.href;
		$('.archives li').each(function() {
			if ( $('a', this).attr('href') == current_url ) {
				$(this).addClass('current-archive');
			}				
		});
	};
	
	// Animate background colour of main navigation
	function navAnimation() {
		$('#main-navigation li:not(".current_page_item, .current_page_parent") a').each(function () {
			$(this).wrapInner('<span />');
			$('<div class="fader" />').css('opacity', 0).prependTo(this);
			$(this).css('backgroundColor', 'transparent');
		})	
		.hover(function () {
			$('.fader', this).stop().animate({
				opacity: 0.4
			}, 250);
		}, function () {
			$('.fader', this).stop().animate({
				opacity: 0
			}, 250);
		});
		$('#submenu .second li:not(".current-cat, .current-archive") a').each(function () {
			$(this).wrapInner('<span />');
			$('<div class="fader" />').css('opacity', 0).prependTo(this);
			$(this).css('backgroundColor', 'transparent');
		})	
		.hover(function () {
			$('.fader', this).stop().animate({
				opacity: 0.4
			}, 250);
		}, function () {
			$('.fader', this).stop().animate({
				opacity: 0
			}, 250);
		});
	};
	
	// Animate sub-navigation
	function subnavAnimation() {
		$('#submenu .third').hide().delay(1000).show('slide', { direction: "up" }, 750);
	};
	
	// Footer slide-out
	function footerSetup() {
		// testing
		
		if ($.browser.msie && parseFloat($.browser.version) < 7) {

			// Trim background to body height
/*			var body_height = $('body').outerHeight();
			$('#supersize').height(body_height);
			$('#supersize').css('overflow','hidden');
*/

			// TESTING
			var window_height = $(window).height();
			var scroll_top = $(window).scrollTop();
			var footer_height = $('#main-footer').outerHeight();
			var footer_top = window_height + scroll_top - footer_height;
			$('#main-footer').css('top', footer_top);	
			$(window).scroll(function() {
				scroll_top = $(window).scrollTop();
				footer_top = window_height + scroll_top - footer_height;
				$('#main-footer').css('top', footer_top);
			});

			// END TESTING
			
		} else {
			$('#main-footer').prepend('<p id="toggle"><a href="#"><span>Reveal/hide</span></a></p>');

			var footer_height = $('#main-footer').outerHeight();
			$('#main-footer').css('bottom', 15-footer_height);
			$('#main-footer').hover(
				function () {
					footerShow();
				}, function () {
					footerHide();
				}
			);		
		};
	};
	function footerShow() {
		$('#main-footer').stop().animate({
			bottom: 0
		}, 500, 'easeInOutQuad')
		.addClass('open');
	};
	function footerHide() {
		var footer_height = $('#main-footer').outerHeight();
		$('#main-footer').stop().animate({
			bottom: 15-footer_height
		}, 500, 'easeInOutQuad')
		.removeClass('open');
	};

	// Homepage intro slide-out
	function introSetup() {
		$('#intro .read-more a').toggle(function() {
			introShow();
			$(this).addClass('close');
			$(this).text('Close')
			return false;
		}, function() {
			introHide();
			$(this).removeClass('close');
			$(this).text('Read more')
			return false;
		});
	};
	function setIntroSize() {
		var recent_projects_width = $('#recent-projects').outerWidth();
		var intro_extended_width = $('#intro-extended').width();
		var intro_extended_outer_width = $('#intro-extended').outerWidth();
		var intro_extended_padding_width = intro_extended_outer_width - intro_extended_width;
		intro_extended_width = recent_projects_width - intro_extended_padding_width;
		var intro_extended_para_width = ((intro_extended_width  - 40) / 2);
		var intro_extended_paras = $('#intro-extended p');
		intro_extended_paras.each(function(index) {
			$(this).width(intro_extended_para_width);
			if (index == 0){
				$(this).css('padding-right', 40);
			}
		});
		$('#intro-extended').width(intro_extended_width);	
	};
	function introShow() {
		setIntroSize();
		$('#intro-extended').show('slide', { direction: "left" }, 500);
		$(window).resize(function(event){
			event;
			setIntroSize();
		});
	};
	function introHide() {
		$('#intro-extended').hide('slide', { direction: "left" }, 500);
		$(window).unbind('resize');
	};
	
	// Recent Projects background functions
	function projectsSetup() {
		$('#recent-projects li').each(function(index) {
			var project_image = $('img', this).attr('src');
			$('#recent-projects').prepend('<div class="project-background" id="project-background-' + index + '" />');
			$('#project-background-' + index).css('background-image', 'url(' + project_image + ')');
		});
		projectsClearActive();
		projectsAttachBehaviour();
	};
	function projectsClearActive() {
		$('#recent-projects li').each(function(index) {
			$('.active', this).removeClass('active');
			$('h3 a', this).stop().animate({
				color: "rgb(99,99,99)"
			});
			$('#project-background-' + index)
				.stop()
				.animate({
					opacity: 0
				}, 500);
		});
	};
	function projectsAttachBehaviour() {
		$('#recent-projects li').each(function(index) {
			if (index==0) {
				projectsClearActive();
				// animate text colour
				$('h3 a', this).stop().animate({
					color: "rgb(209,209,209)"
				}, 500);
				// change background
				$('h3', this).addClass('active');
				$('#project-background-' + index)
					.stop()
					.animate({
						opacity: 1
					}, 500);
				
			};
			$(this).mouseenter(function() {
				projectsClearActive();
				// animate text colour
				$('h3 a', this).stop().animate({
					color: "rgb(209,209,209)"
				}, 500);
				// change background
				$('h3', this).addClass('active');
				$('#project-background-' + index)
					.stop()
					.animate({
						opacity: 1
					}, 500);
			});
		});
	};
	
	
	
	// Homepage projects setup
	function hpSetup() {

		$('.home #page-content section').css('min-height',windowHeight);
			
		var $about = $('#about-text');
		$about.before('<a href="#" class="expand">More</a>');
		$about.hide();
		$('.home #about .expand').toggle(function(){
			$about.slideToggle(500,'linear');
			// $(this).css('backgroundPosition','0 -57px');
			$(this).addClass('open');
		}, function(){
			$about.slideToggle(500,'linear');
			// $(this).css('backgroundPosition','0 0');			
			$(this).removeClass('open')
		});
		
		$('#project0, #project1, #project2').bind('inview', function (event,visible) {
			if (visible == true) {
				$(this).addClass('inview');
				// $id = $(this).attr('id');
				// $('#recent-projects a[href="#'+$id+'"]').addClass('current');
			} else {
				$(this).removeClass('inview');
				// $('#recent-projects a[href="#'+$id+'"]').removeClass('current');
			}
		});
				
		$window.resize(function(){
			Move();
		});
		$window.bind('scroll', function(){
			Move();
		});
		
		$('#recent-projects').localScroll({
			easing:'easeOutQuart',
			duration:700
		});
		
		Move();
		
	};
	
	//function that is called for every pixel the user scrolls. Determines the position of the background
	/*arguments: 
		x = horizontal position of background
		windowHeight = height of the viewport
		pos = position of the scrollbar
		adjuster = adjust the position of the background
		inertia = how fast the background moves in relation to scrolling
	*/
	function newPos(x, windowHeight, pos, adjuster, inertia){
		return x + '% ' + (-((windowHeight + pos) - adjuster) * inertia)  + 'px';
	};
	
	//function to be called whenever the window is scrolled or resized
	function Move(){ 
		var pos = $window.scrollTop(); //position of the scrollbar
		
		$sections.each(function(){
		// $('.home #page-content section').each(function() {
			$id = $(this).attr('id');
			$height = $(this).outerHeight();
			$top = $(this).offset().top;
			$bottom = $top + $height;
			if (($top <= pos)&&($bottom > pos)) {
				$('#recent-projects a[href="#'+$id+'"]').addClass('current');
			} else {
				$('#recent-projects a[href="#'+$id+'"]').removeClass('current');
			};
		});			
		
		//if the first section is in view...
		if($firstBG.hasClass("inview")){
			$top = $firstBG.offset().top;
			$adjuster_bg = $top + windowHeight;

			//call the newPos function and change the background position
			$firstBG.css({'backgroundPosition': newPos(0, windowHeight, pos, $adjuster_bg, $inertia_bg)}); 
			//call the newPos function and change the second background position
			$firstMid.css({'backgroundPosition': newPos(100, windowHeight, pos, $adjuster_bg, $inertia_mid)});
		}
		
		//if the second section is in view...
		if($secondBG.hasClass("inview")){
			$top = $secondBG.offset().top;
			$adjuster_bg = $top + windowHeight;
			//call the newPos function and change the background position
			$secondBG.css({'backgroundPosition': newPos(0, windowHeight, pos, $adjuster_bg, $inertia_bg)});
			//call the newPos function and change the second background position
			$secondMid.css({'backgroundPosition': newPos(100, windowHeight, pos, $adjuster_bg, $inertia_mid)});
		}
		
		//if the third section is in view...
		if($thirdBG.hasClass("inview")){
			$top = $thirdBG.offset().top;
			$adjuster_bg = $top + windowHeight;
			//call the newPos function and change the background position
			$thirdBG.css({'backgroundPosition': newPos(0, windowHeight, pos, $adjuster_bg, $inertia_bg)});
			//call the newPos function and change the second background position
			$thirdMid.css({'backgroundPosition': newPos(100, windowHeight, pos, $adjuster_bg, $inertia_mid)});
		}

		// console.log('$top: '+$top+'; $inertia_bg: '+$inertia_bg+'; $adjuster_bg: '+$adjuster_bg);

	}
		
	
	// Project image gallery
	function gallerySetup() {
		$('#project-screenshots').after('<ol id="project-screenshots-list" />').addClass('gallery');
/* 		$('#project-screenshots-list').hide(); */
		$('#project-screenshots li').each(function(index) {
			$('img', this).stop().animate({
				opacity: 0
			}, 0)
			$(this).attr('id', 'screenshot-' + index);
			$('#project-screenshots-list').append('<li id="screenshot-link-' + index + '"><a href="#' + index + '">' + (index+1) + '</a></li>');
		});


		var first_screenshot = $('#project-screenshots li:first img');

/*
		var description = $('#project-description');
		var description_padding_left = parseInt(description.css('padding-left'));
		var description_padding_right = parseInt(description.css('padding-right'));
*/
		first_screenshot.stop().animate({
			opacity: 1
		}, 0)

/*
		first_screenshot.bind('load', function(e) {
			var first_screenshot_height = $(this).outerHeight();
//			var first_screenshot_width = first_screenshot.outerWidth();
//			$('#project-screenshots').height(first_screenshot_height).width(first_screenshot_width);
			$('#project-screenshots').height(first_screenshot_height);
//			description.width(first_screenshot_width-description_padding_left-description_padding_right);
//			$('#project-screenshots-list').show();
		});
*/

		first_screenshot.imagesLoaded(function(img){
			var first_screenshot_height = $(img).outerHeight();
			$('#project-screenshots').css('height',first_screenshot_height+'px');
		});
		
		
		$('#project-screenshots-list a').each(function(index) {
			$(this)
				.mouseenter(function() {
					$(this).stop().animate({
						color: 'rgb(255,255,255)'
					}, 250)
				})
				.mouseleave(function() {
					$(this).stop().animate({
						color: 'rgb(173,173,173)'
					}, 250)
				})
				.click(function(event) {
					galleryClear();
					var current_image = $('#screenshot-' + index + ' img');
					var screenshot_height = current_image.outerHeight();
					$('#project-screenshots')
						.stop()
						.animate({
							height: screenshot_height
						}, 250, 'easeInOutQuad')
					$('#screenshot-' + index + ' img')
						.stop()
						.animate({
							opacity: 1
						}, 500)
						.addClass('active');
					event.preventDefault();
					$(this).parent().addClass('active');
					$(this).unbind('mouseleave');
				});
		});
		
		$('#project-screenshots-list li:first a').mouseenter().click();
		first_screenshot.stop().css('opacity',1);
	};	
	function galleryClear() {
		$('#project-screenshots .active').each(function(){
			$(this)
				.stop()
				.animate({
					opacity: 0
				}, 500)
				.removeClass('active');			
		});
		$('#project-screenshots-list .active').each(function(){
			$(this).removeClass('active');
			$('a', this)
				.stop()
				.animate({
					color: 'rgb(173,173,173)'
				}, 250)
				.mouseleave(function() {
					$(this).stop().animate({
						color: 'rgb(173,173,173)'
					}, 250)
				})
		});
	};
	
	// Visit Site rollover effect
	function siteurlSetup() {
		$('.siteurl').each(function() {
			$('a', this)
				.css('background-color', 'rgb(34,34,34)')
				.hover(function() {
					$(this).stop().animate({
						backgroundColor: 'rgb(211,3,96)'
					}, 250);
				}, function() {
					$(this).stop().animate({
						backgroundColor: 'rgb(34,34,34)'
					}, 250);
				});
		});
	};
	
	// Leave Comment rollover effect
	function commentlinkSetup() {
		$('.commentlink').each(function() {
			$('a', this)
				.css('background-color', 'rgb(223,223,223)')
				.hover(function() {
					$(this).stop().animate({
						backgroundColor: 'rgb(211,3,96)'
					}, 250);
				}, function(){
					$(this).stop().animate({
						backgroundColor: 'rgb(223,223,223)'
					}, 250);
				});
		});
	};
	
	// open link in new tab/window
	function openNewWindow($a) {
		$a = $($a);
		$a.find('a').each(function(){
			$(this).click(function(event){
				$href = $(this).attr('href');
				event.preventDefault(),
				window.open($href);
				// console.log($href);
			});
		});
	};			
});

/*
Parallax script based on 'Recreating the Nikebetterworld.com Parallax Demo'
Author: Ian Lunn
Author URL: http://www.ianlunn.co.uk/
Demo URL: http://www.ianlunn.co.uk/demos/recreate-nikebetterworld-parallax/
Tutorial URL: http://www.ianlunn.co.uk/blog/code-tutorials/recreate-nikebetterworld-parallax/

License: http://creativecommons.org/licenses/by-sa/3.0/ (Attribution Share Alike). Please attribute work to Ian Lunn simply by leaving these comments in the source code or if you'd prefer, place a link on your website to http://www.ianlunn.co.uk/.

Dual licensed under the MIT and GPL licenses:
http://www.opensource.org/licenses/mit-license.php
http://www.gnu.org/licenses/gpl.html
*/