$(document).ready(function () {
	if (window.location.href.indexOf("open=1") != -1) {
		disablediv($("#content"), showpanel_no_anim);
	}
	$('#panel-tab').click(function() {
		if ($('#panel').hasClass('panel-closed')) {
			disablediv($("#content"), showpanel);
		}
		else {
			hidepanel(function () {
				enablediv($("#content"));
			});
		}
	});
});

var showpanel = function () {
	$('#panel').animate({
		width: "650px"
	}, 1000);
	$('#panel').removeClass('panel-closed');
}

var showpanel_no_anim = function () {
	$('#panel').css('width', "650px");
	$('#panel').removeClass('panel-closed');
}
		
var hidepanel = function (callback) {
	$('#panel').animate({width: "44px"}, 1000, function() {
		$('#panel').addClass('panel-closed');
		callback();
	});
}

var disablediv = function (div, callback) {
	var mask_id = div.attr('id') + "-mask";
	var width = div.css('width');
	var padding_left = div.css('padding-left');
	var padding_right = div.css('padding-right');
	var height = div.css('height');
	var padding_top = div.css('padding-top'); 
	var padding_bottom = div.css('padding-bottom');
	var mask_div = $('<div class="mask" id="' + mask_id + '"></div>');
	mask_div.css('width', width).css('height', height);
	mask_div.css('padding-left', padding_left).css('padding-right', padding_right);
	mask_div.css('padding-top', padding_top).css('padding-bottom', padding_bottom);
	mask_div.fadeTo(0, 0, function () {
		div.append(mask_div);
		div.addClass("disabled");
		mask_div.fadeTo(50, 0.75, callback);
	});
}

var enablediv = function (div, callback) {
	div.children('.mask').fadeTo(50, 0, function() {
		$(this).remove();
		div.removeClass("disabled");
		if (callback) {
			callback();
		}
	});
}