1<html> 2 <head> 3 <meta charset="UTF-8"> 4 <link rel="stylesheet" type="text/css" href="style.css"> 5 <link rel="icon" type="image/png" sizes="16x16" href="favicon-16x16.png"> 6 7 <title>Zephyr WS Console</title> 8 9 <script language="javascript" type="text/javascript"> 10var connected; 11var ws; 12 13function init() { 14 ws = new WebSocket(location.origin.replace("http", "ws") + "/console"); 15 16 ws.onopen = function() { 17 output("Connection opened"); 18 connected = "true"; 19 // No need to print Escape codes for colors 20 ws.send("shell colors off\n"); 21 }; 22 23 ws.onmessage = function(e) { 24 zconsole(new Date().timeNow() + " : " + e.data.trim()); 25 }; 26 27 ws.onclose = function() { 28 output("Connection closed"); 29 connected = "false"; 30 changeCloseText(); 31 }; 32 33 ws.onerror = function(e) { 34 output("Error: " + e.data); 35 }; 36} 37 38Date.prototype.timeNow = function () { 39 return ((this.getHours() < 10)?"0":"") + this.getHours() +":"+ 40 ((this.getMinutes() < 10)?"0":"") + this.getMinutes() +":"+ 41 ((this.getSeconds() < 10)?"0":"") + this.getSeconds(); 42} 43 44function onSendClick() { 45 var input = document.getElementById("prompt"); 46 if (connected == "false") { 47 output("Not connected"); 48 input.value = ""; 49 input.focus(); 50 return; 51 } 52 53 output("Sending: " + input.value); 54 ws.send(input.value + "\n"); 55 input.value = ""; 56 input.focus(); 57} 58 59function changeCloseText() { 60 if (connected == "false") { 61 document.getElementById("closebutton").innerText= "Connect"; 62 } else { 63 document.getElementById("closebutton").innerText= "Close"; 64 } 65} 66 67function onCloseClick() { 68 if (connected == "true") { 69 ws.close(); 70 connected = "false"; 71 changeCloseText(); 72 } else { 73 changeCloseText(); 74 wsConnect(); 75 } 76} 77 78function wsConnect() { 79 if (connected == "false") { 80 location.reload(); 81 } 82} 83 84function scrollToBottom(id){ 85 var div = document.getElementById(id); 86 div.scrollTop = div.scrollHeight - div.clientHeight; 87} 88 89function zconsole(str) { 90 var log = document.getElementById("zconsoleline"); 91 var escaped = str.replace(/&/, "&").replace(/</, "<"). 92 replace(/>/, ">").replace(/\u000d/, ""). 93 replace(/\u000a/, "").replace(/\[0\;31m/, "<em>"). 94 replace(/\[0m/, "</em>").replace(/"/, """); // " 95 log.innerHTML = log.innerHTML + escaped + "<br>"; 96 scrollToBottom("zconsole"); 97} 98 99function output(str) { 100 var log = document.getElementById("output"); 101 var escaped = str.replace(/&/, "&").replace(/</, "<"). 102 replace(/>/, ">").replace(/"/, """); // " 103 log.innerHTML = log.innerHTML + escaped + "<br>"; 104 scrollToBottom("output"); 105} 106 107 </script> 108</head> 109 110<body onload="init();"> 111 <div id="container" class="container"> 112 <div class="textcontainer"> 113 <div id="zconsole" class="zconsole"> 114 <p id="zconsoleline"></p> 115 </div> 116 <div id="output" class="output"> 117 </div> 118 </div> 119 <div id="inputbar" class="inputbar"> 120 <table class="inputtable"> 121 <tr class="inputrow"> 122 <td class="input_cell"> 123 <label for="prompt" class="command_prompt">Command:</label> 124 <input id="prompt" type="text" size="32" 125 onkeydown="if (event.keyCode == 13) 126 document.getElementById('sendbutton').click()" /> 127 <button type="button" id="sendbutton" 128 onclick="onSendClick()">Send</button> 129 </td> 130 <td class="close_cell"> 131 <button type="button" id="closebutton" 132 onclick="onCloseClick()">Close</button> 133 </td> 134 </tr> 135 </table> 136 </div> 137 </div> 138</body> 139</html> 140