$(document).ready(function() {
	
	// setup
	
	$('#portfolio-items .graphic, .view .sample').addClass('preview-link');
	$('.view').append('<li class="close-preview"><a href="#" title="Close">Close</a></li>');
	$('.close-preview').hide();
	$('.region').addClass('unselected');
	
	$('.role').prepend('<li class="myrole">My Role:</li>');
	
	// hover
	$('.preview-link a')._hover(function(){
		$(this).parents('.item:eq(0)').addClass('hovered');
	},function(){
		$(this).parents('.item:eq(0)').removeClass('hovered');
	});
	
	// opening a new Extended Content
	$('.preview-link').click(function(){
	
	
		// use anchors for setting position on close
		var selectedItem = $(this).parents('.region:eq(0)').attr('id');
		$(".close-preview a").attr('href', '#'+selectedItem);
		
		
		// first take care of any previously opened content
		$('.region').removeClass('.selected').addClass('unselected');
		$('.preview-link').show();
		$('.close-preview').hide();
		$(this).parents('.region:eq(0)').removeClass('unselected').removeClass('viewed').find('.view .sample').hide();
		$('.unselected').hide();
		$('.extended').slideUp(150);
		$('.graphic a').show();
		
		// now we open new content
		$(this).parents('.region:eq(0)').addClass('selected');
		$(this).parents('.item:eq(0)').find('.graphic a').hide();
		$(this).parents('.item:eq(0)').find('.extended').fadeIn(800);
		$(this).parents('.item:eq(0)').find('.close-preview').show().fadeTo(0,0).fadeTo(400,0).fadeTo(400,1);
	});
	
	// closing an already-open Extended Content
	$('.close-preview').click(function(){
		$('.unselected').show();
		$(this).parents('.region:eq(0)').addClass('unselected').addClass('viewed');
		$(this).parents('.region:eq(0)').removeClass('selected');
		$(this).parents('.item:eq(0)').find('.extended').hide();
		$(this).parents('.item:eq(0)').find('.graphic a').show().fadeTo(0,.4);
		$(this).parents('.item:eq(0)').find('.preview-link').fadeTo(0,0).show().fadeTo(200,0).fadeTo(200,1);
		$('.close-preview').hide();
		
		// add .extended to ().click once I've wrapped it in a link
		// link wrapped req. to set position on close
		
	});
	
});

