mirror of
https://github.com/tsl0922/ttyd.git
synced 2025-12-29 06:54:35 +01:00
61a985e74e
* html: Add Unicode 11 xterm.js addon Add Unicode 11 addon to xterm.js to enable support for newer Unicode standards. This addon significantly improves rendering of emojis. Signed-off-by: Michael Lorant <michael.lorant@nine.com.au> * html: rebuild header file --------- Signed-off-by: Michael Lorant <michael.lorant@nine.com.au> Co-authored-by: Shuanglei Tao <tsl0922@gmail.com>
67 lines
1.9 KiB
TypeScript
67 lines
1.9 KiB
TypeScript
import { h, Component } from 'preact';
|
|
|
|
import { ITerminalOptions, ITheme } from '@xterm/xterm';
|
|
import { ClientOptions, FlowControl } from './terminal/xterm';
|
|
import { Terminal } from './terminal';
|
|
|
|
const protocol = window.location.protocol === 'https:' ? 'wss:' : 'ws:';
|
|
const path = window.location.pathname.replace(/[/]+$/, '');
|
|
const wsUrl = [protocol, '//', window.location.host, path, '/ws', window.location.search].join('');
|
|
const tokenUrl = [window.location.protocol, '//', window.location.host, path, '/token'].join('');
|
|
const clientOptions = {
|
|
rendererType: 'webgl',
|
|
disableLeaveAlert: false,
|
|
disableResizeOverlay: false,
|
|
enableZmodem: false,
|
|
enableTrzsz: false,
|
|
enableSixel: false,
|
|
isWindows: false,
|
|
unicodeVersion: '11',
|
|
} as ClientOptions;
|
|
const termOptions = {
|
|
fontSize: 13,
|
|
fontFamily: 'Consolas,Liberation Mono,Menlo,Courier,monospace',
|
|
theme: {
|
|
foreground: '#d2d2d2',
|
|
background: '#2b2b2b',
|
|
cursor: '#adadad',
|
|
black: '#000000',
|
|
red: '#d81e00',
|
|
green: '#5ea702',
|
|
yellow: '#cfae00',
|
|
blue: '#427ab3',
|
|
magenta: '#89658e',
|
|
cyan: '#00a7aa',
|
|
white: '#dbded8',
|
|
brightBlack: '#686a66',
|
|
brightRed: '#f54235',
|
|
brightGreen: '#99e343',
|
|
brightYellow: '#fdeb61',
|
|
brightBlue: '#84b0d8',
|
|
brightMagenta: '#bc94b7',
|
|
brightCyan: '#37e6e8',
|
|
brightWhite: '#f1f1f0',
|
|
} as ITheme,
|
|
allowProposedApi: true,
|
|
} as ITerminalOptions;
|
|
const flowControl = {
|
|
limit: 100000,
|
|
highWater: 10,
|
|
lowWater: 4,
|
|
} as FlowControl;
|
|
|
|
export class App extends Component {
|
|
render() {
|
|
return (
|
|
<Terminal
|
|
id="terminal-container"
|
|
wsUrl={wsUrl}
|
|
tokenUrl={tokenUrl}
|
|
clientOptions={clientOptions}
|
|
termOptions={termOptions}
|
|
flowControl={flowControl}
|
|
/>
|
|
);
|
|
}
|
|
}
|