pbrisbin/tee-io

function Output(elem) {
  this.elem = elem;
  this.streamUrl = elem.
    getAttribute("data-stream-url").
    replace(/http(s?):/, "ws$1:");
}

Output.prototype.append = function(text) {
  this.elem.textContent += text

  if (text != "") {
    window.scrollTo(0, document.body.scrollHeight);
  }
};

Output.prototype.connect = function() {
  var self = this
    , socket = new WebSocket(this.streamUrl);

  socket.onerror = function(data) {
    console.log("websockets error", data);
  };

  socket.onmessage = function(data) {
    self.append(data.data);
    socket.send("acknowledged");
  };
}

document.addEventListener("DOMContentLoaded", function() {
  var elem = document.getElementById("output")

  if (elem) {
    new Output(elem).connect();
  }
});