$(function() {

	b.grid();
	b.galleries();

	if($('#projects').length > 0) {
		b.tooltip();
		b.projects();
	}
		
	$('#project-intro a.more, #exhibition-intro a.more').click(function() {
		$('#project-intro, #exhibition-intro').addClass('hide');
		$('#project-text, #exhibition-text').removeClass('hide');
		return false;
	});

	$('#project-text a.less, #exhibition-text a.less').click(function() {
		$('#project-intro, #exhibition-intro').removeClass('hide');
		$('#project-text, #exhibition-text').addClass('hide');
		return false;
	});
						
	$('a').each(function() {
		var href = $(this).attr('href');
		if(href.match('^\/') || href.match(window.location.hostname)) return true;
		$(this).attr('target', '_blank');
	});

});


var b = {

	tooltip : function() {
	
		if($('#projects').hasClass('text')) return false;
	
		var tooltip = $('<div id="tooltip"></div>');
		$('body').append(tooltip);
	
		$(document).mousemove(function(event) {
			tooltip.css({
				'top' : event.pageY + 5,
				'left' : event.pageX + 10
			});			
		});
	
		$('#projects a')
			.mouseenter(function() {
				var html = $(this).find('.meta').html();
				tooltip.html(html);
				if(tooltip.width() > 300) tooltip.css('width', 300);
				tooltip.show();			
			})
			.mouseleave(function() {
				tooltip.hide();						
				tooltip.css('width', 'auto');
			});
	
	},

	projects : function() {		

		$(document).click(function() {
			$('#filter-overlay').hide();
		});

		var overlay = $('<div id="filter-overlay"></div>');
		$('body').append(overlay);

		$('#filter, #filter-overlay').click(function(event) {
			event.stopPropagation();
		});
		
		$('#filter dt').click(function(event) {
			
			var parent = $(this).parent();
			var dd     = parent.find('dd');
			var pos    = $(this).offset();
			var right  = pos.left + $(this).width();

			overlay.html(dd.html());
						
			var left = (right - overlay.width()) + 30;
						
			overlay.css({
				'top' : pos.top + 20,
				'left' : left
			});
			overlay.show();
									
		});

		this.projectloader();
						
	},

	projectloader : function() {
	
		$('#projects li img').each(function() {

			var img = $(this);
			img.css({'display' : 'block', 'opacity' : 0});
			
			b.preload(img.attr('src'), function() {
				img.css('opacity', 1);
			});

		});
	
	},

	grid : function() {

		$('#grid li').not('.placeholder').each(function(i, element) {
				
			var id   = $(element).attr('rel');
			var furl = $(element).attr('data');
			
			if(furl == '') return true;
			
			var img  = furl;
			var blur = furl.replace('.jpg', '.blur.jpg');
	
			if(id == 'the-office') $(element).addClass('skip');

			if($.inArray(id, ['built', 'project-list', 'news', 'contact']) > -1) {
				$(element).addClass('skip');
			} else {
				b.preload(img, function() {
					$(element)
						.find('a')
						.css('opacity', 0)
						.append('<img class="sharp" src="' + img + '" width="128" height="128" /><img class="blur" src="' + blur + '" width="128" height="128" />')
						.animate({'opacity' : 1}, 500);
				});
			}
			
			b.preload(img);				
			
			$(this).hover(
				function() {
					$(this).find('img.blur').fadeOut(200);
				},
				function() {
					$(this).find('img.blur').fadeIn(200);						
				}
			);	
							
		});
			
	},

	galleries : function() {
			
		$('.gallery li').css('opacity', .4);
		$('.gallery li:first-child').addClass('active').css('opacity', 1);

		// add keyboard shortcuts
		if($('.gallery').length == 1) {

			$(document).keydown(function(event) {
				switch(event.keyCode) {
					case 37: // left arrow
						event.preventDefault();
						var el = $('.gallery .wrapper li.active').prev();
						if(el.length == 0) var el = $('.gallery .wrapper li').last();
						el.trigger('click')
						break;
					case 39: // right arrow
						event.preventDefault();
						var el = $('.gallery .wrapper li.active').next();
						if(el.length == 0) var el = $('.gallery .wrapper li').first();
						el.trigger('click');
						break;
				}			
			});
		
		}


		$('.gallery').each(function() {
	
			var gallery = $(this);

			gallery.find('img').each(function() {
				var img = $(this);
				img.css({'opacity' : 0, 'display' : 'block'});
				b.preload(img.attr('src'), function() {
					img.animate({'opacity' : 1}, 500);
				});
			});
	
			gallery.find('li').click(function() {

				var rel = $(this).attr('rel');
				gallery.find('li.active').removeClass('active').css('opacity', .4);
				gallery.find('li[rel=' + rel + ']').addClass('active').css('opacity', 1);
		
				var element = gallery.find('.sledge li[rel=' + rel + ']');

				var lis = element.prevAll();
				var width = 0;
				
				$.each(lis, function() {
					width += ($(this).width() + 8);
				});
						
				gallery.find('.sledge').animate({'margin-left' : -width}, 350);	
								
			});
	
		});
	
	},

	preload : function(src, onload) {
		
		var img = $('<img src="' + src + '">')
		if($.browser.opera) img.attr('src', src);
		
		img.load(function() {
			if(onload) onload.call(this, $(this));
		});
	}

};