Restored some HTML-Debugging-tools

2025-03-19 09:50:14 +01:00
parent 9f5ae58b9b
commit 11a475149a
10 changed files with 824 additions and 9 deletions
--- a/client/console.html
+++ b/client/console.html
@ -0,0 +1,150 @@
+<html>
+<head>
+<meta name="viewport" content="width=device-width, initial-scale=1">
+<link rel="icon" type="image/x-icon" href="favicon.ico">
+<style>
+.footer {
+    background: #ccc;
+    padding:5px;
+    overflow: auto;
+    height:30px;
+    position: fixed;
+    top: 0;
+    width: 100%;
+}
+</style>
+</head>
+<body>
+<div id="console" class=code>
+<br>
+<br>
+</div>
+<div class=footer>
+<form id="command_form" method="GET">
+<input type=input id=commandline size=80>
+</form>
+</div>
+<script type="text/javascript">
+
+function getJSON(url, successHandler, errorHandler) {
+	var xhr = typeof XMLHttpRequest != 'undefined'
+		? new XMLHttpRequest()
+		: new ActiveXObject('Microsoft.XMLHTTP');
+    console.log("fired JSON request", url)
+	xhr.open('get', url, true);
+	xhr.onreadystatechange = function() {
+	    console.log(xhr)
+		var status;
+		var data;
+		// https://xhr.spec.whatwg.org/#dom-xmlhttprequest-readystate
+		if (xhr.readyState == 4) { // `DONE`
+			status = xhr.status;
+			if (status == 200) {
+				data = JSON.parse(xhr.responseText);
+				successHandler && successHandler(data);
+			} else {
+				errorHandler && errorHandler(status);
+			}
+		}
+	};
+	xhr.send();
+};
+
+var historyElement = document.getElementById("console")
+// copy query
+var evtSrc = new EventSource("http://localhost:5000/update");
+
+function htmlEscape(str) {
+    return str
+        .replace(/&/g, '&amp;')
+        .replace(/"/g, '&quot;')
+        .replace(/'/g, '&#39;')
+        .replace(/</g, '&lt;')
+        .replace(/>/g, '&gt;');
+}
+
+var our_id=""
+var oldtop = -1
+
+evtSrc.onmessage = function(e) {
+  var message = JSON.parse(e.data)
+  console.log(message)
+  if (message.type == "id") {
+    our_id = message.id
+    var test = "xxx"
+    getJSON(
+      "http://localhost:5000/console?id="+our_id,
+      function(message) { console.log('msg', message, test); },
+      function(status) { console.log('stat', status); }
+    );
+  } else if (message.type == 'command' || message.type == 'reply') {
+    pre = ""
+    post = ""
+    if (message.type == 'command') {
+      pre += "<font color='blue'><br>"
+      post += "</font>"
+    }
+    if (message.origin == 'self') {
+      pre += "<b>"
+      post = "</b>" + post
+    }
+    historyElement.innerHTML += pre + htmlEscape(message.line) + post + "<br>\n"
+  }
+  /*
+  var doc = document.documentElement
+  var top = (window.pageYOffset || doc.scrollTop)  - (doc.clientTop || 0)
+  var h = window.innerHeight || window.clientHeight
+  var d = document.body.scrollHeight
+  */
+  window.scrollTo(0,document.body.scrollHeight)
+  /*
+  var top = (window.pageYOffset || doc.scrollTop)  - (doc.clientTop || 0)
+  var h = window.innerHeight
+  var d = document.body.scrollHeight
+  console.log(oldtop + oldh, top + h)
+  */
+};
+
+evtSrc.onerror = function(e) {
+  historyElement.innerHTML += "connection lost"
+  evtSrc.close()
+};
+
+function do_command() {
+    celm = document.getElementById("commandline")
+    cmd = encodeURI(celm.value);
+    celm.value = ""
+    oldtop = -1
+    if (our_id != "") {
+      cmd += "&id=" + our_id
+    }
+    console.log("http://localhost:5000/sendcommand?command="+cmd)
+    getJSON(
+      "http://localhost:5000/sendcommand?command="+cmd,
+      function(message) { console.log('message', message); },
+      function(status) { console.log('status', status); }
+    );
+}
+
+function handle_submit(evt) {
+  evt.preventDefault()
+  do_command()
+}
+
+command_form = document.getElementById("command_form")
+if (command_form.addEventListener) {
+    command_form.addEventListener("submit", handle_submit, true);
+} else {
+    command_form.attachEvent('onsubmit', handle_submit);
+}
+
+window.onbeforeunload = closingCode;
+function closingCode(){
+  console.log("CLOSE")
+  evtSrc.close()
+  return null;
+}
+
+</script>
+</body>
+</html>