X-Git-Url: https://jxself.org/git/?a=blobdiff_plain;f=data%2Fweb-static%2Fjs%2Fmudsync.js;h=0e7ebe6f1c94abc23f64b582c8f87ea0c06436c3;hb=0974cafbe7e10dd08fe3fef371d002c3606feb9e;hp=b926c146b8b8c84eda2af175aefe2398fc6a6c35;hpb=7197e223d181722f6df49acb979c0d2f9f2c9551;p=mudsync.git diff --git a/data/web-static/js/mudsync.js b/data/web-static/js/mudsync.js index b926c14..0e7ebe6 100644 --- a/data/web-static/js/mudsync.js +++ b/data/web-static/js/mudsync.js @@ -18,28 +18,41 @@ ;;; along with Mudsync. If not, see . */ -function displayMessage(data, self_sent) { - var new_entry = document.createElement("div"); - var new_text = document.createTextNode(data); +function scrollDown() { + var stream_metabox = document.getElementById("stream-metabox"); + stream_metabox.scrollTop = stream_metabox.scrollHeight; +} + +function withMaybeScroll(thunk) { var stream_metabox = document.getElementById("stream-metabox"); var should_scroll = false; - if(stream_metabox.scrollTop === (stream_metabox.scrollHeight - - stream_metabox.offsetHeight)) { + // if within a reasonable threshold, we scroll + if((stream_metabox.scrollHeight - stream_metabox.offsetHeight) + - stream_metabox.scrollTop <= 50) { should_scroll = true; } - if (self_sent) { - new_entry.setAttribute("class", "stream-entry self-sent"); - document.getElementById("main-input").value = ""; - } else { - new_entry.setAttribute("class", "stream-entry"); - } - new_entry.appendChild(new_text); - document.getElementById("stream").appendChild(new_entry); + thunk(); if (should_scroll) { stream_metabox.scrollTop = stream_metabox.scrollHeight; } } + +function displayMessage(data, self_sent) { + var new_entry = document.createElement("div"); + withMaybeScroll( + function () { + if (self_sent) { + new_entry.setAttribute("class", "stream-entry self-sent"); + document.getElementById("main-input").value = ""; + } else { + new_entry.setAttribute("class", "stream-entry"); + } + new_entry.innerHTML = data; + document.getElementById("stream").appendChild(new_entry); + }); +} + function installWebsocket() { // TODO: Don't hardcode the websocket path; pull it from the DOM var address = "ws://".concat(window.location.hostname, ":", window.location.port); @@ -63,7 +76,10 @@ function installUIHooks(ws) { var keyCode = e.keyCode || e.which; if (keyCode == '13') { var input_val = input.value; - displayMessage("> ".concat(input_val), true); + withMaybeScroll( + function () { + displayMessage("> ".concat(input_val), true); + }); sendMessageToServer(ws, input_val); } } @@ -73,7 +89,7 @@ function sendMessageToServer(ws, data) { ws.send(data); } - window.onload = function () { installWebsocket(); + window.onresize = scrollDown; }