//////////////////////////////////////////
//  Delay Plugin
/////////////////////////////////////////
(function($){
	$.fn.delay = function(time, callback){
		jQuery.fx.step.delay = function(){};
		return this.animate({delay:1}, time, callback);
	}
})(jQuery);

////////////////////////////////////////
// Over Label
////////////////////////////////////////
jQuery.fn.overlabel = function() {
    this.each(function(index) {
        var label = $(this); var field;
        var id = this.htmlFor || label.attr('for');
        if (id && (field = document.getElementById(id))) {
            var control = $(field);
            label.addClass("overlabel-apply");
            if (field.value !== '') {
                label.css("display", "none");
            }
            control.focus(function () {label.css("display", "none");}).blur(function () {
                if (this.value === '') {
                    label.css("display", "block");
                }
            });
            label.click(function() {
                var label = $(this); var field;
                var id = this.htmlFor || label.attr('for');
                if (id && (field = document.getElementById(id))) {
                    field.focus();
                }
            });
        }
    });
};
//////////////////////////////////////////
//  Live Loader
/////////////////////////////////////////
(function($){
	$.fn.liveLoad = function(options) {

		// Options
		var defaults = {  
			self : false,
			openClass : 'open',  
			contentToFetch : '#page',  
			contentToReplace : '#content_main',
			onBefore : function(){},
			onAfter : function(){}
		};  
		var options = $.extend(defaults, options);


		this.live('click', function() {

			var $this = $(this);

			// URL Location
			var $url = $this.find('a').attr('href');

			if (options.self === true) {
				if ($this.hasClass('open')) {
					return false;
				} else {
					$this.addClass('loading');
					fetchContent();
				}
			} else {
				$(options.contentToReplace).addClass('loading');
				fetchContent();
			} 

			// Content Fetcher
			function fetchContent() {
				if (options.self === true) {
					$this.find('>div').hide();
				} else {
					$(options.contentToFetch).remove();
				}
				// Ajax Setup
				$.ajax({
					type: 'get',
					url: $url,
					dataType: 'html',
					success: displayContent
				});
			} 


			// Content Displayer
			function displayContent(html){

				var $html = jQuery('<div>'+html+'</div>').find(options.contentToFetch);
				
				options.onBefore.call();
				
				if (options.self === true) {
					// Remove Injected Content from DOM
					$this.siblings().find(options.contentToFetch).remove().end()
					// Show Description
					.find('>div').show().end()
					// Remove open class
					.removeClass(options.openClass).end()
					//  Add open class append content strip loader
					.addClass(options.openClass).append($html).removeClass('loading');
				} else {
					$(options.contentToReplace).append($html).removeClass('loading');
					$html.hide().fadeIn(100);
				}
				
				options.onAfter.call();
			}
			return false;
		});
		return this;
	}
})(jQuery);
//////////////////////////////////////////
//  Document Ready
/////////////////////////////////////////
$(document).ready(function(){
	// Open external links in new window
	$('a[rel*="external"], .entry a, .grid_6 a, .grid_10 a, .grid_16 .bottom_space a').live('click', function(){
		window.open(this.href);
		return false;
	});

    // Main page nav
    var content1 = $('#content_01');
    var content2 = $('#content_02');
    var content3 = $('#content_03');
    var content4 = $('#content_04');
    var content_hide1 = $('#content_02, #content_03, #content_04');
    var content_hide2 = $('#content_01, #content_03, #content_04');
    var content_hide3 = $('#content_01, #content_02, #content_04');
    var content_hide4 = $('#content_01, #content_02, #content_03');
    var content_hide_all = $('#content_01, #content_02, #content_03, #content_04');

    $('#nav .yellow').click(function() {
        content_hide1.hide( 500 );
        content1.delay( 200 ).slideDown( 800 );
        $('#nav .yellow h4').addClass('active');
        $('#nav .green h4, #nav .blue h4, #nav .pink h4').removeClass('active');
        $('.grid_4_cell').addClass('hidden_box');
    });

    $('#nav .green').click(function() {
        content_hide2.hide( 500 );
        content2.delay( 200 ).slideDown( 800 );
        $('#nav .green h4').addClass('active');
        $('#nav .yellow h4, #nav .blue h4, #nav .pink h4').removeClass('active');
        $('.grid_4_cell').addClass('hidden_box');
    });
    
	$('#nav .blue').click(function() {
        content_hide3.hide( 500 );
        content3.delay( 200 ).slideDown( 800 );
        $('#nav .blue h4').addClass('active');
        $('#nav .yellow h4, #nav .green h4, #nav .pink h4').removeClass('active');
        $('.grid_4_cell').addClass('hidden_box');
    });
    
    $('#nav .pink').click(function() {
        content_hide4.hide( 500 );
        content4.delay( 200 ).slideDown( 800 );
        $('#nav .pink h4').addClass('active');
        $('#nav .yellow h4, #nav .green h4, #nav .blue h4').removeClass('active');
        $('.grid_4_cell').addClass('hidden_box');
    });

	$('.top_spacer a').click(function() {
        content_hide_all.hide( 500 );
        $('#nav .yellow h4, #nav .green h4, #nav .blue h4, #nav .pink h4').removeClass('active');
        $('.grid_4_cell').removeClass('hidden_box');
    });

	Cufon.replace(['h3','h4','h5'], {
		textShadow: '1px 1px rgba(0, 0, 0, 0.05)',
   		hover: true
	});
	Cufon.replace(['#header_wrapper p.page_desc'], {
		textShadow: '1px 1px rgba(0, 0, 0, 0.3)',
   		hover: true
	});


	//****************************************//
	//	Work
	//****************************************//
	
	//psuedo loader set up
	
	$('#content_main').liveGrid();
	
	$('span.thumb').addClass('loading').children('img').hide();
	$('span.thumb').addClass('loading');

	$('div.grid_4_cell').liveLoad({
		'self' : true,
		'contentToFetch' : '.content',
		onAfter : projectLoaded
	});

	$('div.project_thumb').live('mouseover', function(){
		$(this).parent().addClass('hover');
	});
	$('div.project_thumb').live('mouseout', function(){
		$(this).parent().removeClass('hover');
	});
	
	function projectLoaded() {
		$('.grid_4_cell').removeClass('hidden_box');
		Cufon.replace(['h3'], {
			textShadow: '1px 1px rgba(0, 0, 0, 0.05)',
   			hover: true
		});
		// Reset Grid
		$('#page').liveGrid();
		// Build Tools
		$('.project_info').before(
			'<div class="project_btn">'+
				'<a class="close">Close</a>'+
			'</div>'
		);
	
	// Cycle init
		if(jQuery.fn.cycle) {
			var sld = $('.slide img');
			if (sld.length > 1) {
				$('.portrait').after(
					'<div class="slidenav_pt">'+
						'<span class="prev"><a><</a></span>'+
						'<span class="next"><a>></a></span>'+
					'</div>'
				);
				$('.landscape').after(
					'<div class="slidenav_ls">'+
						'<span class="prev"><a><</a></span>'+
						'<span class="next"><a>></a></span>'+
					'</div>'
				);
				$('.slide').cycle({ 
					fx:     'fade', 
					speed:  500, 
					timeout: 3000,
					prev: '.slidenav_pt span.prev a, .slidenav_ls span.prev a', 	
					next: '.slidenav_pt span.next a, .slidenav_ls span.next a'
				});
			}
		}
	
		// Scroll window
		if(jQuery.fn.scrollTo) {
			$(window).scrollTo('.open', 400, { offset: -10 });
		}	
	}
	
	// Project tools
	$('.project_btn a.close').live('click', function(){
		// Remove Project Detail from DOM
		$(this).parents('div.content').hide();
		// Show Project Brief and remove open state
		$('div.project_thumb:hidden').show().parent('div.grid_4_cell').removeClass('open');
		// regrid
		$('#page').delay( 2000 ).liveGrid();
	});

});

//////////////////////////////////////////
//  Psuedo Loader
/////////////////////////////////////////

var i = 0;
var int = 0; // for IE
$(window).bind('load', function() {
	var int = setInterval('loadPic(i)',0);
});

function loadPic() {
	var slides = $('.slide img').length;
	if (i >= slides) {
		clearInterval(int);
	}
	$('img:hidden').eq(0).fadeIn(500).parents().removeClass('loading');
	i++;
}


$(window).resize( function(){ 
	$('#page').liveGrid();
	$('#content_main').liveGrid({
		minCol: 2,  
		colWidth: 206,  
		colGutter: 10,
		container: '#content_main',
		item: '.grid_4_cell'
	});

});