Merge b79d73d into 739723f

demo/client.ts

@@ -211,11 +211,11 @@ function initOptions(term: TerminalType): void {
     bellSound: null,
     bellStyle: ['none', 'sound'],
     cursorStyle: ['block', 'underline', 'bar'],
-    experimentalCharAtlas: ['none', 'static', 'dynamic'],
+    experimentalCharAtlas: ['none', 'static', 'dynamic', 'webgl'],
     fontFamily: null,
     fontWeight: ['normal', 'bold', '100', '200', '300', '400', '500', '600', '700', '800', '900'],
     fontWeightBold: ['normal', 'bold', '100', '200', '300', '400', '500', '600', '700', '800', '900'],
-    rendererType: ['dom', 'canvas']
+    rendererType: ['dom', 'canvas', 'webgl']
   };
   const options = Object.keys((<any>term)._core.options);
   const booleanOptions = [];
@@ -283,6 +283,10 @@ function initOptions(term: TerminalType): void {
     const input = <HTMLInputElement>document.getElementById(`opt-${o}`);
     addDomListener(input, 'change', () => {
       console.log('change', o, input.value);
+      if (o === 'rendererType' && input.value === 'webgl') {
+        term.setOption('experimentalCharAtlas', 'webgl');
+        setTimeout(() => (<HTMLSelectElement>document.getElementById(`opt-experimentalCharAtlas`)).value = 'webgl', 0);
+      }
       term.setOption(o, input.value);
     });
   });

src/Terminal.ts

@@ -817,10 +817,16 @@ export class Terminal extends EventEmitter implements ITerminal, IDisposable, II
 
   }
 
+  public setRenderer(renderer: IRenderer): void {
+    this._renderCoordinator.setRenderer(renderer);
+    // this._renderCoordinator.onOptionsChanged();
+    this.refresh(0, this.rows - 1);
+  }
+
   private _createRenderer(): IRenderer {
     switch (this.options.rendererType) {
-      case 'canvas': return new Renderer(this, this._colorManager.colors); break;
-      case 'dom': return new DomRenderer(this, this._colorManager.colors); break;
+      case 'canvas': return new Renderer(this, this._colorManager.colors);
+      case 'dom': return new DomRenderer(this, this._colorManager.colors);
       default: throw new Error(`Unrecognized rendererType "${this.options.rendererType}"`);
     }
   }

src/TestUtils.test.ts

@@ -22,6 +22,9 @@ export class TestTerminal extends Terminal {
 }
 
 export class MockTerminal implements ITerminal {
+  setRenderer(renderer: any): void {
+    throw new Error('Method not implemented.');
+  }
   onCursorMove: IEvent<void>;
   onLineFeed: IEvent<void>;
   onSelectionChange: IEvent<void>;

src/Types.ts

@@ -270,6 +270,7 @@ export interface IPublicTerminal extends IDisposable, IEventEmitter {
   setOption(key: string, value: any): void;
   refresh(start: number, end: number): void;
   reset(): void;
+  setRenderer(renderer: any): void;
 }
 
 export interface IBufferAccessor {
@@ -358,6 +359,7 @@ export interface IBufferSet {
 
 export interface ISelectionManager {
   selectionText: string;
+  hasSelection: boolean;
   selectionStart: [number, number];
   selectionEnd: [number, number];
 

src/core/buffer/BufferLine.ts

@@ -2,12 +2,24 @@
  * Copyright (c) 2018 The xterm.js authors. All rights reserved.
  * @license MIT
  */
+
 import { CharData, IBufferLine, ICellData, IColorRGB, IAttributeData } from '../Types';
 import { stringFromCodePoint } from '../input/TextDecoder';
 import { DEFAULT_COLOR } from '../../common/Types';
 
 export const DEFAULT_ATTR = (0 << 18) | (DEFAULT_COLOR << 9) | (256 << 0);
 
+// TODO: This is duplicated from renderer, should be removed after chardata workaround is fixed
+export const enum FLAGS {
+  BOLD = 1,
+  UNDERLINE = 2,
+  BLINK = 4,
+  INVERSE = 8,
+  INVISIBLE = 16,
+  DIM = 32,
+  ITALIC = 64
+}
+
 export const CHAR_DATA_ATTR_INDEX = 0;
 export const CHAR_DATA_CHAR_INDEX = 1;
 export const CHAR_DATA_WIDTH_INDEX = 2;
@@ -345,8 +357,26 @@ export class BufferLine implements IBufferLine {
   public get(index: number): CharData {
     const content = this._data[index * CELL_SIZE + Cell.CONTENT];
     const cp = content & Content.CODEPOINT_MASK;
+
+    // TODO: Need to move WebGL over to the new system and remove this block
+    const cell = new CellData();
+    this.loadCell(index, cell);
+    const oldBg = cell.getBgColor() === -1 ? 256 : cell.getBgColor();
+    const oldFg = cell.getFgColor() === -1 ? 256 : cell.getFgColor();
+    const oldAttr =
+      (cell.isBold() ? FLAGS.BOLD : 0) |
+      (cell.isUnderline() ? FLAGS.UNDERLINE : 0) |
+      (cell.isBlink() ? FLAGS.BLINK : 0) |
+      (cell.isInverse() ? FLAGS.INVERSE : 0) |
+      (cell.isDim() ? FLAGS.DIM : 0) |
+      (cell.isItalic() ? FLAGS.ITALIC : 0);
+    const attrCompat =
+      oldBg |
+      (oldFg << 9) |
+      (oldAttr << 18);
+
     return [
-      this._data[index * CELL_SIZE + Cell.FG],
+      attrCompat,
       (content & Content.IS_COMBINED_MASK)
         ? this._combined[index]
         : (cp) ? stringFromCodePoint(cp) : '',

src/public/Terminal.ts

@@ -10,6 +10,7 @@ import { Terminal as TerminalCore } from '../Terminal';
 import * as Strings from '../Strings';
 import { IEvent } from '../common/EventEmitter2';
 import { AddonManager } from './AddonManager';
+import { WebglRendererAddon } from '../renderer/webgl/WebglRendererAddon';
 
 export class Terminal implements ITerminalApi {
   private _core: ITerminal;
@@ -31,6 +32,7 @@ export class Terminal implements ITerminalApi {
   public get onResize(): IEvent<{ cols: number, rows: number }> { return this._core.onResize; }
 
   public get element(): HTMLElement { return this._core.element; }
+  public get screenElement(): HTMLElement { return this._core.screenElement; }
   public get textarea(): HTMLTextAreaElement { return this._core.textarea; }
   public get rows(): number { return this._core.rows; }
   public get cols(): number { return this._core.cols; }
@@ -183,6 +185,12 @@ export class Terminal implements ITerminalApi {
   public loadAddon(addon: ITerminalAddon): void {
     return this._addonManager.loadAddon(this, addon);
   }
+  public setRenderer(renderer: any): void {
+    this._core.setRenderer(renderer);
+  }
+  public loadWebgl(preserveDrawingBuffer?: boolean): void {
+    this.loadAddon(new WebglRendererAddon(preserveDrawingBuffer));
+  }
   public static get strings(): ILocalizableStrings {
     return Strings;
   }

src/renderer/LinkRenderLayer.ts

@@ -15,6 +15,7 @@ export class LinkRenderLayer extends BaseRenderLayer {
 
   constructor(container: HTMLElement, zIndex: number, colors: IColorSet, terminal: ILinkifierAccessor) {
     super(container, 'link', zIndex, true, colors);
+    // TODO: Need to expose link-related renderer API
     terminal.linkifier.onLinkHover(e => this._onLinkHover(e));
     terminal.linkifier.onLinkLeave(e => this._onLinkLeave(e));
   }

src/renderer/atlas/Types.ts

@@ -22,7 +22,7 @@ export interface IGlyphIdentifier {
 }
 
 export interface ICharAtlasConfig {
-  type: 'none' | 'static' | 'dynamic';
+  type: 'none' | 'static' | 'dynamic' | 'webgl';
   devicePixelRatio: number;
   fontSize: number;
   fontFamily: string;

src/renderer/dom/DomRenderer.ts

@@ -69,6 +69,7 @@ export class DomRenderer extends Disposable implements IRenderer {
       actualCellHeight: null
     };
     this._updateDimensions();
+    this._injectCss();
 
     this._rowFactory = new DomRendererRowFactory(_terminal.options, document);
 

src/renderer/webgl/ColorUtils.ts

@@ -0,0 +1,14 @@
+/**
+ * @license MIT
+ * Copyright (c) 2018 The xterm.js authors. All rights reserved.
+ */
+
+import { IColor } from 'xterm';
+
+export function getLuminance(color: IColor): number {
+  // Coefficients taken from: https://www.w3.org/TR/AERT/#color-contrast
+  const r = color.rgba >> 24 & 0xff;
+  const g = color.rgba >> 16 & 0xff;
+  const b = color.rgba >> 8 & 0xff;
+  return (0.299 * r + 0.587 * g + 0.114 * b) / 255;
+}