//Globals
	url = window.location.href;
	load = false;
	
	//Add 'selected' class to current tab and show projects
	function selectNav(load) {
		$('#project-nav').unbind('click', selectNav);
		$('#thumbnails a').click(function(){ return false });
		//Check if clicked tab is already visible
		var $parent = $(this).parents('li:first');
		if ($parent.hasClass('selected')) {
			$('#project-nav a').bind('click', selectNav);
			return false;
		} else {
			  $(this)
			    .parents('ul:first') 
			      .find('li') 
			        .removeClass('selected') 
			      .end() 
			    .end() 
			    .parents('li:first')
			    .addClass('selected');
			    
			    //get hash of this tab
	    		var $class = $(this).attr("href");
				$class = $class.substring(1);
				
				//hide all projects then display ones with same hash as tab, unless 'all'
				if ($('div.project').is(':visible')) {
					$('div#projects > div.project:visible').fadeOut(1000, function() {
						$('div.' + $class).fadeIn(1000, function() {
							$('#project-nav a').bind('click', selectNav);
						});
						;
					});
				} else  {
					$('div.' + $class).show();
					;
					$('#project-nav a').bind('click', selectNav);
				}
				
				$('select option:selected').attr('selected', 'false');
				$('select').val('none');
				
				return false;
    	}
	}

	//Find the 'a' element that has the same hash
	function trigger(data) {
	  var el = $('#project-nav').find('a[href="#' + data + '"]').get(0);
		  selectNav.call(el);
	}
	
	//Filter all selected category div's by selected tag
	function filter(tag, load) {
		$('#project-nav ul li').removeClass('selected');
		$('li#filters').addClass('selected'); 
		$('li#filters select').selectOptions(tag);
		var $divs = $('div#projects > div.project');
		
		function init() {
			$divs.each(function () {
				var exists = $(this).children().find('li.' + tag);	
				if (exists.length > 0 && load == false) {
					$(this).fadeIn(1000);
				} else if (exists.length > 0 && load == true) {
					$(this).show();
				} 
			});
		}
		
		if (tag == 'none') {
			$divs.fadeIn(1000);
			;
		} else if ($('div.project').is(':visible')) { 
			$('div#projects > div.project:visible').fadeOut(1000, function() { 
				init();
				;
			});
		} else if (load == true) {
			init();
			;
		}
	}

	function createCookie(name,value,days) {
		if (days)
		{
			var date = new Date();
			date.setTime(date.getTime()+(days*24*60*60*1000));
			var expires = "; expires="+date.toGMTString();
		}
		else var expires = "";
		document.cookie = name+"="+value+expires+"; path=/";
	}
	
	function readCookie(name) {
		var nameEQ = name + "=";
		var ca = document.cookie.split(';');
		for(var i=0;i < ca.length;i++)
		{
			var c = ca[i];
			while (c.charAt(0)==' ') c = c.substring(1,c.length);
			if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length,c.length);
		}
		return null;
	}
	
	function setLink(tag) {
		var link = 'http://www.ultravioletdesign.co.uk/';
	
		
	}

$(document).ready(function() {


	//Add selected class to first tab on page load	
	$('#project-nav li:first').addClass('selected');	

		
	//Bind 'selectNav' function to tab click
	$('#project-nav a').bind('click', selectNav);
	
	if (window.location.href.search(/work\//) > -1) {
		tag = url.split(/work\//);
		load = true;
		if (tag[1] == 'webdesign' || tag[1] == 'webapplications' || tag[1] == 'flash') {
			$('div#projects > div.project').hide();
			trigger(tag[1]);
		} else {
			$('div#projects > div.project').hide();
			filter(tag[1], load);
		}
	} else {
  		$('div#projects > div.project').hide();
  		$('div.featured').show();
  	}
	
	//Bind the filter function to dropdown options
	$('select').change(function() {
		var tag;
		$("select option:selected").each(function() {
			tag = $(this).val();
			load = false;
			filter(tag, load);
		});
	});
	
	//Bind the filter function to tag links
	$('.tags li a').click(function(){
		var tag = $(this).parents('li:first').attr('class');
		load = false
		filter(tag, load);
		return false;
	});	
	
});