$().ready(function()
{
	onResize();
	set_flags()
	set_listeners();
	
});


function set_flags()
{
	var the_clear ='<div style="clear:both"></div>';
	var flag = '<div class="flag toggle_flag" class="name"><div class="text">view project</div><div class="cap"></div></div>'
	$('.item_right').each(function(index,target){
		$(target).append(flag);
	});
	
	$('.item').each(function(index,target){
		$(target).append(the_clear);
	});
}

function set_listeners()
{
	$(window).bind('resize',onResize);
	
	$('.item_left').each(function(i,target){
		$(target).click(toggle_additonal);
	});
	$('.toggle_flag').each(function(i,target){
		$(target).click(toggle_additonal);
		$(target).hover(toggle_hover,toggle_hover);
		
	});
}


function toggle_hover(e)
{
	console.log('hover');
	var the_parent = $(e.target).hasClass('text')||$(e.target).hasClass('cap')||$(e.target).hasClass('item_left') ? $(e.target).parent() : $(e.target);
	
	the_parent.hasClass('hover') ? the_parent.removeClass('hover') :the_parent.addClass('hover');
}
function toggle_additonal(e)
{
	var the_parent = $(e.target).hasClass('text') ? $(e.target).parent().parent().parent() : $(e.target).parent().parent();	
	
	var to_toggle = $(the_parent.find('.additional'));
	
	if(!to_toggle.is(':animated'))
	{
		the_parent.find('.text').html(the_parent.find('.text').html()==='view project' ? 'view less' : 'view project'); 
		to_toggle.animate({'height':'toggle'},'slow');
	}
	
}

function onResize(e)
{
	$('#left').height($(window).height());
}