//$(document).ready equivalent
$(function()
{
	/*
	var resume = $('#resume');
	resume.height(($(window).height() - resume.offset().top - 10));
	*/
	var tabs = $('.tab');
	
	for (var i = 0; i < tabs.length; i++) 
	{
		setTimeout(function()
		{
			var index = i;
			return function()
			{
				$(tabs[index]).animate({
					paddingTop: 120
				}, 1500, 'easeOutBack');
			};
		}(), (i + 1) * 500);
	}
	/*
	//.resize will simply call .bind, so why not skip the slight overhead?
	//Additionally, it standardizes all calls to use .bind rather than a specific .syntax
	$(window).bind('resize', resumeResize);
	*/
	$('#about').bind('click', toggleAboutMe);
});


function resumeResize()
{
	var resume = $('#resume');
	var theWindow = $(window);
	
	resume.height(theWindow.height() - resume.offset().top - 10);
}

function toggleAboutMe()
{
	var aboutMe = $('#aboutMe');
	if (aboutMe.length == 0) 
	{
		var div = $(document.createElement('div'));
		div.hide();
		div.attr('id', 'aboutMe');
		div.text('This is just a demo for now, click About again to turn me on and off');
		div.css({
			left: ($(window).width() / 4) + 'px',
			width: ($(window).width() / 2) + 'px',
			top: ($(window).height() / 4) + 'px',
			height: ($(window).height() / 2) + 'px'
		});
		
		$(document.body).append(div);
		div.show(1500);
	}
	else 
	{
		aboutMe.toggle();
	}	
}
