(function($){
$(function() {
	
	$menu = $(".menu");
	$center = $(".center");
	
	// ie those things to soon, so set 1 time the height
	$(".item").height(200);
	$(".item").width(310);
	
	// reset blocks
	masonry();
	
	// Menu filter system
	$(".menuitem").click(function() {
				
		$this = $(this);
		var id = $this.attr("id");
				
		if($this.hasClass("active"))  // deactivate
		{
			// do nothing when showall is activated
			if(id == "showall")
			{
	//			$(".menuitem").removeClass("active");
	//			$(".content .item").hide();
			}
			else
			{
				// hide content items
				$(".content .item.filter_"+id).hide();
				
				// deactivate button
				$this.removeClass("active");
				
				// 
				if($(".menuitem.active").length == 0)
				{
					$(".menuitem#showall").addClass("active");
					$(".content .item").show();
				}
			}
			
		}
		else // activate 
		{
			if(id == "showall")
			{
				$(".menuitem").removeClass("active");
				$(".content .item").not(".active").show();
			}
			else
			{
				// hide all
				if($(".menuitem#showall").hasClass("active"))
				{
					$(".content .item").hide();
				}
				
				// activate content item
				$(".content .item.filter_"+id).not(".active").show();
				
				// deactivate showall button
				$(".menuitem#showall").removeClass("active");	
			
			}
			
			// activate button
			$this.addClass("active");
		}
		// reset blocks
		masonry();
	});
	
	
	$(".content .item a").click(function(e)
	{
		// do not open the image
		e.preventDefault();
		
		var $link = $(this);
		var $item = $link.parent();
		
		// reset previous
	//	$(".active").removeClass("active");
		$(".content .item.detail").click();
		
		// set active (so hide)
		$item.addClass("active");
		
		// get the url
		var url = $link.attr("href");
		
		// make new div
		var div = $('<div></div>')
			.hide()
			.css("position", "absolute")
			.attr("class", $item.attr("class"))
			.removeClass("active")
			.addClass("detail");
		
		// load new image
		var img = $('<img src="'+url+'" class="image_high">').load(function() 
		{
			$item.hide()
			$(this).parent().show();
			masonry();
		});
		
		// insert div in page
		div.insertAfter($item);
		
		// add image and description to new die
		div.append($(".description",$item).clone());
		div.append($(".meta_info",$item).clone());
		div.prepend(img);
		
		return false;
	});
	
	$(".content .item.detail").live("click", function()
	{
		$(".content .item.active").removeClass("active").show();
		$(this).remove();
		masonry();
	});
	
	$(window).resize(function()
	{	
		var offset = $center.offset();
		$menu.css("left", offset.left+20);
	});
	$(window).resize();
});

function masonry() {
	$(".items").masonry({itemSelector:'.item:visible'});
}
})(jQuery);