$(document).ready(function() {
	
	$('#panel-info').draggable({
		handle: '.ui-widget-header'
	}).resizable({
		minWidth: 250,
		maxWidth: 400,
		handles: 'n, e, s, w',
		resize: function(event, ui) { 
			var panelHeight = ui.size.height;
			var boxHeight = $(this).children('.panel-content').height() + 20;
			if (panelHeight < boxHeight) {
				$(this).height(boxHeight);
			}
		}
	});
	
	$(".panel-content").sortable({
		axis: 'y',
		containment: '.ui-widget-content',
		opacity: 0.8
	});

	$(".box-header-left").live('click', function(){
		$(this).next().slideToggle("normal");
	});

	
	var panelWidth;
	var panelHeight;
	
	$(".panel-arrow").toggle(
		function() {
			var panel = $(this).parent().parent();
			panel.resizable('disable');
			panelWidth = panel.width();
			panelHeight	= panel.height();
			
			$(this).addClass("selected");
			panel.find('.box-icon').show();
			panel.find('.box-full').hide();			
			panel.css({
				width: '33px',
				height: ''
			});
		},
		function() {
			var panel = $(this).parent().parent();
			panel.resizable('enable');
			$(this).removeClass("selected");
			panel.find('.box-icon').removeClass('selected').hide();
			panel.find('.box-full').css({
				width: '',
				position: 'static'
			}).show();
			panel.css({
				width: panelWidth+'px',
				height: panelHeight+'px'
			});			
		}
	);
	
	$('.box-icon').live('click', function(){
		$('.box-full').css({
			width: '',
			position: 'static'
		}).hide();
		
		if (! $(this).is('.selected')) {
			$('.box-icon').removeClass('selected');
			$(this).addClass('selected');
			var box = $(this).prev();
			box.css({
				width: panelWidth,
				position: 'absolute',
				left: '-' + panelWidth + 'px'
			}).show();
		} else {
			$('.box-icon').removeClass('selected');
		}
	});

	
});