//javascript document
(function ($) {
	$.event.special.load = {
		add: function (hollaback) {
			if ( this.nodeType === 1 && this.tagName.toLowerCase() === 'img' && this.src !== '' ) {
				// Image is already complete, fire the hollaback (fixes browser issues were cached
				// images isn't triggering the load event)
				if ( this.complete || this.readyState === 4 ) {
					hollaback.handler.apply(this);
				}

				// Check if data URI images is supported, fire 'error' event if not
				else if ( this.readyState === 'uninitialized' && this.src.indexOf('data:') === 0 ) {
					$(this).trigger('error');
				}
				
				else {
					$(this).bind('load', hollaback.handler);
				}
			}
		}
	};
}(jQuery));
jQuery(document).ready(function($) {		   
	var projectItems = $('.image').not('.image.moto');	   
		//alert(projectlistitems.length + ' elements!'); 
	var num_rows = 2;
	var num_elements = projectItems.length;  
	var num_in_each = Math.floor(num_elements / 2);
	var $images = $('.image').not('.image.moto');
				var index = 0;
				var num_left_over_items = num_elements % 2; //find leftovers 
				
				do {
					
					$('<div>',{'class':'container'})
					 
						.append($images.slice(index, index+num_in_each+num_left_over_items))
						.appendTo('#inner');
					//a hack to add any leftovers into the first list	 
					index += num_in_each+num_left_over_items;
					
					if(num_left_over_items){
					// only use leftovers once. 
					num_left_over_items = 0;
				  }
					
				} while (index < $images.length);
				
				//	increment container class by one
				$('.container').attr("class", function (arr) {
					return "container" + arr;
				});
				
				
				//last image in container
				 
				$('.image').each(function() {
        			$(this).width($(this).find('a > img').width());
					//alert($(this).width());
    			});
				$('.image img').css({'position' : 'absolute', 'bottom' : '0'});
				
				 
});
jQuery(document).ready(function($) {
	//	give each container the width of its childrens total width
	$('.image').each(function() {
        			$(this).width($(this).find('a > img').width());
					//alert($(this).width());
    			});
				$('.image img').css({'position' : 'absolute', 'bottom' : '0'});
				
				// find the width of title div children, add it, and assign the total back to the parent div to override the css width 
				$('.image .title').each(function() {
					$(this).width($(this).find('div.description').width() + 90 + $(this).find('div.category').width());
				   
				}); 
				
				var lastImageW1 = $('.container1 .image:last-child').width();
				var lastImageW2 = $('.container2 .image:last-child').width();
				 
				var lastImageTitleW1 = $('.container1 .image:last-child .title').width();
				var lastImageTitleW2 = $('.container2 .image:last-child .title').width();
				var lastImageTitleW3 = $('.container3 .image:last-child .title').width();
				
				if (lastImageTitleW1 > lastImageW1) {
					//alert('hello');
					$('.container1 .image:last-child').width(function() {
						$(this).width(lastImageTitleW1);
					});
				}
				if (lastImageTitleW2 > lastImageW2) {
					//alert('hello');
					$('.container2 .image:last-child').width(function() {
						$(this).width(lastImageTitleW2);
					});
				}
				
				
	var width0 = 0;
	$('.container0 .image').each(function() {
	 width0 += $(this).outerWidth(true);
	});
	$('.container0').css('width', width0);
	
	var width1 = 0;
	$('#inner .container1 .image').each(function() {
	 width1 += $(this).outerWidth(true);
	});
	$('.container1').css('width', width1);
	
	var width2 = 0;
	$('#inner .container2 .image').each(function() {
	 width2 += $(this).outerWidth(true);
	});
	$('.container2').css('width', width2);
	var width3 = 0;
	$('#inner .container3 .image').each(function() {
	 width3 += $(this).outerWidth(true);
	});
	$('.container3').css('width', width3);
	
	//	give inner div the width of the longest container
	$('#inner').width(Math.max(width0, width1, width2, width3));
	//alert(innerwidth);
	
	//	find the longest container and give its children a class of scroll-interval
	var cw = 0, widest;
		$(".container0, .container1, .container2, .container3").width(function(i, w) { 
				if(w > cw) {
					widest = this; 
					cw = w;
					} return w; 
					});
	$(widest).find('.image').addClass('scroll-interval');
	
	$('.image').hover(function(){
				$(this).find('.title').addClass('visible');
				$(this).find('.overlay').addClass('block').css('cursor','pointer');
				},
				function(){
				$(this).find('.title').removeClass('visible');
				$(this).find('.overlay').removeClass('block');
			});
	
	

$(window).resize();
});
/**************DROPDOWN MENU / SELECT PROJECT*************************/
jQuery(document).ready(function($){
	var $sfEls = $('#project_sort li ul li');
	for (i=0; i<$sfEls.length; i++) {
		$('ul#project_sort').mouseover(function(i) {
			$(this).find('li:first').addClass('bg_color').find('a.trigger').css('color', '#fff');
			$(this).find('ul li:first').css('padding-top', '10px');
		});
		}
		$('ul#project_sort').mouseout(function() {
			$(this).find('li:first').removeClass('bg_color').find('a.trigger').css('color', '#fff');
		});
		
		$('ul#project_sort li ul li a').click(function() {
			$('ul#project_sort li ul li a').removeClass('selected');
			$(this).addClass('selected');
			//$('.image.building').animate({ opacity: 0 });
		});
		
		var buildings = $(".category:contains('BUILDING')");
		var buildingsParent = buildings.parent();
		var buildingsTopParent = buildingsParent.parent();
		var buildingsLink = $("ul#project_sort li ul li a:contains('BUILDINGS')");
	
		var interiors = $(".category:contains('INTERIORS')");
		var interiorsParent = interiors.parent();
		var interiorsTopParent = interiorsParent.parent();
		var interiorsLink = $("ul#project_sort li ul li a:contains('INTERIORS')");
		
		var competitions = $(".category:contains('COMPETITION')");
		var competitionsParent = competitions.parent();
		var competitionsTopParent = competitionsParent.parent();
		var competitionsLink = $("ul#project_sort li ul li a:contains('COMPETITIONS')");
		
		var lectures = $(".category:contains('LECTURES')");
		var lecturesParent = lectures.parent();
		var lecturesTopParent = lecturesParent.parent();
		var lecturesLink = $("ul#project_sort li ul li a:contains('LECTURES')");
		
		var allLink = $("ul#project_sort li ul li a:contains('ALL')");

 		buildingsLink.click(function() {
		buildingsTopParent.animate({ opacity: 1 }, 'medium');
		$('.image').not('.image.moto').not(buildingsTopParent).animate({ opacity: 0 }, 'fast');
			 });
		interiorsLink.click(function() {
		interiorsTopParent.animate({ opacity: 1 }, 'medium');						 
		$('.image').not('.image.moto').not(interiorsTopParent).animate({ opacity: 0 }, 'fast');
			 }); 
		competitionsLink.click(function() {
		competitionsTopParent.animate({ opacity: 1 }, 'medium');						 
		$('.image').not('.image.moto').not(competitionsTopParent).animate({ opacity: 0 }, 'fast');
			 });
		lecturesLink.click(function() {
		lecturesTopParent.animate({ opacity: 1 }, 'medium');						 
		$('.image').not('.image.moto').not(lecturesTopParent).animate({ opacity: 0 }, 'fast');
			 });
		allLink.click(function() {
		$('.image').not('.image.moto').animate({ opacity: 1 }, 'fast');
			 });
		
 });