f5 - yar145/mytestrepo1 GitHub Wiki

        function appendLog(item) {
            var doScroll = log.scrollTop === log.scrollHeight - log.clientHeight;
            log.appendChild(item);
            if (doScroll) {
                log.scrollTop = log.scrollHeight - log.clientHeight;
            }
        }

        document.getElementById("connect").onclick = function () {
            var server = document.getElementById("wsURL");
            conn = new WebSocket(server.value);
            if (window["WebSocket"]) {
                if (conn) {
                    conn.onopen = function (evt) {
                        document.getElementById("disconnect").disabled = false
                        document.getElementById("sendMsg").disabled = false
                        document.getElementById("connect").disabled = true
                        document.getElementById("status").innerHTML = "Connection opened"
                    }
                    conn.onclose = function (evt) {
                        document.getElementById("status").innerHTML = "Connection closed"
                        document.getElementById("connect").disabled = false
                    };
                    conn.onmessage = function (evt) {
                        var messages = evt.data.split('\n');
                        for (var i = 0; i < messages.length; i++) {
                            var item = document.createElement("pre");
                            item.innerText = messages[i];
                            appendLog(item);
                        }
                    }
                }
            } else {
                var item = document.createElement("pre");
                item.innerHTML = "<b>Your browser does not support WebSockets.</b>";
                appendLog(item);
            }
        };

        document.getElementById("disconnect").onclick = function () {
            conn.close()
            document.getElementById("sendMsg").disabled = true
            document.getElementById("connect").disabled = false
            document.getElementById("disconnect").disabled = true
            document.getElementById("status").innerHTML = "Connection closed"
        };

        document.getElementById("form").onsubmit = function () {
            if (!conn) {
                return false;
            }
            if (!msg.value) {
                return false;
            }
            conn.send(msg.value);
            var item = document.createElement("pre");
            item.classList.add("subscribeMsg");
            item.innerHTML = msg.value;
            appendLog(item);
            return false;
        };
    };

</script>
<style type="text/css">
    html {
        overflow: hidden;
    }

    body {
        overflow: hidden;
        padding: 0;
        margin: 0;
        width: 100%;
        height: 100%;
        background: gray;
    }

    #log {
        background: white;
        margin: 0;
        padding: 0.5em 0.5em 0.5em 0.5em;
        top: 1.5em;
        left: 0.5em;
        right: 0.5em;
        bottom: 3em;
        overflow: auto;
        position: absolute;
        height: 530px;
    }

    #form {
        padding: 0 0.5em 0 0.5em;
        margin: 0;
        position: absolute;
        bottom: 3em;
        top: 5em;
        left: 8px;
        width: 100%;
        overflow: hidden;
    }

    #serverLocation {
        padding-top: 0.3em;
    }

    #requestSection {
        height: 38px;
    }

    #responseMsgSection {
        height: 570px;
        position: relative;
    }
</style>