$(document).ready(function() {

	// I'm on the outside
	hostname = window.location.hostname
	$("a[href^=http]")
		.not("a[href*='" + hostname + "']")
		.addClass('link external')
		.attr('target', '_blank');
		
	
	// Build the Power button
	// This is mostly just so search engines and screen readers don't see this link.
	$('body').append('<div id="overlay"><a href="#" class="power-button">o hai</a></div>')
	
	
	// Power button
	$('a.power-button').click(function(){
		$('body').removeAttr('style'); // kill the black BG override
		$('#wrapper').show(); // show the rest of the content
		$('#overlay').fadeOut(700,function(){ // fade the overlay out
			$('#overlay').remove(); // nuke the overlay node
		});
		
		return false;
	});
	
	
	// Nav buttons
	$('ul#navigation a').click(function(){
		
		// Don't do anything when clicking the active tab
		if (!$(this).hasClass('current')) {
			section = $(this).attr('href');

			// Highlight current button
			$('ul#navigation a').removeClass('current');
			$(this).addClass('current');

			// Content slider
			slideSpeed = 500;

			// Slide the current tab out
			$('.section').not('.section' + section).css({
				marginRight: 0,
				opacity: 1});
			$('.section').not('.section' + section).animate({
				marginLeft: -1000,
				opacity: 0}, slideSpeed, function(){
					$('.section').not('.section' + section).css({display: 'none'})
			});
			
			// ... and slide the new tab in
			$('.section' + section).css({
				marginLeft: 1000,
				opacity: 0,
				display: 'block'});
			$('.section' + section).animate({
				marginLeft: 0,
				opacity: 1}, slideSpeed);
		};
	
		return false;
	});
	
	
	// Hovery bits
	$('ul#navigation a').hover(function(){
		$(this).addClass('hover');
		$(this).next().addClass('hover');
	},function(){
		$(this).removeClass('hover');
		$(this).next().removeClass('hover');
	});
	
	
	// hovering in .name
	$('ul#navigation li .name').hover(function(){
		$(this).prev().addClass('hover');
		$(this).addClass('hover');
	},function(){
		$(this).prev().removeClass('hover');
		$(this).removeClass('hover');
	});
	
	
	// clicking in .name
	$('ul#navigation li .name').click(function(){
		$(this).prev().trigger('click');
	});
	
	
	// hovering in an item's image
	// $('.item img').tooltip({
	// 	effect: 'slide',
	// 	relative: true,
	// 	offset: [43, -6]
	// });
	
	
	// Language tags
	$('.item').each(function(){ 
		
		item = $(this);
		languages = item.find('span.languages');
		openTag = '<a href="#" class="language">';
		closeTag = '</a>'
		
		// Kinda ghetto, but whatever. I'll clean this up into a pretty function later.
		if (item.hasClass('haml')){
			languages.append(openTag+'haml'+closeTag);
		}
		
		if (item.hasClass('sass')){
			languages.append(openTag+'sass'+closeTag);
		}
		
		if (item.hasClass('compass')){
			languages.append(openTag+'compass'+closeTag);
		}
		
		if (item.hasClass('jquery')){
			languages.append(openTag+'jquery'+closeTag);
		}
		
		if (item.hasClass('jstemplates')){
			languages.append(openTag+'jstemplates'+closeTag);
		}
	});
	
	// Language Tag Highlighting
	$('.item a.language').live('click', function(){
		
		item = $(this).closest('.item');
		langClass = $(this).text();
		
		$(this).toggleClass('selected');
		$('.item').not('.item.' + langClass).toggleClass('exclude-' + langClass)
		$('.item.' + langClass ).toggleClass('include-' + langClass)
		
		$('.item a.language:contains('+langClass+')').not($(this)).each(function(){
			$(this).toggleClass('selected');
		})
		
		return false;
		
	})
	
});