{
window.removeEventListener('beforeunload', this.onWindowUnload);
}
- render({ id }: Props) {
+ render({ id }: Props, { zmodem }: State) {
return (
(this.container = c)}>
- (this.zmodemAddon = c)} sender={this.sendData} writer={this.writeData} />
+ {zmodem && }
);
}
@@ -132,6 +140,12 @@ export class Xterm extends Component {
socket.send(textEncoder.encode(Command.RESUME));
}
+ @bind
+ private zmodemCb(addon: ZmodemAddon) {
+ this.terminal.loadAddon(addon);
+ this.writeFunc = (data: ArrayBuffer) => addon.consume(data);
+ }
+
@bind
private sendData(data: string | Uint8Array) {
const { socket, textEncoder } = this;
@@ -190,7 +204,6 @@ export class Xterm extends Component {
terminal.loadAddon(fitAddon);
terminal.loadAddon(overlayAddon);
terminal.loadAddon(new WebLinksAddon());
- terminal.loadAddon(this.zmodemAddon);
terminal.loadAddon(new ImageAddon(imageWorkerUrl));
terminal.onTitleChange(data => {
@@ -308,9 +321,8 @@ export class Xterm extends Component {
}
@bind
- private applyOptions(options: ITerminalOptions) {
+ private applyOptions(options: Options) {
const { terminal, fitAddon } = this;
-
Object.keys(options).forEach(key => {
const value = options[key];
switch (key) {
@@ -336,6 +348,12 @@ export class Xterm extends Component {
this.doReconnect = false;
}
break;
+ case 'enableZmodem':
+ if (value) {
+ this.setState({ zmodem: true });
+ console.log(`[ttyd] Zmodem enabled`);
+ }
+ break;
case 'titleFixed':
if (!value || value === '') return;
console.log(`[ttyd] setting fixed title: ${value}`);
@@ -417,14 +435,14 @@ export class Xterm extends Component {
@bind
private onSocketData(event: MessageEvent) {
- const { textDecoder, zmodemAddon } = this;
+ const { textDecoder } = this;
const rawData = event.data as ArrayBuffer;
const cmd = String.fromCharCode(new Uint8Array(rawData)[0]);
const data = rawData.slice(1);
switch (cmd) {
case Command.OUTPUT:
- zmodemAddon.consume(data);
+ this.writeFunc(data);
break;
case Command.SET_WINDOW_TITLE:
this.title = textDecoder.decode(data);
@@ -432,8 +450,7 @@ export class Xterm extends Component {
break;
case Command.SET_PREFERENCES:
const prefs = JSON.parse(textDecoder.decode(data));
- const options = Object.assign({}, this.props.clientOptions, prefs) as ITerminalOptions;
- this.applyOptions(options);
+ this.applyOptions({ ...this.props.clientOptions, ...prefs } as Options);
break;
default:
console.warn(`[ttyd] unknown command: ${cmd}`);
diff --git a/html/src/components/zmodem/index.tsx b/html/src/components/zmodem/index.tsx
index 7850bf3..6022950 100644
--- a/html/src/components/zmodem/index.tsx
+++ b/html/src/components/zmodem/index.tsx
@@ -7,6 +7,7 @@ import * as Zmodem from 'zmodem.js/src/zmodem_browser';
import { Modal } from '../modal';
interface Props {
+ callback: (addon: ZmodemAddon) => void;
sender: (data: string | Uint8Array) => void;
writer: (data: string | Uint8Array) => void;
}
@@ -27,7 +28,7 @@ export class ZmodemAddon extends Component implements ITerminalAdd
this.zmodemInit();
}
- render(_, { modal }: State) {
+ render(_: Props, { modal }: State) {
return (