The terminal plug Js

The terminal plug commonly used with websocket.

Download: https://pan.baidu.com/s/1WbyLNOYbwwikOi_iMU7oKA

Extraction code: 6mc7

First, the effect of FIG.

Second, the code

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>xterm.js</title>
    <link rel="stylesheet" href="node_modules/xterm/css/xterm.css">
    <script src="node_modules/xterm/lib/xterm.js"></script>
</head>
<body>
<div id="terminal"></div > 
< Script > 
    the let Term =  new new Terminal ({ 
        cursorStyle: ' underline ' , // cursor style 
        cursorBlink: to true , // blinking cursor 
        convertEol: to true , // When enabled, the cursor is set to the beginning of the next line 
        disableStdin: to false , // whether to disable input. 
        Theme: { 
            foreground: ' Yellow ' , // Font 
            background: ' # 060 101 ', //背景色
            cursor: 'help',//设置光标
        }
    });
    term.open(document.getElementById('terminal'));
    function runFakeTerminal() {
        if (term._initialized) {
            return;
        }

        term._initialized = true;

        term.prompt = () => {
            term.write('\r\n~$ ');
        };

        term.writeln('Welcome to xterm.js');
        prompt(term);

        term.onKey(e => {
            const printable = !e.domEvent.altKey && !e.domEvent.altGraphKey && !e.domEvent.ctrlKey && !e.domEvent.metaKey;

            if (e.domEvent.keyCode === 13) {
                prompt(term);
            } else if (e.domEvent.keyCode === 8) {
                // Do not delete the prompt
                if (term._core.buffer.x > 2) {
                    term.write('\b \b');
                }
            } else if (printable) {
                term.write(e.key);
            }
            console.log(e.key);
        });
    }

    function prompt(term) {
        term.write('\r\n~$ ');
    }
    runFakeTerminal();
</script>
</body>
</html>

The terminal plug Js

Guess you like