midas
/
starmire


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112
							<html>
<head>
	<title>Starmire</title>
	<link href="https://fonts.googleapis.com/css?family=Inconsolata" rel="stylesheet">
	<meta name="viewport" content="width=device-width, initial-scale=1.0" />
	<link rel="stylesheet" media="screen" href="./css/terminal.css">
</head>
<body>
<div id="output"></div>
<input type="text" id="input" autocomplete="off" />

<script>
	var localEcho = true;
	var commandHistory = [];
	var commandPointer = 0;
function handleInstructions(instruction) {
		switch(instruction) {
			case "protectinput":
			document.getElementById("input").attributes["type"].value = "password";
			localEcho = false;
			break;
			case "openinput":
			document.getElementById("input").attributes["type"].value = "text";
			localEcho = true;
			break;
		}
	}
  window.WebSocket = window.WebSocket || window.MozWebSocket;
  var scheme = document.location.protocol === "https:" ? "wss" : "ws";
  var port = document.location.port ? (":" + document.location.port) : "";
  //var socketString = "ws://" + window.location.hostname + ":" + window.location.port;
  var socketString = `${scheme}://${window.location.hostname}${port}`;

  var connection = new WebSocket(socketString);

  connection.onopen = function () {
  };

  connection.onerror = function (error) {
  	console.error(error);
  };

  connection.onmessage = function (message) {
	try {
		var json = JSON.parse(message.data);
		if(json.type == "output") {
			var text = document.createElement("div");
			text.innerHTML = json.data.trim();
			document.getElementById("output").appendChild(text);
			window.scrollTo(0,document.body.scrollHeight);
		} else if(json.type == "instruction") {
			handleInstructions(json.data);
		} else {
			console.log(json);
		}
		
	} catch (e) {
		console.error("This doesn't look like a valid JSON ", message.data);
		return;
	}
	// handle incoming message
	};
	connection.onclose = function () {
  	document.getElementById("output").innerHTML += "connection closed by host\n";
  	window.scrollTo(0,document.body.scrollHeight);
  	document.getElementById("input").disabled = true;
  };

document.addEventListener("keydown", function(event) {
	document.getElementById("input").focus();
	if(document.getElementById("input").disabled) {
		return true;
	}
	
	if(event.keyCode == 13) {
		var inputToSend = document.getElementById("input").value;
		if(localEcho) {
			var text = document.createElement("div");
			text.innerHTML = inputToSend.trim();
			document.getElementById("output").appendChild(text);
			commandHistory.push(inputToSend);
			commandPointer = commandHistory.length;
		} else {
			var text = document.createElement("div");
			text.innerHTML = new Array(inputToSend.length + 1).join("*");
			document.getElementById("output").appendChild(text);
		}
		connection.send(inputToSend);
		document.getElementById("input").value = "";
		
	} else if (event.keyCode == 38) {
		commandPointer--;
		commandPointer = Math.max(0, commandPointer);
		document.getElementById("input").value = commandHistory[commandPointer];
		document.getElementById("input").setSelectionRange(commandHistory[commandPointer].length, commandHistory[commandPointer].length);
	} else if (event.keyCode == 40) {
		commandPointer++;
		if(commandPointer >= commandHistory.length) {
			commandPointer = Math.min(commandPointer, commandHistory.length - 1);
			document.getElementById("input").value = "";
			return;
		}
		commandPointer = Math.min(commandPointer, commandHistory.length - 1);
		document.getElementById("input").value = commandHistory[commandPointer];
		document.getElementById("input").setSelectionRange(commandHistory[commandPointer].length, commandHistory[commandPointer].length);
	}
}, false);

document.getElementById("input").focus();
</script>
</body>
</html>