index.html

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>UONET+ Request Signer by Wulkanowy</title>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/forge/0.7.6/forge.min.js" integrity="sha256-buw1I7+E0zKU1A6C+nlpXPJIEuA59qCBHeX4Ktd3cLI=" crossorigin="anonymous"></script>
    <script src="js/signer.js" defer></script>

    <script src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.39.2/codemirror.min.js" integrity="sha256-uRIJ6Wfou5cTtmcCvQNA9lvsYl8sUbZXxnfG+P79ssY=" crossorigin="anonymous"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.39.2/mode/javascript/javascript.min.js" integrity="sha256-soPk2bgFhLwixxuyUzaWVadUMcVwWNE5JZwYdQhL4Xk=" crossorigin="anonymous"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jsonlint/1.6.0/jsonlint.min.js" integrity="sha256-yWZBgNxWVjnXu4Tut5/J0MAvczYc2U3SuK0svKSMaW4=" crossorigin="anonymous"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.39.2/addon/lint/lint.js" integrity="sha256-2Juixn3iQDBB1tHwXcjJ+X6d4ihPItrLbEXcPU+3Xjw=" crossorigin="anonymous"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.39.2/addon/lint/json-lint.min.js" integrity="sha256-mWRA+eRb2A3v8WLC4QSEVKYYgWuy1jYrLoi4+tbWrnU=" crossorigin="anonymous"></script>

    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/normalize/8.0.0/normalize.min.css" integrity="sha256-oSrCnRYXvHG31SBifqP2PM1uje7SJUyX0nTwO2RJV54=" crossorigin="anonymous" />
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.39.2/codemirror.min.css" integrity="sha256-I8NyGs4wjbMuBSUE40o55W6k6P7tu/7G28/JGUUYCIs=" crossorigin="anonymous" />
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.39.2/theme/monokai.min.css" integrity="sha256-jAukb65gp2gG6t4FtxpHgB3eFwM/rDUwrE2OaAp6+o8=" crossorigin="anonymous" />
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.39.2/addon/lint/lint.css" integrity="sha256-dDBnEiZOZC2E52rfFN3yqILyvNpxc1Q4Z0cI23L+wgQ=" crossorigin="anonymous" />
    <link rel="stylesheet" href="styles.css">
</head>
<body>
    <header class="header">
        <h1>UONET+ Request Signer by Wulkanowy</h1>
    </header>
    <main class="main">
        <form class="form">
            <p class="form__password">
                <label>Password:
                    <input id="password" type="text" size="39" required>
                </label>
            </p>
            <p class="form__certificate">
                <label>Certificate (CertyfikatPfx):
                    <textarea id="cert" spellcheck="false" required></textarea>
                </label>
            </p>
            <p class="form__body">
                <label>Body to sign (json):
                    <textarea id="body">{}</textarea>
                </label>
            </p>
            <p class="form__button">
                <button id="sign-button" class="button">Sign</button>
            </p>
            <p class="form__result">
                <label>Result (RequestSignatureValue):
                    <textarea id="result" spellcheck="false" readonly></textarea>
                </label>
            </p>
            <p class="form__log">
                <label>Log:
                    <textarea id="log" readonly></textarea>
                </label>
            </p>
        </form>
    </main>
    <footer class="footer">
        &copy; 2018 by <a href="https://wulkanowy.github.io">Wulkanowy</a> |
        <a href="https://github.com/wulkanowy/uonet-request-signer">GitHub</a> |
        <a href="https://github.com/wulkanowy/uonet-request-signer/tree/master/php">PHP implementation</a> |
        <a href="https://github.com/wulkanowy/uonet-request-signer/tree/master/js">JS implementation</a> |
        <a href="https://github.com/wulkanowy/uonet-request-signer/tree/master/node">Node.js implementation</a> |
        <a href="https://github.com/VLO-GDA/uonet-sdk/blob/master/src/main/java/net/maciekmm/uonet/EncryptionUtils.java">Java implementation</a> |
        <a href="https://github.com/wulkanowy/uonet-request-signer/tree/master/python">Python implementation</a>
    </footer>
    <script>
        function uuid() {
            let uuid = "", i, random;
            for (i = 0; i < 32; i++) {
                random = Math.random() * 16 | 0;

                if (i === 8 || i === 12 || i === 16 || i === 20) {
                uuid += "-"
                }
                uuid += (i === 12 ? 4 : (i === 16 ? (random & 3 | 8) : random)).toString(16);
            }
            return uuid.toUpperCase();
        }

        document.querySelector("#body").value = JSON.stringify({
            "RemoteMobileTimeKey": Math.floor(Date.now() / 1000) + 1,
            "TimeKey": Math.floor(Date.now() / 1000),
            "RequestId": uuid(),
            "RemoteMobileAppVersion": "19.4.1.436",
            "RemoteMobileAppName": "VULCAN-Android-ModulUcznia"
        }, null, 4) + "\n";

        window.addEventListener("error", function(evt) {
            logToArea(evt.message || evt.type);
        }, true);

        function logToArea(text) {
            document.querySelector("#log").value = new Date().toLocaleTimeString()
                + " " + text + "\n"
                + document.querySelector("#log").value;
        }

        const editor = CodeMirror.fromTextArea(document.querySelector("#body"), {
            lineNumbers: true,
            theme: "monokai",
            mode: "application/json",
            gutters: ["CodeMirror-lint-markers"],
            lint: true
        });

        document.querySelector("#sign-button").addEventListener('click', function (e) {
            e.preventDefault();
            signer.signContent(
                document.querySelector("#password").value,
                document.querySelector("#cert").value,
                editor.getValue()
            ).then(function(result) {
                document.querySelector("#result").value = result;
                logToArea("Signed successfully");
            });
        });
    </script>
</body>
</html>