var oFocus;
var oConfirmFunction;
(function($) {
	$(function() { //on DOM ready
		//dynamically create a dialog div for modal messages. Then make this div a jQuery dialog.
		var oDialog=$('<div id="divMessageDialog" title="Message" style="display:none; "><p style="text-align:left; "><span id="spanMessageDialogIcon" style="float:left; margin:0 7px 20px 0;" class="ui-icon"></span><span id="spMessageDialogContents"></span></p></div>')
			.dialog({
				bgiframe: true,
				autoOpen: false,
				width: 500,
				resizeable: false,
				modal: true,
				overlay: {
					backgroundColor: '#000',
					opacity: 0.5
				},
				open: function() {
					//this corrects the unnecessary scrollbars in IE8
					$('body').css('overflow','hidden');$('.ui-widget-overlay').css('width','100%');
					$('.ui-dialog-buttonpane > button:last').focus();
				},
				buttons: {
					'OK': function() {
						$(this).dialog('close');
						//if the oFocus variable is set to an element, shift focus to that element
						if(oFocus) {
							try{
								oFocus.focus();
							}
							catch(e){}
							oFocus=null;
						}
					}
				},
				//this corrects the unnecessary scrollbars in IE8
				close:function() {
					if(oFocus) oFocus.focus();
					$('body').css('overflow','auto');
				}
			});
		//dynamically create a dialog div for confirmation dialogs. Then make this div a jQuery dialog.
		var oConfirmDialog=$('<div id="divConfirmDialog" title="Confirm Action" style="display:none; "><p style="text-align:left; "><span id="spanConfirmDialogIcon" style="float:left; margin:0 7px 20px 0;" class="ui-icon ui-icon-alert"></span><span id="spConfirmDialogContents"></span></p></div>')
			.dialog({
				bgiframe: true,
				autoOpen: false,
				width: 500,
				resizeable: false,
				modal: true,
				overlay: {
					backgroundColor: '#000',
					opacity: 0.5
				},
				buttons: {
					'No': function() {
						$(this).dialog('close');
					},
					'Yes': function() {
						$(this).dialog('close');
						//if oConfirmFunction is set, this is what we want to run if the user clicks OK
						if(oConfirmFunction) oConfirmFunction();
					}
				}
			});
	});
})(jQuery);

// shows a modal message. 
// sMessage=the message to show. 
// sType can be "Info" or "Alert" This just decides which icon is shown.
function showMessage(sMessage,sType,sTitle) {
	if(sType!="Alert") sType="Info";
	if(sType=="Alert") $("#spanMessageDialogIcon").addClass("ui-icon-alert").removeClass("ui-icon-info");
	else $("#spanMessageDialogIcon").removeClass("ui-icon-alert").addClass("ui-icon-info");
	$("#spMessageDialogContents").html(sMessage);
	if(!sTitle) sTitle="Message";
	$("#divMessageDialog").dialog("option","title",sTitle).dialog("open");
}

// shows a modal message. 
// sMessage=the message to show. 
// oCallback is the function to call if confirmed
function showConfirm(sMessage,oCallback) {
	oConfirmFunction=oCallback;
	$("#spConfirmDialogContents").html(sMessage);
	$("#divConfirmDialog").dialog("open");
}
