77 lines
1.7 KiB
HTML
Executable File
77 lines
1.7 KiB
HTML
Executable File
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<title>WebSocket Terminal</title>
|
|
<style>
|
|
body {
|
|
background-color: black;
|
|
color: white;
|
|
font-family: monospace;
|
|
margin: 0;
|
|
padding: 20px;
|
|
}
|
|
#terminal {
|
|
height: 90vh;
|
|
overflow-y: auto;
|
|
white-space: pre-wrap;
|
|
}
|
|
#input {
|
|
background-color: black;
|
|
color: white;
|
|
border: none;
|
|
outline: none;
|
|
font-family: monospace;
|
|
width: 80%;
|
|
font-size: 16px;
|
|
padding: 5px;
|
|
}
|
|
.prompt {
|
|
color: #00ff00;
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<div id="terminal"></div>
|
|
<span class="prompt">></span>
|
|
<input type="text" id="input" autofocus>
|
|
</div>
|
|
|
|
<script>
|
|
const terminal = document.getElementById('terminal');
|
|
const input = document.getElementById('input');
|
|
const ws = new WebSocket('ws://localhost/ws');
|
|
|
|
function addToTerminal(text) {
|
|
terminal.innerHTML += text + '\n';
|
|
terminal.scrollTop = terminal.scrollHeight;
|
|
}
|
|
|
|
// WebSocket Handlers
|
|
ws.onopen = () => {
|
|
addToTerminal('Connected to server');
|
|
};
|
|
|
|
ws.onmessage = (event) => {
|
|
addToTerminal(event.data);
|
|
};
|
|
|
|
ws.onerror = (error) => {
|
|
addToTerminal('Error: ' + error.message);
|
|
};
|
|
|
|
ws.onclose = () => {
|
|
addToTerminal('Connection closed');
|
|
};
|
|
|
|
// Input handling
|
|
input.addEventListener('keypress', (e) => {
|
|
if (e.key === 'Enter') {
|
|
const command = input.value;
|
|
addToTerminal('> ' + command);
|
|
ws.send(command);
|
|
input.value = '';
|
|
}
|
|
});
|
|
</script>
|
|
</body>
|
|
</html> |