Skip to content

Commit bf89510

Browse files
tsl0922tsl0922
committed
html: upgrade to xterm 5.0
1 parent 6729d8e commit bf89510

File tree

6 files changed

+12116
-12362
lines changed

6 files changed

+12116
-12362
lines changed

‎html/package.json

Lines changed: 6 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -50,11 +50,12 @@
5050
"file-saver": "^2.0.5",
5151
"preact": "^10.11.2",
5252
"whatwg-fetch": "^3.6.2",
53-
"xterm": "^4.19.0",
54-
"xterm-addon-fit": "^0.5.0",
55-
"xterm-addon-image": "^0.1.3",
56-
"xterm-addon-web-links": "^0.6.0",
57-
"xterm-addon-webgl": "^0.12.0",
53+
"xterm": "^5.0.0",
54+
"xterm-addon-canvas": "^0.2.0",
55+
"xterm-addon-fit": "^0.6.0",
56+
"xterm-addon-image": "^0.2.0",
57+
"xterm-addon-web-links": "^0.7.0",
58+
"xterm-addon-webgl": "^0.13.0",
5859
"zmodem.js": "^0.1.10"
5960
}
6061
}

‎html/src/components/app.tsx

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -42,6 +42,7 @@ const termOptions = {
4242
brightCyan: '#37e6e8',
4343
brightWhite: '#f1f1f0',
4444
} as ITheme,
45+
allowProposedApi: true,
4546
} as ITerminalOptions;
4647

4748
export class App extends Component {

‎html/src/components/terminal/index.tsx

Lines changed: 52 additions & 23 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,9 @@
11
import { bind } from 'decko';
22
import { Component, h } from 'preact';
3-
import { ITerminalOptions, RendererType, Terminal } from 'xterm';
4-
import { FitAddon } from 'xterm-addon-fit';
3+
import { ITerminalOptions, Terminal } from 'xterm';
4+
import { CanvasAddon } from 'xterm-addon-canvas';
55
import { WebglAddon } from 'xterm-addon-webgl';
6+
import { FitAddon } from 'xterm-addon-fit';
67
import { WebLinksAddon } from 'xterm-addon-web-links';
78
import { ImageAddon } from 'xterm-addon-image';
89
import { OverlayAddon } from './overlay';
@@ -36,8 +37,10 @@ const enum Command {
3637
RESUME = '3',
3738
}
3839

40+
export type RendererType = 'dom' | 'canvas' | 'webgl';
41+
3942
export interface ClientOptions {
40-
rendererType: 'dom' | 'canvas' | 'webgl';
43+
rendererType: RendererType;
4144
disableLeaveAlert: boolean;
4245
disableResizeOverlay: boolean;
4346
titleFixed: string;
@@ -61,6 +64,7 @@ export class Xterm extends Component<Props> {
6164
private overlayAddon: OverlayAddon;
6265
private zmodemAddon: ZmodemAddon;
6366
private webglAddon: WebglAddon;
67+
private canvasAddon: CanvasAddon;
6468

6569
private socket: WebSocket;
6670
private token: string;
@@ -212,9 +216,16 @@ export class Xterm extends Component<Props> {
212216
}
213217

214218
@bind
215-
private setRendererType(value: 'webgl' | RendererType) {
219+
private setRendererType(value: RendererType) {
216220
const { terminal } = this;
217-
221+
const disposeCanvasRenderer = () => {
222+
try {
223+
this.canvasAddon?.dispose();
224+
} catch {
225+
// ignore
226+
}
227+
this.canvasAddon = undefined;
228+
};
218229
const disposeWebglRenderer = () => {
219230
try {
220231
this.webglAddon?.dispose();
@@ -223,33 +234,50 @@ export class Xterm extends Component<Props> {
223234
}
224235
this.webglAddon = undefined;
225236
};
237+
const enableCanvasRenderer = () => {
238+
if (this.canvasAddon) return;
239+
this.canvasAddon = new CanvasAddon();
240+
disposeWebglRenderer();
241+
try {
242+
this.terminal.loadAddon(this.canvasAddon);
243+
console.log(`[ttyd] canvas renderer loaded`);
244+
} catch (e) {
245+
console.log(`[ttyd] canvas renderer could not be loaded, falling back to dom renderer`, e);
246+
disposeCanvasRenderer();
247+
}
248+
};
249+
const enableWebglRenderer = () => {
250+
if (this.webglAddon) return;
251+
this.webglAddon = new WebglAddon();
252+
disposeCanvasRenderer();
253+
try {
254+
this.webglAddon.onContextLoss(() => {
255+
this.webglAddon?.dispose();
256+
});
257+
terminal.loadAddon(this.webglAddon);
258+
console.log(`[ttyd] WebGL renderer loaded`);
259+
} catch (e) {
260+
console.log(`[ttyd] WebGL renderer could not be loaded, falling back to canvas renderer`, e);
261+
disposeWebglRenderer();
262+
enableCanvasRenderer();
263+
}
264+
};
226265

227266
switch (value) {
267+
case 'canvas':
268+
enableCanvasRenderer();
269+
break;
228270
case 'webgl':
229-
if (this.webglAddon) return;
230-
try {
231-
if (window.WebGL2RenderingContext && document.createElement('canvas').getContext('webgl2')) {
232-
this.webglAddon = new WebglAddon();
233-
this.webglAddon.onContextLoss(() => {
234-
disposeWebglRenderer();
235-
});
236-
terminal.loadAddon(this.webglAddon);
237-
console.log(`[ttyd] WebGL renderer enabled`);
238-
}
239-
} catch (e) {
240-
console.warn(`[ttyd] webgl2 init error`, e);
241-
}
271+
enableWebglRenderer();
242272
break;
273+
case 'dom':
243274
default:
244-
disposeWebglRenderer();
245-
console.log(`[ttyd] option: rendererType=${value}`);
246-
terminal.options.rendererType = value;
247275
break;
248276
}
249277
}
250278

251279
@bind
252-
private applyOptions(options: any) {
280+
private applyOptions(options: ITerminalOptions) {
253281
const { terminal, fitAddon } = this;
254282

255283
Object.keys(options).forEach(key => {
@@ -373,7 +401,8 @@ export class Xterm extends Component<Props> {
373401
break;
374402
case Command.SET_PREFERENCES:
375403
const prefs = JSON.parse(textDecoder.decode(data));
376-
this.applyOptions(Object.assign({}, this.props.clientOptions, prefs));
404+
const options = Object.assign({}, this.props.clientOptions, prefs) as ITerminalOptions;
405+
this.applyOptions(options);
377406
break;
378407
default:
379408
console.warn(`[ttyd] unknown command: ${cmd}`);

‎html/src/components/zmodem/index.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -84,7 +84,7 @@ export class ZmodemAddon extends Component<Props, State> implements ITerminalAdd
8484

8585
@bind
8686
private zmodemReset() {
87-
this.terminal.setOption('disableStdin', false);
87+
this.terminal.options.disableStdin = false;
8888

8989
if (this.keyDispose) {
9090
this.keyDispose.dispose();
@@ -127,7 +127,7 @@ export class ZmodemAddon extends Component<Props, State> implements ITerminalAdd
127127
@bind
128128
private zmodemDetect(detection: Zmodem.Detection): void {
129129
const { terminal, receiveFile, zmodemReset } = this;
130-
terminal.setOption('disableStdin', true);
130+
terminal.options.disableStdin = true;
131131

132132
this.keyDispose = terminal.onKey(e => {
133133
const event = e.domEvent;

‎html/yarn.lock

Lines changed: 25 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -7246,30 +7246,35 @@ xtend@~4.0.0, xtend@~4.0.1:
72467246
resolved "https://registry.yarnpkg.com/xtend/-/xtend-4.0.2.tgz#bb72779f5fa465186b1f438f674fa347fdb5db54"
72477247
integrity sha512-LKYU1iAXJXUgAXn9URjiu+MWhyUXHsvfp7mcuYm9dSUKK0/CjtrUwFAxD82/mCWbtLsGjFIad0wIsod4zrTAEQ==
72487248

7249-
xterm-addon-fit@^0.5.0:
7250-
version "0.5.0"
7251-
resolved "https://registry.yarnpkg.com/xterm-addon-fit/-/xterm-addon-fit-0.5.0.tgz#2d51b983b786a97dcd6cde805e700c7f913bc596"
7252-
integrity sha512-DsS9fqhXHacEmsPxBJZvfj2la30Iz9xk+UKjhQgnYNkrUIN5CYLbw7WEfz117c7+S86S/tpHPfvNxJsF5/G8wQ==
7253-
7254-
xterm-addon-image@^0.1.3:
7255-
version "0.1.3"
7256-
resolved "https://registry.yarnpkg.com/xterm-addon-image/-/xterm-addon-image-0.1.3.tgz#20593d93b51ab3408debb31f66f8700a2e60ed2d"
7257-
integrity sha512-9J+DnI/MlanAv+gaaTcTXcqXK8fU/FYiWbaL0C5+YY2lbflpGSk7XV4K95txbix4AdV85RfIDByUm7VJZRWs8g==
7249+
xterm-addon-canvas@^0.2.0:
7250+
version "0.2.0"
7251+
resolved "https://registry.npmmirror.com/xterm-addon-canvas/-/xterm-addon-canvas-0.2.0.tgz#ba0080d4071f172f94e8c0b5e6151dd7e386f1a1"
7252+
integrity sha512-b4tMT05US9Rlqv6R0XZTHsfq8MRKzwxITwpvckuod/l4lokcCokHPbgpYAytOgrzqkzWjYI+Ol8en6cMGf8ncg==
72587253

7259-
xterm-addon-web-links@^0.6.0:
7254+
xterm-addon-fit@^0.6.0:
72607255
version "0.6.0"
7261-
resolved "https://registry.yarnpkg.com/xterm-addon-web-links/-/xterm-addon-web-links-0.6.0.tgz#0296cb6c99588847894670d998c9ea6a6aeb26ee"
7262-
integrity sha512-H6XzjWWZu8FBo+fnYpxdPk9w5M6drbsvwPEJZGRS38MihiQaVFpKlCMKdfRgDbKGE530tw1yH54rhpZfHgt2/A==
7256+
resolved "https://registry.npmmirror.com/xterm-addon-fit/-/xterm-addon-fit-0.6.0.tgz#142e1ce181da48763668332593fc440349c88c34"
7257+
integrity sha512-9/7A+1KEjkFam0yxTaHfuk9LEvvTSBi0PZmEkzJqgafXPEXL9pCMAVV7rB09sX6ATRDXAdBpQhZkhKj7CGvYeg==
72637258

7264-
xterm-addon-webgl@^0.12.0:
7265-
version "0.12.0"
7266-
resolved "https://registry.yarnpkg.com/xterm-addon-webgl/-/xterm-addon-webgl-0.12.0.tgz#2fba8d31890a122adafa1c2fb945482e2ae12973"
7267-
integrity sha512-3P5ihdjPnxH6Wrvqjki9UD+duoVrp1fvnO/pSpXP2F1L2GwY6TDNExgj8Yg141vMCNgQbcVqmsTLYEYZxjY92A==
7259+
xterm-addon-image@^0.2.0:
7260+
version "0.2.0"
7261+
resolved "https://registry.npmmirror.com/xterm-addon-image/-/xterm-addon-image-0.2.0.tgz#47f58a522c7d21c7b2fc7a2d18aff324461974f1"
7262+
integrity sha512-rGbwUcwnJQqN1LTdEhqUS83xtBpApUWOJISjN/Efbg8TplqdXsHOVDmEcnLvhBn5cCzAZIqD2OZaan1+cI7mWA==
72687263

7269-
xterm@^4.19.0:
7270-
version "4.19.0"
7271-
resolved "https://registry.yarnpkg.com/xterm/-/xterm-4.19.0.tgz#c0f9d09cd61de1d658f43ca75f992197add9ef6d"
7272-
integrity sha512-c3Cp4eOVsYY5Q839dR5IejghRPpxciGmLWWaP9g+ppfMeBChMeLa1DCA+pmX/jyDZ+zxFOmlJL/82qVdayVoGQ==
7264+
xterm-addon-web-links@^0.7.0:
7265+
version "0.7.0"
7266+
resolved "https://registry.npmmirror.com/xterm-addon-web-links/-/xterm-addon-web-links-0.7.0.tgz#dceac36170605f9db10a01d716bd83ee38f65c17"
7267+
integrity sha512-6PqoqzzPwaeSq22skzbvyboDvSnYk5teUYEoKBwMYvhbkwOQkemZccjWHT5FnNA8o1aInTc4PRYAl4jjPucCKA==
7268+
7269+
xterm-addon-webgl@^0.13.0:
7270+
version "0.13.0"
7271+
resolved "https://registry.npmmirror.com/xterm-addon-webgl/-/xterm-addon-webgl-0.13.0.tgz#b1d42ec454390ad8595aa8c8dde714b98a5eb896"
7272+
integrity sha512-xL4qBQWUHjFR620/8VHCtrTMVQsnZaAtd1IxFoiKPhC63wKp6b+73a45s97lb34yeo57PoqZhE9Jq5pB++ksPQ==
7273+
7274+
xterm@^5.0.0:
7275+
version "5.0.0"
7276+
resolved "https://registry.npmmirror.com/xterm/-/xterm-5.0.0.tgz#0af50509b33d0dc62fde7a4ec17750b8e453cc5c"
7277+
integrity sha512-tmVsKzZovAYNDIaUinfz+VDclraQpPUnAME+JawosgWRMphInDded/PuY0xmU5dOhyeYZsI0nz5yd8dPYsdLTA==
72737278

72747279
y18n@^3.2.1:
72757280
version "3.2.2"

0 commit comments

Comments
 (0)