var dialogOverlayHtml = '<div class="dialogOverlay"></div>';
var dialogHtml = '<div class="dialog"><span class="close">X</span><div class="top"><div class="l"></div><div class="c"></div><div class="r"></div></div><div class="contentContainer"><div class="content"></div></div><div class="bottom"><div class="l"></div><div class="c"></div><div class="r"></div></div></div>';
var dialogLoading = '<div class="loading">Bezig met laden...</div>';

/**
 * Options:
 * ---
 * animated             Openen / sluiten met animatie
 * className            Class die wordt meegegeven aan de dialog
 * width                Breedte van de dialog
 * url                  Een url laden in de dialog
 *   data               Data die wordt meegegeven bij het ophalen van de url
 *     post             Boolean, geeft aan of er gepost moet worden, standaard wordt er een GET-request gedaan
 *   loading            Boolean, geeft aan of er een "Loading"-melding wordt weergeven bij het laden van de url
 * content              Handmatig content meegeven aan de dialog
 * callback             Callback die wordt aangeroepen zodra de dialog getoond wordt
 * ajaxSubmit           Boolean, of het form in de dialog via ajax verzonden moet worden
 *   ajaxFormCallback   Callback die wordt aangeroepen als er een resultaat is van het via ajax gepostte formulier
 * closeCallback        Callback die wordt aangeroepen bij het sluiten van de dialog
 *
 * @param options
 */
function showDialog(options) {

    if (typeof(options) == 'undefined') {
        options = {};
    }
    
    $('body > div.dialogOverlay').remove();
    $('body > div.dialog').remove();

    var dialogOverlay = $(dialogOverlayHtml);
    var dialog = $(dialogHtml);

    var animated = (typeof(options.animated) == 'undefined' || options.animated);

    var closeDialog = function() {

        $(document).unbind('keydown');

        if (animated) {
            dialog.fadeOut(200, function() {
                dialogOverlay.fadeOut(150, function() {
                    dialogOverlay.remove();
                    dialog.remove();
                });
            });
        } else {
            dialogOverlay.remove();
            dialog.remove();
        }
    };

    dialogOverlay.click(function() {
        closeDialog();
    });

    $('> span.close', dialog).click(function() {
        if (options && typeof(options.closeCallback) != 'undefined') {
            options.closeCallback(dialog);
        }

        closeDialog();
    });

    var content = '';
    var dialogContent = $('div.contentContainer div.content', dialog);

    var ajaxSubmit;
    if (typeof(options.ajaxSubmit) == 'function') {
        ajaxSubmit = true;
    } else if (typeof(options.ajaxSubmit) != 'undefined') {
        ajaxSubmit = options.ajaxSubmit;
    }
    
    if (typeof(ajaxSubmit) != 'undefined' && ajaxSubmit) {
    	
    	$(dialogContent).delegate("form", "submit", function(e) {

            if (typeof(options.ajaxSubmit) == 'function' && !options.ajaxSubmit(dialogContent)) {
                return true;
            }

            //$('form', dialogContent).live("submit", function(e) {
        	var canPost = true;
        	if (typeof(options.canPost) == 'function') {
        		canPost = options.canPost(dialog);
        	} else if (typeof(options.canPost) != 'undefined') {
        		canPost = options.canPost;
        	}
        	
        	if (!canPost) {
        		return false;
        	}
        	
            var form = $(this);

            var action = form.attr('action');
            var method = 'POST';
            if (typeof(form.attr('method')) && form.attr('method') != 'POST') {
                method = form.attr('method');
            }

            var formData = form.serialize();

            setContent(dialogLoading, true);

            $.ajax({
                url: action,
                type: method,
                data: formData,
                success: function(data) {
                    if ($.isJSON(data)) {
                        data = eval('(' + data + ')');
                    }

                    if (typeof(options.ajaxFormCallback) == 'function') {
                        options.ajaxFormCallback(data, function(content) {
                            setContent(content, true);
                        }, function() {
                            closeDialog()
                        });
                    } else {
                        closeDialog();
                    }
                }
            });

            e.preventDefault();
        });
    }
    
    function setContent(data, ignoreOptions) {

        if (typeof(ignoreOptions) == 'undefined') {
            ignoreOptions = false;
        }

        dialogContent.html(data);

        $('.closeDialog', dialog).click(function() {
            closeDialog();
        });

        if (!ignoreOptions && typeof(options.className) != 'undefined') {
            dialogContent.addClass(options.className);
        }
        
        bindTooltips();

        if (!ignoreOptions && typeof(options.callback) == 'function') {
            options.callback(data, dialog, setContent);
        }

        if (typeof(ie7DialogFix) == 'function') {
            setTimeout(function() {
                ie7DialogFix(dialogContent);
            }, 200);
        }

        runElementMonitoring(dialogContent);
    }

    if (typeof(options.width) != 'undefined') {
        dialog.width(parseInt(options.width));
    }

    if (typeof(options.url) != 'undefined') {

        var ajaxData = {};
        
        if(typeof(options.data) == "function") {
        	ajaxData = options.data();
        } else if (typeof(options.data) != 'undefined') {
        	ajaxData = options.data;
        }

        var method = 'get';
        if (typeof(options.post) != 'undefined' && options.post) {
            method = 'POST';
        }

        $.ajax({
        	type: method,
            url: options.url,
            data: ajaxData,
            success: function(data) {
            	if ($.isJSON(data)) {
                    data = eval('(' + data + ')');
                }
                setContent(data);
            }
        });

        if (typeof(options.loading) == 'undefined' || options.loading) {
            content = dialogLoading;
        }

    } else if (typeof(options.content) != 'undefined') {
        content = options.content;
    } else {
        return;
    }

    $('body').append(dialogOverlay);
    $('body').append(dialog);

    setContent(content);

    repositionDialog(dialog);

    if (typeof(ie7DialogFix) != 'function' && animated) {

        dialogOverlay.css('display', 'none');
        dialog.css('display', 'none');

        dialogOverlay.fadeIn(150, function() {
            dialog.fadeIn(200);

            $(document).keydown(function(e) {
                var code = (e.keyCode ? e.keyCode : e.which);
                if(code == 27) { // Escape
                    closeDialog();
                    e.preventDefault();
                }
            });
        });
    } else {

        dialogOverlay.css('display', 'block');
        dialog.css('display', 'block');

        $(document).keydown(function(e) {
            var code = (e.keyCode ? e.keyCode : e.which);
            if(code == 27) { // Escape
                closeDialog();
                e.preventDefault();
            }
        });
    }
}

function repositionDialog(dialog) {
    
    var marginLeft = ($('body').width() / 2 - dialog.outerWidth() / 2);
    if (marginLeft < 0) {
        marginLeft = 0;
    }

    dialog.css('margin-left', marginLeft + 'px');
    dialog.css('top', $(window).scrollTop() + 'px');
}