/**
* Javascript addon: detailbox
* -
* jQuery is required
* -
* functions:
* - showSuccessBox(String: message [ , boolean: show close button ])
* - showWarningBox(String: message [ , boolean: show close button ])
* - showErrorBox(String: message [ , boolean: show close button ])
* - showInfoBox(String: message [ , boolean: show close button ])
* ** Note: the infobox was kept empty so you can create your own extra box.
* -
* More boxes can be added manually by adding a show<name>Box that calls
* showDetailBox(<name>, text, show close) and adding the desired design
* in detailbox.css (.detailBox_<naam>)
* -
* Design can be modified in detailbox.css
* Behaviour can be modified in detailbox.js
* -
* Patrick de Vries, 14 dec 2011
**/

function showSuccessBox(text, showClose) {
	showDetailBox("success", text, (!showClose ? false : showClose));
}

function showWarningBox(text, showClose) {
	showDetailBox("warning", text, (!showClose ? false : showClose));
}

function showErrorBox(text, showClose) {
	showDetailBox("error", text, (!showClose ? false : showClose));
}

function showInfoBox(text, showClose) {
	showDetailBox("info", text, (!showClose ? false : showClose));
}

function showDetailBox(typeBox, text, showClose) {
	if (showClose) {
		text = text + '<br /><br /><button class="closeDetailBox">Close</button>';
	}
	var detailBox = jQuery('<div>');
	detailBox.attr("class", "detailBox detailBox_" + typeBox);
	detailBox.html(text);
	detailBox.css("height", "auto");
	
	var blackBackground = jQuery('<div>');
	blackBackground.attr("class", "detailBoxBackground");
	blackBackground.css("opacity", "0");
		
	jQuery("body").prepend(detailBox).prepend(blackBackground);
	
	detailBox = jQuery(detailBox);
	blackBackground = jQuery(blackBackground);
	
	blackBackground.bind(
		"click",
		function () {
			closeDetailBox(jQuery(document).find(".detailBox:first"), jQuery(this));
		}
	);
	
	detailBox.find("button").bind(
		"click",
		function () {
			closeDetailBox(jQuery(document).find(".detailBox:first"), jQuery(document).find(".detailBoxBackground:first"));
		}
	).focus();
	
	detailBox.css("top", (detailBox.height() + 51) * -1);
	
	var newTop = (jQuery(window).height() - detailBox.height()) / 2 + jQuery(document).scrollTop()	;
	
	detailBox.animate({top: newTop}, 500);
	blackBackground.animate({opacity: 0.5}, 500);
}

function closeDetailBox(detailBox, background) {
	jQuery(detailBox).stop().animate({opacity: 0}, 500, function () {
		jQuery(this).remove();
	});
	
	jQuery(background).stop().animate({opacity: 0}, 500, function () {
		jQuery(this).remove();
	});
}

function initDetailBox(cssUri) {
	jQuery("head").append("<link rel='stylesheet' type='text/css' href='" + cssUri + "' />");
}


var cssUri = jQuery("script:last").attr("src");
initDetailBox(cssUri.substring(0, cssUri.length - 2) + "css");