92 lines
		
	
	
		
			2.9 KiB
		
	
	
	
		
			HTML
		
	
	
	
	
	
			
		
		
	
	
			92 lines
		
	
	
		
			2.9 KiB
		
	
	
	
		
			HTML
		
	
	
	
	
	
<html>
 | 
						|
 | 
						|
<head>
 | 
						|
	<script src="https://cdn.jsdelivr.net/npm/socket.io-client@2.2.0/dist/socket.io.js"> </script>
 | 
						|
	<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/xterm@3.12.2/dist/xterm.css" />
 | 
						|
	<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/xterm@3.12.2/dist/addons/fullscreen/fullscreen.css">
 | 
						|
 | 
						|
	<script src="https://cdn.jsdelivr.net/npm/xterm@3.12.2/dist/xterm.js"></script>
 | 
						|
	<script src="https://cdn.jsdelivr.net/npm/xterm@3.12.2/dist/addons/fit/fit.js"></script>
 | 
						|
	<script src="https://cdn.jsdelivr.net/npm/xterm@3.12.2/dist/addons/attach/attach.js"></script>
 | 
						|
	<script src="https://cdn.jsdelivr.net/npm/xterm@3.12.2/dist/addons/fullscreen/fullscreen.js"></script>
 | 
						|
	<style>
 | 
						|
		#terminal-container .terminal.xterm {
 | 
						|
			height: 100%;
 | 
						|
		}
 | 
						|
 | 
						|
		#terminal-container .xterm-viewport {
 | 
						|
			height: 100% !important;
 | 
						|
		}
 | 
						|
	</style>
 | 
						|
</head>
 | 
						|
 | 
						|
<body>
 | 
						|
	<div id="terminal" style="height: 100%;"></div>
 | 
						|
	<script type="text/javascript">
 | 
						|
		Terminal.applyAddon(fit);
 | 
						|
		Terminal.applyAddon(attach);
 | 
						|
        Terminal.applyAddon(fullscreen);
 | 
						|
		var term = new Terminal({
 | 
						|
            cursorBlink: true,
 | 
						|
            screenKeys: true
 | 
						|
        });
 | 
						|
        term.open(document.getElementById('terminal'));
 | 
						|
        term.toggleFullScreen();
 | 
						|
        term.fit();
 | 
						|
 | 
						|
        var cmd = ''
 | 
						|
        term.on('data', (data) => {
 | 
						|
            if (data =='\r') {
 | 
						|
                term.writeln(data)
 | 
						|
                if(cmd.startsWith('/')){
 | 
						|
                    args = cmd.split(' ');
 | 
						|
                    cmd = args[0].substr(1);
 | 
						|
                    switch(cmd){
 | 
						|
                        case "connect":
 | 
						|
                            if(args[1]){
 | 
						|
                                newcon(args[1])
 | 
						|
                            } else {
 | 
						|
                                newcon('/main')
 | 
						|
                            }
 | 
						|
                            break;
 | 
						|
                        case "disconnect":
 | 
						|
                            socket.close();
 | 
						|
                            break;
 | 
						|
                    }
 | 
						|
                } else {
 | 
						|
                    socket && socket.emit('webmsg', {cmd});
 | 
						|
                }
 | 
						|
                cmd = ''
 | 
						|
            } else {
 | 
						|
                cmd += data;
 | 
						|
                term.write(data)
 | 
						|
            }
 | 
						|
        });
 | 
						|
 | 
						|
        function newcon(address){
 | 
						|
            socket = io(address,{
 | 
						|
                path: '/ws',
 | 
						|
                transports: ['websocket']
 | 
						|
            });
 | 
						|
            socket.on('connect', function(){
 | 
						|
                term.writeln('connect')
 | 
						|
                socket.emit('webclient',{})
 | 
						|
            });
 | 
						|
            socket.on('message', function(data){
 | 
						|
                for (const line of JSON.stringify(data, undefined, 4).split('\n')){
 | 
						|
                    term.writeln(line);
 | 
						|
                }
 | 
						|
            });
 | 
						|
            socket.on('disconnect', function(){
 | 
						|
                term.reset();
 | 
						|
                term.writeln('disconnect')
 | 
						|
            });
 | 
						|
        }
 | 
						|
        window.onresize = function() {
 | 
						|
            term.fit();
 | 
						|
            term.scrollToBottom();
 | 
						|
        };
 | 
						|
	</script>
 | 
						|
</body>
 | 
						|
 | 
						|
</html> |