#2

1 files changed, 95 insertions, 0 deletions

diff --git a/share/reverse-proxy/docroot/hybbx-websocket/hybbx-terminal.js b/share/reverse-proxy/docroot/hybbx-websocket/hybbx-terminal.js
new file mode 100644
index 0000000..50fb826
--- /dev/null
+++ b/share/reverse-proxy/docroot/hybbx-websocket/hybbx-terminal.js
@@ -0,0 +1,95 @@
+(function () {
+  'use strict';
+
+  var term = document.getElementById('term');
+  var status = document.getElementById('status');
+  var form = document.getElementById('input-bar');
+  var input = document.getElementById('cmd');
+  var wsUrl = window.HYBBX_WS_URL;
+  var ws = null;
+  var reconnectTimer = null;
+  var reconnectDelayMs = 2000;
+  var reconnectAttempt = 0;
+
+  function append(text) {
+    term.textContent += text;
+    term.scrollTop = term.scrollHeight;
+  }
+
+  function setStatus(s) {
+    status.textContent = s;
+  }
+
+  function scheduleReconnect() {
+    if (reconnectTimer) {
+      return;
+    }
+
+    reconnectAttempt += 1;
+    setStatus('reconnecting in ' + (reconnectDelayMs / 1000) + 's');
+    reconnectTimer = window.setTimeout(function () {
+      reconnectTimer = null;
+      connect();
+    }, reconnectDelayMs);
+  }
+
+  function setInputEnabled(enabled) {
+    input.disabled = !enabled;
+    if (enabled) {
+      input.focus();
+    }
+  }
+
+  function sendLine(text) {
+    if (!ws || ws.readyState !== WebSocket.OPEN) {
+      return;
+    }
+
+    ws.send(text + '\r');
+  }
+
+  function connect() {
+    setStatus('connecting');
+    setInputEnabled(false);
+    ws = new WebSocket(wsUrl);
+
+    ws.onopen = function () {
+      reconnectAttempt = 0;
+      setStatus('connected');
+      setInputEnabled(true);
+    };
+
+    ws.onmessage = function (ev) {
+      append(ev.data);
+    };
+
+    ws.onclose = function (ev) {
+      var reason = ev.reason ? ' (' + ev.reason + ')' : '';
+
+      append('\n[websocket disconnected: code ' + ev.code + reason + ']\n');
+      setStatus('disconnected: ' + ev.code);
+      ws = null;
+      setInputEnabled(false);
+      scheduleReconnect();
+    };
+
+    ws.onerror = function () {
+      setStatus('error');
+      setInputEnabled(false);
+    };
+  }
+
+  form.addEventListener('submit', function (ev) {
+    ev.preventDefault();
+
+    if (!ws || ws.readyState !== WebSocket.OPEN) {
+      return;
+    }
+
+    sendLine(input.value);
+    input.value = '';
+    input.focus();
+  });
+
+  connect();
+})();