var callback = null;
var setFocus = '';
var allowUserClose = true;

function modalAlert(message, options, focusField, callbackFunction, allowClose)
{
    setFocus = focusField;

    modal('alertBox', callbackFunction, allowClose);

    if( options == null ) options = 0;

    $('#dialog #message').html(message);

    //display button options
    switch(options)
    {
        case 0:
            $('#dialog #ok').show();
            $('#dialog #yes').hide();
            $('#dialog #no').hide();
            $('#dialog #cancel').hide();
            $('#dialog #ok').focus();
            break;
        case 1:
            $('#dialog #ok').hide();
            $('#dialog #yes').show();
            $('#dialog #no').show();
            $('#dialog #cancel').hide();
            $('#dialog #no').focus();
            break;
        case 2:
            $('#dialog #ok').show();
            $('#dialog #yes').hide();
            $('#dialog #no').hide();
            $('#dialog #cancel').show();
            $('#dialog #cancel').focus();
            break;
    }
}

function closeAlert(choice)
{
    closeModal();        
    if( setFocus != null ) setFocus.focus();
}

function modal(templateID, callbackFunction, allowClose, width)
{
    if( allowClose == null)
        allowUserClose = true;
    else
        allowUserClose = allowClose;

    if( width == null ) width = 440;

    $('#dialog').css('width',width+'px');
    
    callback = callbackFunction;

    //load template html
    $('#dialog').html($('#'+templateID).html());

    //Get the screen height and width
    var maskHeight = $(document).height();
    var maskWidth = $(window).width();

    //Set heigth and width to mask to fill up the whole screen
    $('#mask').css({'width':maskWidth,'height':maskHeight});

    //transition effect
    $('#mask').fadeTo(0, 0.8);

    //Get the window height and width
    var winH = $(window).height();
    var winW = $(window).width();

    //Set the popup window to center
    $('#dialog').css('top',  winH/2-$('#dialog').height()/2+$(document).scrollTop());
    $('#dialog').css('left', winW/2-$('#dialog').width()/2);

    //transition effect
    $('#dialog').fadeIn(50);
}

function updateModal()
{
    //Get the window height and width
    var winH = $(window).height();
    var winW = $(window).width();

    //Set the popup window to center
    var yPos = winH/2-$('#dialog').height()/2+$(document).scrollTop();
    $('#dialog').animate({top:  yPos+"px"}, {queue: false, duration: 350});

    $('#dialog').css('left', winW/2-$('#dialog').width()/2);
}

function closeModal(data)
{
    $('#mask, #dialog').hide();
    if( callback != null )
        callback(data);

    return false;
}

/* BIND EVENTS */
$(window).scroll(updateModal);

$(document).ready(function()
{	//if mask is clicked
	$('#mask').click(function () {
        if( allowUserClose )
        {
            $(this).hide();
            $('#dialog').hide();
        }
	});

    $(document).bind('keypress', function(e)
    {        
        if( e.keyCode == 27 )
        {
            if( allowUserClose )
            {
                $('#mask').hide();
                $('#dialog').hide();
            }
        }
    });
});