Merge commit 'fa70aa0983947e4444bcc9c1eeaaa516c1f88fe8' into webgl2

This commit is contained in:
Daniel Imms
2019-05-18 14:23:40 -07:00
34 changed files with 722 additions and 195 deletions
+6 -6
View File
@@ -3,19 +3,19 @@
* @license MIT
*/
import { ILinkHoverEvent, ITerminal, ILinkifierAccessor, LinkHoverEventTypes } from '../Types';
import { ILinkifierEvent, ITerminal, ILinkifierAccessor } from '../Types';
import { IColorSet, IRenderDimensions } from './Types';
import { BaseRenderLayer } from './BaseRenderLayer';
import { INVERTED_DEFAULT_COLOR } from './atlas/Types';
import { is256Color } from './atlas/CharAtlasUtils';
export class LinkRenderLayer extends BaseRenderLayer {
private _state: ILinkHoverEvent = null;
private _state: ILinkifierEvent = null;
constructor(container: HTMLElement, zIndex: number, colors: IColorSet, terminal: ILinkifierAccessor) {
super(container, 'link', zIndex, true, colors);
terminal.linkifier.on(LinkHoverEventTypes.HOVER, (e: ILinkHoverEvent) => this._onLinkHover(e));
terminal.linkifier.on(LinkHoverEventTypes.LEAVE, (e: ILinkHoverEvent) => this._onLinkLeave(e));
terminal.linkifier.onLinkHover(e => this._onLinkHover(e));
terminal.linkifier.onLinkLeave(e => this._onLinkLeave(e));
}
public resize(terminal: ITerminal, dim: IRenderDimensions): void {
@@ -40,7 +40,7 @@ export class LinkRenderLayer extends BaseRenderLayer {
}
}
private _onLinkHover(e: ILinkHoverEvent): void {
private _onLinkHover(e: ILinkifierEvent): void {
if (e.fg === INVERTED_DEFAULT_COLOR) {
this._ctx.fillStyle = this._colors.background.css;
} else if (is256Color(e.fg)) {
@@ -64,7 +64,7 @@ export class LinkRenderLayer extends BaseRenderLayer {
this._state = e;
}
private _onLinkLeave(e: ILinkHoverEvent): void {
private _onLinkLeave(e: ILinkifierEvent): void {
this._clearCurrentLink();
}
}
+10 -4
View File
@@ -10,13 +10,14 @@ import { ColorManager } from './ColorManager';
import { IRenderLayer, IColorSet, IRenderer, IRenderDimensions, ICharacterJoinerRegistry } from './Types';
import { ITerminal, CharacterJoinerHandler } from '../Types';
import { LinkRenderLayer } from './LinkRenderLayer';
import { EventEmitter } from '../common/EventEmitter';
import { RenderDebouncer } from '../ui/RenderDebouncer';
import { ScreenDprMonitor } from '../ui/ScreenDprMonitor';
import { ITheme } from 'xterm';
import { CharacterJoinerRegistry } from '../renderer/CharacterJoinerRegistry';
import { EventEmitter2, IEvent } from '../common/EventEmitter2';
import { Disposable } from '../common/Lifecycle';
export class Renderer extends EventEmitter implements IRenderer {
export class Renderer extends Disposable implements IRenderer {
private _renderDebouncer: RenderDebouncer;
private _renderLayers: IRenderLayer[];
@@ -29,6 +30,11 @@ export class Renderer extends EventEmitter implements IRenderer {
public colorManager: ColorManager;
public dimensions: IRenderDimensions;
private _onCanvasResize = new EventEmitter2<{ width: number, height: number }>();
public get onCanvasResize(): IEvent<{ width: number, height: number }> { return this._onCanvasResize.event; }
private _onRender = new EventEmitter2<{ start: number, end: number }>();
public get onRender(): IEvent<{ start: number, end: number }> { return this._onRender.event; }
constructor(private _terminal: ITerminal, theme: ITheme) {
super();
const allowTransparency = this._terminal.options.allowTransparency;
@@ -134,7 +140,7 @@ export class Renderer extends EventEmitter implements IRenderer {
this._terminal.screenElement.style.width = `${this.dimensions.canvasWidth}px`;
this._terminal.screenElement.style.height = `${this.dimensions.canvasHeight}px`;
this.emit('resize', {
this._onCanvasResize.fire({
width: this.dimensions.canvasWidth,
height: this.dimensions.canvasHeight
});
@@ -197,7 +203,7 @@ export class Renderer extends EventEmitter implements IRenderer {
*/
private _renderRows(start: number, end: number): void {
this._renderLayers.forEach(l => l.onGridChanged(this._terminal, start, end));
this._terminal.emit('refresh', { start, end });
this._onRender.fire({ start, end });
}
/**
+6 -2
View File
@@ -4,7 +4,8 @@
*/
import { ITerminal, CharacterJoinerHandler } from '../Types';
import { IEventEmitter, ITheme, IDisposable } from 'xterm';
import { ITheme, IDisposable } from 'xterm';
import { IEvent } from '../common/EventEmitter2';
/**
* Flags used to render terminal text properly.
@@ -23,10 +24,13 @@ export const enum FLAGS {
* Note that IRenderer implementations should emit the refresh event after
* rendering rows to the screen.
*/
export interface IRenderer extends IEventEmitter, IDisposable {
export interface IRenderer extends IDisposable {
dimensions: IRenderDimensions;
colorManager: IColorManager;
onCanvasResize: IEvent<{ width: number, height: number }>;
onRender: IEvent<{ start: number, end: number }>;
dispose(): void;
setTheme(theme: ITheme): IColorSet;
onWindowResize(devicePixelRatio: number): void;
+18 -8
View File
@@ -4,13 +4,14 @@
*/
import { IRenderer, IRenderDimensions, IColorSet } from '../Types';
import { ILinkHoverEvent, ITerminal, CharacterJoinerHandler, LinkHoverEventTypes } from '../../Types';
import { ILinkifierEvent, ITerminal, CharacterJoinerHandler } from '../../Types';
import { ITheme } from 'xterm';
import { EventEmitter } from '../../common/EventEmitter';
import { ColorManager } from '../ColorManager';
import { RenderDebouncer } from '../../ui/RenderDebouncer';
import { BOLD_CLASS, ITALIC_CLASS, CURSOR_CLASS, CURSOR_STYLE_BLOCK_CLASS, CURSOR_BLINK_CLASS, CURSOR_STYLE_BAR_CLASS, CURSOR_STYLE_UNDERLINE_CLASS, DomRendererRowFactory } from './DomRendererRowFactory';
import { INVERTED_DEFAULT_COLOR } from '../atlas/Types';
import { EventEmitter2, IEvent } from '../../common/EventEmitter2';
import { Disposable } from '../../common/Lifecycle';
const TERMINAL_CLASS_PREFIX = 'xterm-dom-renderer-owner-';
const ROW_CONTAINER_CLASS = 'xterm-rows';
@@ -29,7 +30,7 @@ let nextTerminalId = 1;
* particularly fast or feature complete, more just stable and usable for when
* canvas is not an option.
*/
export class DomRenderer extends EventEmitter implements IRenderer {
export class DomRenderer extends Disposable implements IRenderer {
private _renderDebouncer: RenderDebouncer;
private _rowFactory: DomRendererRowFactory;
private _terminalClass: number = nextTerminalId++;
@@ -43,6 +44,11 @@ export class DomRenderer extends EventEmitter implements IRenderer {
public dimensions: IRenderDimensions;
public colorManager: ColorManager;
private _onCanvasResize = new EventEmitter2<{ width: number, height: number }>();
public get onCanvasResize(): IEvent<{ width: number, height: number }> { return this._onCanvasResize.event; }
private _onRender = new EventEmitter2<{ start: number, end: number }>();
public get onRender(): IEvent<{ start: number, end: number }> { return this._onRender.event; }
constructor(private _terminal: ITerminal, theme: ITheme | undefined) {
super();
const allowTransparency = this._terminal.options.allowTransparency;
@@ -81,8 +87,8 @@ export class DomRenderer extends EventEmitter implements IRenderer {
this._terminal.screenElement.appendChild(this._rowContainer);
this._terminal.screenElement.appendChild(this._selectionContainer);
this._terminal.linkifier.on(LinkHoverEventTypes.HOVER, (e: ILinkHoverEvent) => this._onLinkHover(e));
this._terminal.linkifier.on(LinkHoverEventTypes.LEAVE, (e: ILinkHoverEvent) => this._onLinkLeave(e));
this._terminal.linkifier.onLinkHover(e => this._onLinkHover(e));
this._terminal.linkifier.onLinkLeave(e => this._onLinkLeave(e));
}
public dispose(): void {
@@ -238,6 +244,10 @@ export class DomRenderer extends EventEmitter implements IRenderer {
public onResize(cols: number, rows: number): void {
this._refreshRowElements(cols, rows);
this._updateDimensions();
this._onCanvasResize.fire({
width: this.dimensions.canvasWidth,
height: this.dimensions.canvasHeight
});
}
public onCharSizeChanged(): void {
@@ -350,7 +360,7 @@ export class DomRenderer extends EventEmitter implements IRenderer {
rowElement.appendChild(this._rowFactory.createRow(lineData, row === cursorAbsoluteY, cursorStyle, cursorX, cursorBlink, this.dimensions.actualCellWidth, terminal.cols));
}
this._terminal.emit('refresh', {start, end});
this._onRender.fire({ start, end });
}
private get _terminalSelector(): string {
@@ -360,11 +370,11 @@ export class DomRenderer extends EventEmitter implements IRenderer {
public registerCharacterJoiner(handler: CharacterJoinerHandler): number { return -1; }
public deregisterCharacterJoiner(joinerId: number): boolean { return false; }
private _onLinkHover(e: ILinkHoverEvent): void {
private _onLinkHover(e: ILinkifierEvent): void {
this._setCellUnderline(e.x1, e.x2, e.y1, e.y2, e.cols, true);
}
private _onLinkLeave(e: ILinkHoverEvent): void {
private _onLinkLeave(e: ILinkifierEvent): void {
this._setCellUnderline(e.x1, e.x2, e.y1, e.y2, e.cols, false);
}
@@ -90,6 +90,16 @@ describe('DomRendererRowFactory', () => {
);
});
it('should add class for dim', () => {
const cell = CellData.fromCharData([0, 'a', 1, 'a'.charCodeAt(0)]);
cell.bg = DEFAULT_ATTR_DATA.bg | BgFlags.DIM;
lineData.setCell(0, cell);
const fragment = rowFactory.createRow(lineData, false, undefined, 0, false, 5, 20);
assert.equal(getFragmentHtml(fragment),
'<span class="xterm-dim">a</span>'
);
});
it('should add classes for 256 foreground colors', () => {
const cell = CellData.fromCharData([0, 'a', 1, 'a'.charCodeAt(0)]);
cell.fg |= Attributes.CM_P256;