2023-03-19 03:30:29 +01:00
|
|
|
import React from 'react';
|
2023-03-20 12:01:03 +01:00
|
|
|
import { XTerm } from 'xterm-for-react';
|
|
|
|
import { Terminal } from 'xterm';
|
2023-03-19 03:30:29 +01:00
|
|
|
|
|
|
|
export class Console extends React.Component {
|
|
|
|
constructor(props) {
|
|
|
|
super(props);
|
|
|
|
this.terminal = React.createRef(null);
|
|
|
|
}
|
|
|
|
|
|
|
|
render() {
|
|
|
|
return <div style={{padding: '8px'}}>
|
|
|
|
<XTerm
|
|
|
|
ref={this.terminal}
|
|
|
|
options={{
|
|
|
|
theme: {
|
|
|
|
background: '#212121',
|
|
|
|
brightGreen: '#15a179'
|
|
|
|
},
|
2023-03-20 12:01:03 +01:00
|
|
|
convertEol: true,
|
|
|
|
rows: 30,
|
|
|
|
cols: 200
|
2023-03-19 03:30:29 +01:00
|
|
|
}}
|
|
|
|
/>
|
|
|
|
</div>;
|
|
|
|
}
|
|
|
|
|
|
|
|
componentDidMount() {
|
2023-03-20 12:01:03 +01:00
|
|
|
const term_ref = this.terminal.current;
|
|
|
|
require('./emulator')(term_ref);
|
|
|
|
|
|
|
|
/** @type { Terminal } */
|
|
|
|
const terminal = term_ref.terminal;
|
|
|
|
|
|
|
|
terminal.focus();
|
2023-03-19 03:30:29 +01:00
|
|
|
}
|
|
|
|
}
|