Upgrade xterm.js to v3.15.0-beta70. (#457)

FluentTerminal.Client/src/attach/Interfaces.ts

@@ -1,23 +0,0 @@
-/**
- * Copyright (c) 2018 The xterm.js authors. All rights reserved.
- * @license MIT
- *
- * Implements the attach method, that attaches the terminal to a WebSocket stream.
- */
-
-import { Terminal, IDisposable } from 'xterm';
-
-export interface IAttachAddonTerminal extends Terminal {
-  _core: {
-    register<T extends IDisposable>(d: T): void;
-  };
-
-  __socket?: WebSocket;
-  __attachSocketBuffer?: string;
-  __dataListener?: IDisposable;
-
-  __getMessage?(ev: MessageEvent): void;
-  __flushBuffer?(): void;
-  __pushToBuffer?(data: string): void;
-  __sendData?(data: string): void;
-}

FluentTerminal.Client/src/attach/attach.ts

@@ -1,120 +0,0 @@
-/**
- * Copyright (c) 2014 The xterm.js authors. All rights reserved.
- * @license MIT
- *
- * Implements the attach method, that attaches the terminal to a WebSocket stream.
- * Modified to use writeUtf8
- */
-
-import { Terminal, IDisposable } from 'xterm';
-import { IAttachAddonTerminal } from './Interfaces';
-
-/**
- * Attaches the given terminal to the given socket.
- *
- * @param term The terminal to be attached to the given socket.
- * @param socket The socket to attach the current terminal.
- * @param bidirectional Whether the terminal should send data to the socket as well.
- * @param buffered Whether the rendering of incoming data should happen instantly or at a maximum
- * frequency of 1 rendering per 10ms.
- */
-export function attach(term: Terminal, socket: WebSocket, bidirectional: boolean, buffered: boolean): void {
-  const addonTerminal = <IAttachAddonTerminal>term;
-  bidirectional = (typeof bidirectional === 'undefined') ? true : bidirectional;
-  addonTerminal.__socket = socket;
-
-  addonTerminal.__flushBuffer = () => {
-    addonTerminal.write(addonTerminal.__attachSocketBuffer);
-    addonTerminal.__attachSocketBuffer = null;
-  };
-
-  addonTerminal.__pushToBuffer = (data: string) => {
-    if (addonTerminal.__attachSocketBuffer) {
-      addonTerminal.__attachSocketBuffer += data;
-    } else {
-      addonTerminal.__attachSocketBuffer = data;
-      setTimeout(addonTerminal.__flushBuffer, 10);
-    }
-  };
-
-  addonTerminal.__getMessage = function(ev: MessageEvent): void {
-    if (ev.data instanceof ArrayBuffer) {
-        addonTerminal.writeUtf8(new Uint8Array(ev.data));
-    }
-  };
-
-  addonTerminal.__sendData = (data: string) => {
-    if (socket.readyState !== 1) {
-      return;
-    }
-    socket.send(data);
-  };
-
-  addonTerminal._core.register(addSocketListener(socket, 'message', addonTerminal.__getMessage));
-
-  if (bidirectional) {
-    addonTerminal.__dataListener = addonTerminal.onData(addonTerminal.__sendData);
-    addonTerminal._core.register(addonTerminal.__dataListener);
-  }
-
-  addonTerminal._core.register(addSocketListener(socket, 'close', () => detach(addonTerminal, socket)));
-  addonTerminal._core.register(addSocketListener(socket, 'error', () => detach(addonTerminal, socket)));
-}
-
-function addSocketListener(socket: WebSocket, type: string, handler: (this: WebSocket, ev: Event) => any): IDisposable {
-  socket.addEventListener(type, handler);
-  return {
-    dispose: () => {
-      if (!handler) {
-        // Already disposed
-        return;
-      }
-      socket.removeEventListener(type, handler);
-      handler = null;
-    }
-  };
-}
-
-/**
- * Detaches the given terminal from the given socket
- *
- * @param term The terminal to be detached from the given socket.
- * @param socket The socket from which to detach the current terminal.
- */
-export function detach(term: Terminal, socket: WebSocket): void {
-  const addonTerminal = <IAttachAddonTerminal>term;
-  addonTerminal.__dataListener.dispose();
-  addonTerminal.__dataListener = undefined;
-
-  socket = (typeof socket === 'undefined') ? addonTerminal.__socket : socket;
-
-  if (socket) {
-    socket.removeEventListener('message', addonTerminal.__getMessage);
-  }
-
-  delete addonTerminal.__socket;
-}
-
-
-export function apply(terminalConstructor: typeof Terminal): void {
-  /**
-   * Attaches the current terminal to the given socket
-   *
-   * @param socket The socket to attach the current terminal.
-   * @param bidirectional Whether the terminal should send data to the socket as well.
-   * @param buffered Whether the rendering of incoming data should happen instantly or at a maximum
-   * frequency of 1 rendering per 10ms.
-   */
-  (<any>terminalConstructor.prototype).attach = function (socket: WebSocket, bidirectional: boolean, buffered: boolean): void {
-    attach(this, socket, bidirectional, buffered);
-  };
-
-  /**
-   * Detaches the current terminal from the given socket.
-   *
-   * @param socket The socket from which to detach the current terminal.
-   */
-  (<any>terminalConstructor.prototype).detach = function (socket: WebSocket): void {
-    detach(this, socket);
-  };
-}

FluentTerminal.Client/src/index.ts

@@ -1,7 +1,7 @@
 import { Terminal, ITerminalOptions } from 'xterm';
-import * as attach from "./attach/attach";
-import * as fit from "xterm/lib/addons/fit/fit";
-import * as search from "xterm/lib/addons/search/search";
+import { AttachAddon } from 'xterm-addon-attach';
+import { FitAddon } from 'xterm-addon-fit';
+import { SearchAddon } from 'xterm-addon-search';
 
 interface ExtendedWindow extends Window {
   keyBindings: any[];
@@ -19,11 +19,9 @@ interface ExtendedWindow extends Window {
 
 declare var window: ExtendedWindow;
 
-Terminal.applyAddon(attach);
-Terminal.applyAddon(fit);
-Terminal.applyAddon(search);
-
 let term: any;
+let fitAddon: any;
+let searchAddon: any;
 let socket: WebSocket;
 const terminalContainer = document.getElementById('terminal-container');
 
@@ -52,12 +50,16 @@ window.createTerminal = (options, theme, keyBindings) => {
     allowTransparency: true,
     theme: theme,
     windowsMode: true,
-    experimentalCharAtlas: "dynamic",
     wordSeparator: ' ()[]{}\'":;'
   };
 
   term = new Terminal(terminalOptions);
 
+  searchAddon = new SearchAddon();
+  term.loadAddon(searchAddon);
+  fitAddon = new FitAddon();
+  term.loadAddon(fitAddon);
+
   window.term = term;
 
   term.onResize(({ cols, rows }) => {
@@ -73,7 +75,7 @@ window.createTerminal = (options, theme, keyBindings) => {
   });
 
   term.open(terminalContainer);
-  term.fit();
+  fitAddon.fit();
   term.focus();
 
   setPadding(options.padding);
@@ -81,7 +83,7 @@ window.createTerminal = (options, theme, keyBindings) => {
   let resizeTimeout: any;
   window.onresize = function () {
     clearTimeout(resizeTimeout);
-    resizeTimeout = setTimeout(term.fit(), 500);
+    resizeTimeout = setTimeout(fitAddon.fit(), 500);
   }
 
   window.onmouseup = function (e) {
@@ -93,6 +95,9 @@ window.createTerminal = (options, theme, keyBindings) => {
   }
 
   term.attachCustomKeyEventHandler(function (e) {
+    if (e.type != "keydown"){
+      return true;
+    }
     for (var i = 0; i < window.keyBindings.length; i++) {
       var keyBinding = window.keyBindings[i];
       if (keyBinding.ctrl == e.ctrlKey
@@ -131,7 +136,7 @@ window.createTerminal = (options, theme, keyBindings) => {
 }
 
 function attachTerminal() {
-  term.attach(socket);
+  term.loadAddon(new AttachAddon(socket, {inputUtf8: true}));
   term._initialized = true;
 }
 
@@ -177,7 +182,7 @@ function setScrollBarStyle(scrollBarStyle) {
 
 function setPadding(padding) {
   document.querySelector('.terminal')["style"].padding = padding + 'px';
-  term.fit();
+  fitAddon.fit();
 }
 
 window.changeKeyBindings = (keyBindings) => {
@@ -186,11 +191,11 @@ window.changeKeyBindings = (keyBindings) => {
 }
 
 window.findNext = (content: string) => {
-  term.findNext(content);
+  searchAddon.findNext(content);
 }
 
 window.findPrevious = (content: string) => {
-  term.findPrevious(content);
+  searchAddon.findPrevious(content);
 }
 
 document.oncontextmenu = function () {