demo-strict.html

<!DOCTYPE html>
<html>
<head>
    <title>showModalDialogMultiStrict polyfill demo</title>
    <meta charset="utf-8" />
    <script src="showModalDialogMultiStrict.js"></script>
</head>
<body>
    <h1>showModalDialogMultiStrict polyfill demo</h1>
    <p>This uses strict mode and is supported in all major browsers excluding Internet Explorer. It uses only yield or await functionality which Internet Explorer doesn't support.</p>
    <form action="">
        <p><input id="x" placeholder="Input number" /></p>
        <p><input id="button1" type="button" value="Show Modal Dialog using yield" /> <span id="result1"></span></p>
        <p><input id="button2" type="button" value="Show Modal Dialog using async/await" /> <span id="result2"></span></p>
        <p><input id="bt_close" type="button" value="Close dialog" /></p>
    </form>

    <hr />
    <p>Dialog received arguments: <b><span id="arg"></span></b></p>
    <script>
        x = document.getElementById('arg').innerHTML = window.dialogArguments;
        if (x) {
            window.returnValue = parseFloat(x) * parseFloat(x); // calc x^2 and return result
        }
    </script>


    <script>
        //using yield
        document.getElementById('button1').addEventListener('click', function() {
            spawn(function*() {
                var opt = "dialogWidth:800px;dialogHeight:380px";
                var ret = yield window.showModalDialog("demo-strict.html", document.getElementById("x").value, opt);
                document.getElementById('result1').innerHTML = "Returned from modal: <b>" + ret + "</b>";
            });
        });

        //using async/await
        document.getElementById('button2').addEventListener('click', async function() {
            var opt = "dialogWidth:800px;dialogHeight:380px";
            var ret = await window.showModalDialog("demo-strict.html", document.getElementById("x").value, opt);
            document.getElementById('result2').innerHTML = "Returned from modal: <b>" + ret + "</b>";
        });

        // close most recent dialog
        document.getElementById('bt_close').addEventListener('click', function() {
            window.close();
        });
    </script>
</body>
</html>