How to show multiple dialog polyfill?

Question

I have script to open dialog polyfill :

window.modalDialog = function (url, arg, opt) {
        url = url || ''; //URL of a dialog
        arg = arg || null; //arguments to a dialog
        opt = opt || 'dialogWidth:300px;dialogHeight:200px'; //options: dialogTop;dialogLeft;dialogWidth;dialogHeight or CSS styles

        var caller = modalDialog.caller.toString();
        var dialog = document.body.appendChild(document.createElement('dialog'));
        var splitter = opt.split(",");
        dialog.setAttribute('style', splitter[0].replace(/dialog/gi, ''));
        dialog.innerHTML = '×';
        document.getElementById('dialog-body').contentWindow.dialogArguments = arg;
        document.getElementById('dialog-close').addEventListener('click', function (e) {
            e.preventDefault();
            dialog.close();
        });
        dialog = document.querySelector('dialog');
        dialogPolyfill.registerDialog(dialog);

        function addListeners() {
            document.querySelector('dialog').addEventListener('mousedown', mouseDown, false);
            window.addEventListener('mouseup', mouseUp, false);
        }

        function mouseUp()
        {
            window.removeEventListener('mousemove', divMove, true);
        }

        function mouseDown(e) {
            window.addEventListener('mousemove', divMove, true);
        }

        function divMove(e) {
            var div = document.querySelector('dialog');
            div.style.position = 'absolute';
            div.style.top = e.clientY + 'px';
            div.style.left = e.clientX + 'px';
        }

        addListeners();
        dialog.showModal();
        dialog.addEventListener('close', function () {
            var returnValue = document.getElementById('dialog-body').contentWindow.returnValue;
            document.body.removeChild(dialog);
            nextStmts[0] = nextStmts[0].replace(/(window\.)?modalDialog$.*$/g, JSON.stringify(returnValue));
            eval('{\n' + nextStmts.join('\n'));
        });
        throw 'Execution stopped until modalDialog is closed';
    };

when I call this script, dialog-body got replaced with new url instead create new dialog. How can i create multiple dialog?

EDIT

My biggest problem is that my dialogs has the same parent (caller), so in dialog polyfill js library, there's script to check if there are dialogs or not in parent document, if yes, then throw warning Failed to execute showModal on dialog: The element is already open, and therefore cannot be opened modally.

EDIT

I have created the jsfiddle, but i dont know how to call external source website from jsfiddle. https://jsfiddle.net/godofrayer/gvLpLjkq/

How to show multiple dialog polyfill?

1 Answers