// when the DOM is ready...
$(document).ready(function () {

	$('.lavaLamp').lavaLamp({ fx: 'backout', speed: 700 });


	var $panels = $('#portfolio .panel').css('padding', '0 20px');
	var $Mpanels = $('#main .main-panel');

	var $container = $('#portfolio .scroll-container');
	var $Mcontainer = $('#main .main-scroll-container')
	
	$('.description a.button').css('right', '16px');

	// if false, we'll float all the panels left and fix the width 
	// of the container
	var horizontal = true;

	// float the panels left if we're going horizontal
	if (horizontal) {
		$panels.css({
			'float' : 'left',
			'position' : 'relative' // IE fix to ensure overflow is hidden
		});

		$Mpanels.css({
			'float' : 'left',
			'position' : 'relative'
		});
		// calculate a new width for the container (so it holds all panels)
		$container.css('width', ($panels[0].offsetWidth * $panels.length) / 2);
		$Mcontainer.css('width', $Mpanels[0].offsetWidth * $Mpanels.length);
	}

	// collect the scroll object, at the same time apply the hidden overflow
	// to remove the default scrollbars that will appear
	var $scroll = $('#portfolio .scroll').css('overflow', 'hidden');
	var $Mscroll = $('#main .main-scroll').css('overflow', 'hidden');

	// apply our left + right buttons
	$scroll
		.before('<div class="scroll-buttons prev"></div>')
		.after('<div class="scroll-buttons next"></div>');

	// handle nav selection
	function selectNav() {
		$(this)
			.parents('ul:first')
				.find('a')
					.removeClass('selected')
				.end()
			.end()
			.addClass('selected');
	}

	function MSelectNav() {
		$(this)
			.parents('ul#nav')
				.find('a')
					.removeClass('current_page_item')
				.end()
			.end()
			.addClass('current_page_item');	
	}

	$('#portfolio .navigation').find('a').click(selectNav);
	$('#nav').find('a').click(MSelectNav);

	// go find the navigation link that has this target and select the nav
	function trigger(data) {
		var el = $('#portfolio .navigation').find('a[href$="' + data.id + '"]').get(0);
		selectNav.call(el);
	}
	
	function Mtrigger(data) {
		var el = $('#nav').find('a[href$="' + data.id + '"]').get(0);
		MSelectNav.call(el);
	}


	if (window.location.hash) {
		trigger({ id : window.location.hash.substr(1) });
	} else {
		$('ul#nav a:first').click();
		$('ul.navigation a:first').click();
	}


	// offset is used to move to *exactly* the right place, since I'm using
	// padding on my example, I need to subtract the amount of padding to
	// the offset.  Try removing this to get a good idea of the effect
	var offset = parseInt((horizontal ? 
		$container.css('paddingTop') : 
		$container.css('paddingLeft')) 
		|| 0) * -1;

	var MOffset = parseInt((horizontal ?
		$Mcontainer.css('paddingTop') :
		$Mcontainer.css('paddingLeft'))
		|| 0) * -1;


	var scrollOptions = {
		target: $scroll, // the element that has the overflow
		// can be a selector which will be relative to the target
		items: $panels,
		navigation: '.navigation a',
		// selectors are NOT relative to document, i.e. make sure they're unique
		prev: 'div.prev', 
		next: 'div.next',
		// allow the scroll effect to run both directions
		axis: 'xy',
		onAfter: trigger, // our final callback
		offset: offset,
		// duration of the sliding effect
		duration: 500,
		// easing - can be used with the easing plugin: 
		// http://gsgd.co.uk/sandbox/jquery/easing/
		easing: 'easeOutExpo'
	};

	// apply serialScroll to the slider - we chose this plugin because it 
	// supports// the indexed next and previous scroll along with hooking 
	// in to our navigation.
	$('#portfolio').serialScroll(scrollOptions);

	// now apply localScroll to hook any other arbitrary links to trigger 
	// the effect
//	$.localScroll(scrollOptions);

	// finally, if the URL has a hash, move the slider in to position, 
	// setting the duration to 1 because I don't want it to scroll in the
	// very first page load.  We don't always need this, but it ensures
	// the positioning is absolutely spot on when the pages loads.
//	scrollOptions.duration = 1;
//	$.localScroll.hash(scrollOptions);

	var MscrollOptions = {
		target: $Mscroll,
		items: $Mpanels,
		navigation: '#nav a',
		axis: 'xy',
		onAfter: Mtrigger,
		offset: MOffset,
		duration: 500,
		easing: 'easeOutExpo'
	};
	
	$.serialScroll(MscrollOptions);
//	$.localScroll(MscrollOptions);
//	MscrollOptions.duration = 1;
//	$.localScroll.hash(MscrollOptions);

	//Modify CSS for form since we now know user has JavaScript enabled:
	$.browser.msie ? IEformStyles() : formStyles();

	function IEformStyles() {
		$('form li').css('margin-bottom', '-13px');
		$('label').css({'position':'absolute','padding':'5px','margin-left':'3px','color':'#999','z-index':'1','cursor' :'text', 'margin-top':'15px'});
		$('input, textarea, select').css({'z-index':'0', 'padding':'4px', 'margin':'0'});	
		$('.wpcf7-form').css('margin-top', '-15px');
		$('.buttons').css('margin-top', '14px');
	}
	
	function formStyles() {
		$('form li').css('margin-bottom', '3px');
		$('label').css({'position':'absolute','padding':'5px','margin-left':'3px','color':'#999','z-index':'1','cursor' :'text'});
		$('input, textarea, select').css({'z-index':'0', 'padding':'6px', 'margin':'0'});
		$('input, textarea, select, label').css({'font':'inherit'});
	}
	
	if ($.browser.msie && $.browser.version < 7.0) {
		//Perform CSS transparency fix for transparent png in IE 6 ONLY if JavaScript is enabled.
		$('.scroll-buttons, #content, h3, .current img').css({ 'behavior':'url(http://jason-boyle.com/iepngfix.htc)'});
	}
	
	// Style form and make the 'Send' button on contact form appear pretty if JS is enabled.
	var submit = $('input[type=submit]').css('display', 'none');
	var newSubmit = $('<a href="#" class="button">Send</a>').insertAfter(submit);
	
	$(newSubmit).click(function(){
		$('form').trigger('submit');
	});
	
	if($.browser.msie) {
		$('.wpcf7-not-valid-tip-no-ajax').css('top', '16px')
	} else {
		$('.wpcf7-not-valid-tip-no-ajax').css('top', '0');
	}
	
	//Scriptify the navigation links if JS is on and show the divs and other JS only CSS bits
	$('li.page-item-3 a').attr('href', '#home');
	$('li.page-item-11 a').attr('href', '#about');
	$('li.page-item-13 a').attr('href', '#resume');
	
	$('h1 a').attr('href', 'javascript:;');
	$('h1 a').click(function() {
		$('.page-item-3 a').trigger('click');
	});
	
	$('.main-panel').css('display', 'block');
	
	$('#header').css('padding-bottom', '80px');
});