30 lines
882 B
JavaScript
30 lines
882 B
JavaScript
|
import { Terminal } from 'xterm';
|
||
|
|
import { AttachAddon } from 'xterm-addon-attach';
|
||
|
|
import { FitAddon } from 'xterm-addon-fit';
|
||
|
|
|
||
|
|
window.customElements.define('console-component', class extends HTMLElement {
|
||
|
|
constructor(host, server, token) {
|
||
|
|
super();
|
||
|
|
this.shadow = this.attachShadow({mode: 'open'});
|
||
|
|
this.render();
|
||
|
|
this.term = new Terminal();
|
||
|
|
const fitAddon = new FitAddon();
|
||
|
|
this.term.loadAddon(fitAddon);
|
||
|
|
fitAddon.fit();
|
||
|
|
term.open(document.getElementById('terminal'));
|
||
|
|
this.connect();
|
||
|
|
|
||
|
|
}
|
||
|
|
|
||
|
|
connect() {
|
||
|
|
this.socket = new WebSocket(`wss://${host}/server/${server}/logs?token=${token}`);
|
||
|
|
const attachAddon = new AttachAddon(socket);
|
||
|
|
term.loadAddon(attachAddon);
|
||
|
|
}
|
||
|
|
render() {
|
||
|
|
this.shadow.innerHTML = `
|
||
|
|
<div id="terminal"></div>
|
||
|
|
`;
|
||
|
|
}
|
||
|
|
|
||
|
|
});
|