Move 3 render layers to browser

src/browser/renderer/LinkRenderLayer.ts

@@ -4,14 +4,14 @@
  */
 
 import { IRenderDimensions } from 'browser/renderer/Types';
-import { BaseRenderLayer } from '../browser/renderer/BaseRenderLayer';
+import { BaseRenderLayer } from './BaseRenderLayer';
 import { INVERTED_DEFAULT_COLOR } from 'browser/renderer/atlas/Constants';
 import { is256Color } from 'browser/renderer/atlas/CharAtlasUtils';
 import { IColorSet, ILinkifierEvent, ILinkifier } from 'browser/Types';
 import { IBufferService, IOptionsService } from 'common/services/Services';
 
 export class LinkRenderLayer extends BaseRenderLayer {
-  private _state: ILinkifierEvent = null;
+  private _state: ILinkifierEvent | undefined;
 
   constructor(
     container: HTMLElement,
@@ -30,7 +30,7 @@ export class LinkRenderLayer extends BaseRenderLayer {
   public resize(dim: IRenderDimensions): void {
     super.resize(dim);
     // Resizing the canvas discards the contents of the canvas so clear state
-    this._state = null;
+    this._state = undefined;
   }
 
   public reset(): void {
@@ -45,14 +45,14 @@ export class LinkRenderLayer extends BaseRenderLayer {
         this._clearCells(0, this._state.y1 + 1, this._state.cols, middleRowCount);
       }
       this._clearCells(0, this._state.y2, this._state.x2, 1);
-      this._state = null;
+      this._state = undefined;
     }
   }
 
   private _onLinkHover(e: ILinkifierEvent): void {
     if (e.fg === INVERTED_DEFAULT_COLOR) {
       this._ctx.fillStyle = this._colors.background.css;
-    } else if (is256Color(e.fg)) {
+    } else if (e.fg && is256Color(e.fg)) {
       // 256 color support
       this._ctx.fillStyle = this._colors.ansi[e.fg].css;
     } else {

src/browser/renderer/SelectionRenderLayer.ts

@@ -9,14 +9,14 @@ import { IColorSet } from 'browser/Types';
 import { IBufferService, IOptionsService } from 'common/services/Services';
 
 interface ISelectionState {
-  start: [number, number];
-  end: [number, number];
-  columnSelectMode: boolean;
-  ydisp: number;
+  start?: [number, number];
+  end?: [number, number];
+  columnSelectMode?: boolean;
+  ydisp?: number;
 }
 
 export class SelectionRenderLayer extends BaseRenderLayer {
-  private _state: ISelectionState;
+  private _state!: ISelectionState;
 
   constructor(
     container: HTMLElement,
@@ -32,10 +32,10 @@ export class SelectionRenderLayer extends BaseRenderLayer {
 
   private _clearState(): void {
     this._state = {
-      start: null,
-      end: null,
-      columnSelectMode: null,
-      ydisp: null
+      start: undefined,
+      end: undefined,
+      columnSelectMode: undefined,
+      ydisp: undefined
     };
   }
 
@@ -117,7 +117,7 @@ export class SelectionRenderLayer extends BaseRenderLayer {
       ydisp !== this._state.ydisp;
   }
 
-  private _areCoordinatesEqual(coord1: [number, number], coord2: [number, number]): boolean {
+  private _areCoordinatesEqual(coord1: [number, number] | undefined, coord2: [number, number] | undefined): boolean {
     if (!coord1 || !coord2) {
       return false;
     }

src/browser/renderer/TextRenderLayer.ts

@@ -23,8 +23,8 @@ import { IOptionsService, IBufferService } from 'common/services/Services';
 
 export class TextRenderLayer extends BaseRenderLayer {
   private _state: GridCache<CharData>;
-  private _characterWidth: number;
-  private _characterFont: string;
+  private _characterWidth: number = 0;
+  private _characterFont: string = '';
   private _characterOverlapCache: { [key: string]: boolean } = {};
   private _characterJoinerRegistry: ICharacterJoinerRegistry;
   private _workCell = new CellData();
@@ -79,7 +79,7 @@ export class TextRenderLayer extends BaseRenderLayer {
       const line = this._bufferService.buffer.lines.get(row);
       const joinedRanges = joinerRegistry ? joinerRegistry.getJoinedCharacters(row) : [];
       for (let x = 0; x < this._bufferService.cols; x++) {
-        line.loadCell(x, this._workCell);
+        line!.loadCell(x, this._workCell);
         let cell = this._workCell;
 
         // If true, indicates that the current character(s) to draw were joined.
@@ -97,14 +97,14 @@ export class TextRenderLayer extends BaseRenderLayer {
         // and attributes of our input.
         if (joinedRanges.length > 0 && x === joinedRanges[0][0]) {
           isJoined = true;
-          const range = joinedRanges.shift();
+          const range = joinedRanges.shift()!;
 
           // We already know the exact start and end column of the joined range,
           // so we get the string and width representing it directly
 
           cell = new JoinedCellData(
             this._workCell,
-            line.translateToString(true, range[0], range[1]),
+            line!.translateToString(true, range[0], range[1]),
             range[1] - range[0]
           );
 
@@ -124,7 +124,7 @@ export class TextRenderLayer extends BaseRenderLayer {
           // get removed, and `a` would not re-render because it thinks it's
           // already in the correct state.
           // this._state.cache[x][y] = OVERLAP_OWNED_CHAR_DATA;
-          if (lastCharX < line.length - 1 && line.getCodePoint(lastCharX + 1) === NULL_CELL_CODE) {
+          if (lastCharX < line!.length - 1 && line!.getCodePoint(lastCharX + 1) === NULL_CELL_CODE) {
             // patch width to 2
             cell.content &= ~Content.WIDTH_MASK;
             cell.content |= 2 << Content.WIDTH_SHIFT;
@@ -184,15 +184,17 @@ export class TextRenderLayer extends BaseRenderLayer {
         // don't need to draw anything.
         startX = x;
         startY = y;
-      } if (y !== startY) {
+      }
+
+      if (y !== startY) {
         // our row changed, draw the previous row
-        ctx.fillStyle = prevFillStyle;
+        ctx.fillStyle = prevFillStyle ? prevFillStyle : '';
         this._fillCells(startX, startY, cols - startX, 1);
         startX = x;
         startY = y;
       } else if (prevFillStyle !== nextFillStyle) {
         // our color changed, draw the previous characters in this row
-        ctx.fillStyle = prevFillStyle;
+        ctx.fillStyle = prevFillStyle ? prevFillStyle : '';
         this._fillCells(startX, startY, x - startX, 1);
         startX = x;
         startY = y;

src/renderer/Renderer.ts

@@ -3,12 +3,12 @@
  * @license MIT
  */
 
-import { TextRenderLayer } from './TextRenderLayer';
-import { SelectionRenderLayer } from './SelectionRenderLayer';
+import { TextRenderLayer } from '../browser/renderer/TextRenderLayer';
+import { SelectionRenderLayer } from '../browser/renderer/SelectionRenderLayer';
 import { CursorRenderLayer } from './CursorRenderLayer';
 import { IRenderLayer, IRenderer, IRenderDimensions, CharacterJoinerHandler, ICharacterJoinerRegistry } from 'browser/renderer/Types';
 import { ITerminal } from '../Types';
-import { LinkRenderLayer } from './LinkRenderLayer';
+import { LinkRenderLayer } from '../browser/renderer/LinkRenderLayer';
 import { CharacterJoinerRegistry } from 'browser/renderer/CharacterJoinerRegistry';
 import { Disposable } from 'common/Lifecycle';
 import { IColorSet } from 'browser/Types';