From 2c9e711cae3fe9a9db90c4f0528885c85449da7c Mon Sep 17 00:00:00 2001 From: Daniel Imms <2193314+Tyriar@users.noreply.github.com> Date: Sat, 15 Oct 2022 13:48:48 -0700 Subject: [PATCH] Move all other refs in webgl over --- addons/xterm-addon-webgl/src/GlyphRenderer.ts | 18 ++-- .../src/RectangleRenderer.ts | 26 +++--- addons/xterm-addon-webgl/src/WebglRenderer.ts | 16 ++-- .../src/renderLayer/BaseRenderLayer.ts | 92 +++++++++---------- .../src/renderLayer/CursorRenderLayer.ts | 1 - 5 files changed, 76 insertions(+), 77 deletions(-) diff --git a/addons/xterm-addon-webgl/src/GlyphRenderer.ts b/addons/xterm-addon-webgl/src/GlyphRenderer.ts index 88475f18..4bce546a 100644 --- a/addons/xterm-addon-webgl/src/GlyphRenderer.ts +++ b/addons/xterm-addon-webgl/src/GlyphRenderer.ts @@ -204,15 +204,15 @@ export class GlyphRenderer extends Disposable { $glyph = this._atlas.getRasterizedGlyph(code, bg, fg, ext); } - $leftCellPadding = Math.floor((this._dimensions.scaledCellWidth - this._dimensions.scaledCharWidth) / 2); + $leftCellPadding = Math.floor((this._dimensions.device.cell.width - this._dimensions.device.char.width) / 2); if (bg !== lastBg && $glyph.offset.x > $leftCellPadding) { $clippedPixels = $glyph.offset.x - $leftCellPadding; // a_origin - array[$i ] = -($glyph.offset.x - $clippedPixels) + this._dimensions.scaledCharLeft; - array[$i + 1] = -$glyph.offset.y + this._dimensions.scaledCharTop; + array[$i ] = -($glyph.offset.x - $clippedPixels) + this._dimensions.device.char.left; + array[$i + 1] = -$glyph.offset.y + this._dimensions.device.char.top; // a_size - array[$i + 2] = ($glyph.size.x - $clippedPixels) / this._dimensions.scaledCanvasWidth; - array[$i + 3] = $glyph.size.y / this._dimensions.scaledCanvasHeight; + array[$i + 2] = ($glyph.size.x - $clippedPixels) / this._dimensions.device.canvas.width; + array[$i + 3] = $glyph.size.y / this._dimensions.device.canvas.height; // a_texcoord array[$i + 4] = $glyph.texturePositionClipSpace.x + $clippedPixels / this._atlas.cacheCanvas.width; array[$i + 5] = $glyph.texturePositionClipSpace.y; @@ -221,11 +221,11 @@ export class GlyphRenderer extends Disposable { array[$i + 7] = $glyph.sizeClipSpace.y; } else { // a_origin - array[$i ] = -$glyph.offset.x + this._dimensions.scaledCharLeft; - array[$i + 1] = -$glyph.offset.y + this._dimensions.scaledCharTop; + array[$i ] = -$glyph.offset.x + this._dimensions.device.char.left; + array[$i + 1] = -$glyph.offset.y + this._dimensions.device.char.top; // a_size - array[$i + 2] = $glyph.size.x / this._dimensions.scaledCanvasWidth; - array[$i + 3] = $glyph.size.y / this._dimensions.scaledCanvasHeight; + array[$i + 2] = $glyph.size.x / this._dimensions.device.canvas.width; + array[$i + 3] = $glyph.size.y / this._dimensions.device.canvas.height; // a_texcoord array[$i + 4] = $glyph.texturePositionClipSpace.x; array[$i + 5] = $glyph.texturePositionClipSpace.y; diff --git a/addons/xterm-addon-webgl/src/RectangleRenderer.ts b/addons/xterm-addon-webgl/src/RectangleRenderer.ts index ca5cb9a9..f45ae3df 100644 --- a/addons/xterm-addon-webgl/src/RectangleRenderer.ts +++ b/addons/xterm-addon-webgl/src/RectangleRenderer.ts @@ -176,8 +176,8 @@ export class RectangleRenderer extends Disposable { 0, 0, 0, - this._terminal.cols * this._dimensions.scaledCellWidth, - this._terminal.rows * this._dimensions.scaledCellHeight, + this._terminal.cols * this._dimensions.device.cell.width, + this._terminal.rows * this._dimensions.device.cell.height, this._bgFloat ); } @@ -265,21 +265,21 @@ export class RectangleRenderer extends Disposable { if (vertices.attributes.length < offset + 4) { vertices.attributes = expandFloat32Array(vertices.attributes, this._terminal.rows * this._terminal.cols * INDICES_PER_RECTANGLE); } - $x1 = startX * this._dimensions.scaledCellWidth; - $y1 = y * this._dimensions.scaledCellHeight; + $x1 = startX * this._dimensions.device.cell.width; + $y1 = y * this._dimensions.device.cell.height; $r = (($rgba >> 24) & 0xFF) / 255; $g = (($rgba >> 16) & 0xFF) / 255; $b = (($rgba >> 8 ) & 0xFF) / 255; $a = (!$isDefault && bg & BgFlags.DIM) ? DIM_OPACITY : 1; - this._addRectangle(vertices.attributes, offset, $x1, $y1, (endX - startX) * this._dimensions.scaledCellWidth, this._dimensions.scaledCellHeight, $r, $g, $b, $a); + this._addRectangle(vertices.attributes, offset, $x1, $y1, (endX - startX) * this._dimensions.device.cell.width, this._dimensions.device.cell.height, $r, $g, $b, $a); } private _addRectangle(array: Float32Array, offset: number, x1: number, y1: number, width: number, height: number, r: number, g: number, b: number, a: number): void { - array[offset ] = x1 / this._dimensions.scaledCanvasWidth; - array[offset + 1] = y1 / this._dimensions.scaledCanvasHeight; - array[offset + 2] = width / this._dimensions.scaledCanvasWidth; - array[offset + 3] = height / this._dimensions.scaledCanvasHeight; + array[offset ] = x1 / this._dimensions.device.canvas.width; + array[offset + 1] = y1 / this._dimensions.device.canvas.height; + array[offset + 2] = width / this._dimensions.device.canvas.width; + array[offset + 3] = height / this._dimensions.device.canvas.height; array[offset + 4] = r; array[offset + 5] = g; array[offset + 6] = b; @@ -287,10 +287,10 @@ export class RectangleRenderer extends Disposable { } private _addRectangleFloat(array: Float32Array, offset: number, x1: number, y1: number, width: number, height: number, color: Float32Array): void { - array[offset ] = x1 / this._dimensions.scaledCanvasWidth; - array[offset + 1] = y1 / this._dimensions.scaledCanvasHeight; - array[offset + 2] = width / this._dimensions.scaledCanvasWidth; - array[offset + 3] = height / this._dimensions.scaledCanvasHeight; + array[offset ] = x1 / this._dimensions.device.canvas.width; + array[offset + 1] = y1 / this._dimensions.device.canvas.height; + array[offset + 2] = width / this._dimensions.device.canvas.width; + array[offset + 3] = height / this._dimensions.device.canvas.height; array[offset + 4] = color[0]; array[offset + 5] = color[1]; array[offset + 6] = color[2]; diff --git a/addons/xterm-addon-webgl/src/WebglRenderer.ts b/addons/xterm-addon-webgl/src/WebglRenderer.ts index fbe4e5a5..70795dda 100644 --- a/addons/xterm-addon-webgl/src/WebglRenderer.ts +++ b/addons/xterm-addon-webgl/src/WebglRenderer.ts @@ -447,20 +447,20 @@ export class WebglRenderer extends Disposable implements IRenderer { return; } - // Calculate the scaled character width. Width is floored as it must be drawn to an integer grid + // Calculate the device character width. Width is floored as it must be drawn to an integer grid // in order for the char atlas glyphs to not be blurry. this.dimensions.scaledCharWidth = Math.floor((this._core as any)._charSizeService.width * this._devicePixelRatio); this.dimensions.device.char.width = Math.floor((this._core as any)._charSizeService.width * this._devicePixelRatio); - // Calculate the scaled character height. Height is ceiled in case devicePixelRatio is a + // Calculate the device character height. Height is ceiled in case devicePixelRatio is a // floating point number in order to ensure there is enough space to draw the character to the // cell. this.dimensions.scaledCharHeight = Math.ceil((this._core as any)._charSizeService.height * this._devicePixelRatio); this.dimensions.device.char.height = Math.ceil((this._core as any)._charSizeService.height * this._devicePixelRatio); - // Calculate the scaled cell height, if lineHeight is _not_ 1, the resulting value will be - // floored since lineHeight can never be lower then 1, this guarentees the scaled cell height - // will always be larger than scaled char height. + // Calculate the device cell height, if lineHeight is _not_ 1, the resulting value will be + // floored since lineHeight can never be lower then 1, this guarentees the device cell height + // will always be larger than device char height. this.dimensions.scaledCellHeight = Math.floor(this.dimensions.scaledCharHeight * this._terminal.options.lineHeight); this.dimensions.device.cell.height = Math.floor(this.dimensions.device.char.height * this._terminal.options.lineHeight); @@ -469,7 +469,7 @@ export class WebglRenderer extends Disposable implements IRenderer { this.dimensions.scaledCharTop = this._terminal.options.lineHeight === 1 ? 0 : Math.round((this.dimensions.scaledCellHeight - this.dimensions.scaledCharHeight) / 2); this.dimensions.device.char.top = this._terminal.options.lineHeight === 1 ? 0 : Math.round((this.dimensions.device.cell.height - this.dimensions.device.char.height) / 2); - // Calculate the scaled cell width, taking the letterSpacing into account. + // Calculate the device cell width, taking the letterSpacing into account. this.dimensions.scaledCellWidth = this.dimensions.scaledCharWidth + Math.round(this._terminal.options.letterSpacing); this.dimensions.device.cell.width = this.dimensions.device.char.width + Math.round(this._terminal.options.letterSpacing); @@ -478,7 +478,7 @@ export class WebglRenderer extends Disposable implements IRenderer { this.dimensions.scaledCharLeft = Math.floor(this._terminal.options.letterSpacing / 2); this.dimensions.device.char.left = Math.floor(this._terminal.options.letterSpacing / 2); - // Recalculate the canvas dimensions, the scaled dimensions define the actual number of pixel in + // Recalculate the canvas dimensions, the device dimensions define the actual number of pixel in // the canvas this.dimensions.scaledCanvasHeight = this._terminal.rows * this.dimensions.scaledCellHeight; this.dimensions.scaledCanvasWidth = this._terminal.cols * this.dimensions.scaledCellWidth; @@ -509,7 +509,7 @@ export class WebglRenderer extends Disposable implements IRenderer { if (this._canvas.width === width && this._canvas.height === height) { return; } - // While the actual canvas size has changed, keep scaledCanvasWidth/Height as the value before + // While the actual canvas size has changed, keep device canvas dimensions as the value before // the change as it's an exact multiple of the cell sizes. this._canvas.width = width; this._canvas.height = height; diff --git a/addons/xterm-addon-webgl/src/renderLayer/BaseRenderLayer.ts b/addons/xterm-addon-webgl/src/renderLayer/BaseRenderLayer.ts index aa08b583..e30ef25b 100644 --- a/addons/xterm-addon-webgl/src/renderLayer/BaseRenderLayer.ts +++ b/addons/xterm-addon-webgl/src/renderLayer/BaseRenderLayer.ts @@ -17,12 +17,12 @@ import { Disposable, toDisposable } from 'common/Lifecycle'; export abstract class BaseRenderLayer extends Disposable implements IRenderLayer { private _canvas: HTMLCanvasElement; protected _ctx!: CanvasRenderingContext2D; - private _scaledCharWidth: number = 0; - private _scaledCharHeight: number = 0; - private _scaledCellWidth: number = 0; - private _scaledCellHeight: number = 0; - private _scaledCharLeft: number = 0; - private _scaledCharTop: number = 0; + private _deviceCharWidth: number = 0; + private _deviceCharHeight: number = 0; + private _deviceCellWidth: number = 0; + private _deviceCellHeight: number = 0; + private _deviceCharLeft: number = 0; + private _deviceCharTop: number = 0; protected _charAtlas: ITextureAtlas | undefined; @@ -90,24 +90,24 @@ export abstract class BaseRenderLayer extends Disposable implements IRenderLayer * @param colorSet The color set to use for the char atlas. */ private _refreshCharAtlas(terminal: Terminal, colorSet: ReadonlyColorSet): void { - if (this._scaledCharWidth <= 0 && this._scaledCharHeight <= 0) { + if (this._deviceCharWidth <= 0 && this._deviceCharHeight <= 0) { return; } - this._charAtlas = acquireTextureAtlas(terminal, colorSet, this._scaledCellWidth, this._scaledCellHeight, this._scaledCharWidth, this._scaledCharHeight, this._coreBrowserService.dpr); + this._charAtlas = acquireTextureAtlas(terminal, colorSet, this._deviceCellWidth, this._deviceCellHeight, this._deviceCharWidth, this._deviceCharHeight, this._coreBrowserService.dpr); this._charAtlas.warmUp(); } public resize(terminal: Terminal, dim: IRenderDimensions): void { - this._scaledCellWidth = dim.scaledCellWidth; - this._scaledCellHeight = dim.scaledCellHeight; - this._scaledCharWidth = dim.scaledCharWidth; - this._scaledCharHeight = dim.scaledCharHeight; - this._scaledCharLeft = dim.scaledCharLeft; - this._scaledCharTop = dim.scaledCharTop; - this._canvas.width = dim.scaledCanvasWidth; - this._canvas.height = dim.scaledCanvasHeight; - this._canvas.style.width = `${dim.canvasWidth}px`; - this._canvas.style.height = `${dim.canvasHeight}px`; + this._deviceCellWidth = dim.device.cell.width; + this._deviceCellHeight = dim.device.cell.height; + this._deviceCharWidth = dim.device.char.width; + this._deviceCharHeight = dim.device.char.height; + this._deviceCharLeft = dim.device.char.left; + this._deviceCharTop = dim.device.char.top; + this._canvas.width = dim.device.canvas.width; + this._canvas.height = dim.device.canvas.height; + this._canvas.style.width = `${dim.css.canvas.width}px`; + this._canvas.style.height = `${dim.css.canvas.height}px`; // Draw the background if this is an opaque layer if (!this._alpha) { @@ -128,10 +128,10 @@ export abstract class BaseRenderLayer extends Disposable implements IRenderLayer */ protected _fillCells(x: number, y: number, width: number, height: number): void { this._ctx.fillRect( - x * this._scaledCellWidth, - y * this._scaledCellHeight, - width * this._scaledCellWidth, - height * this._scaledCellHeight); + x * this._deviceCellWidth, + y * this._deviceCellHeight, + width * this._deviceCellWidth, + height * this._deviceCellHeight); } /** @@ -142,9 +142,9 @@ export abstract class BaseRenderLayer extends Disposable implements IRenderLayer */ protected _fillBottomLineAtCells(x: number, y: number, width: number = 1): void { this._ctx.fillRect( - x * this._scaledCellWidth, - (y + 1) * this._scaledCellHeight - this._coreBrowserService.dpr - 1 /* Ensure it's drawn within the cell */, - width * this._scaledCellWidth, + x * this._deviceCellWidth, + (y + 1) * this._deviceCellHeight - this._coreBrowserService.dpr - 1 /* Ensure it's drawn within the cell */, + width * this._deviceCellWidth, this._coreBrowserService.dpr); } @@ -156,10 +156,10 @@ export abstract class BaseRenderLayer extends Disposable implements IRenderLayer */ protected _fillLeftLineAtCell(x: number, y: number, width: number): void { this._ctx.fillRect( - x * this._scaledCellWidth, - y * this._scaledCellHeight, + x * this._deviceCellWidth, + y * this._deviceCellHeight, this._coreBrowserService.dpr * width, - this._scaledCellHeight); + this._deviceCellHeight); } /** @@ -171,10 +171,10 @@ export abstract class BaseRenderLayer extends Disposable implements IRenderLayer protected _strokeRectAtCell(x: number, y: number, width: number, height: number): void { this._ctx.lineWidth = this._coreBrowserService.dpr; this._ctx.strokeRect( - x * this._scaledCellWidth + this._coreBrowserService.dpr / 2, - y * this._scaledCellHeight + (this._coreBrowserService.dpr / 2), - width * this._scaledCellWidth - this._coreBrowserService.dpr, - (height * this._scaledCellHeight) - this._coreBrowserService.dpr); + x * this._deviceCellWidth + this._coreBrowserService.dpr / 2, + y * this._deviceCellHeight + (this._coreBrowserService.dpr / 2), + width * this._deviceCellWidth - this._coreBrowserService.dpr, + (height * this._deviceCellHeight) - this._coreBrowserService.dpr); } /** @@ -199,17 +199,17 @@ export abstract class BaseRenderLayer extends Disposable implements IRenderLayer protected _clearCells(x: number, y: number, width: number, height: number): void { if (this._alpha) { this._ctx.clearRect( - x * this._scaledCellWidth, - y * this._scaledCellHeight, - width * this._scaledCellWidth, - height * this._scaledCellHeight); + x * this._deviceCellWidth, + y * this._deviceCellHeight, + width * this._deviceCellWidth, + height * this._deviceCellHeight); } else { this._ctx.fillStyle = this._themeService.colors.background.css; this._ctx.fillRect( - x * this._scaledCellWidth, - y * this._scaledCellHeight, - width * this._scaledCellWidth, - height * this._scaledCellHeight); + x * this._deviceCellWidth, + y * this._deviceCellHeight, + width * this._deviceCellWidth, + height * this._deviceCellHeight); } } @@ -228,8 +228,8 @@ export abstract class BaseRenderLayer extends Disposable implements IRenderLayer this._clipCell(x, y, cell.getWidth()); this._ctx.fillText( cell.getChars(), - x * this._scaledCellWidth + this._scaledCharLeft, - y * this._scaledCellHeight + this._scaledCharTop + this._scaledCharHeight); + x * this._deviceCellWidth + this._deviceCharLeft, + y * this._deviceCellHeight + this._deviceCharTop + this._deviceCharHeight); } /** @@ -241,10 +241,10 @@ export abstract class BaseRenderLayer extends Disposable implements IRenderLayer private _clipCell(x: number, y: number, width: number): void { this._ctx.beginPath(); this._ctx.rect( - x * this._scaledCellWidth, - y * this._scaledCellHeight, - width * this._scaledCellWidth, - this._scaledCellHeight); + x * this._deviceCellWidth, + y * this._deviceCellHeight, + width * this._deviceCellWidth, + this._deviceCellHeight); this._ctx.clip(); } diff --git a/addons/xterm-addon-webgl/src/renderLayer/CursorRenderLayer.ts b/addons/xterm-addon-webgl/src/renderLayer/CursorRenderLayer.ts index a6325dcb..cb288f24 100644 --- a/addons/xterm-addon-webgl/src/renderLayer/CursorRenderLayer.ts +++ b/addons/xterm-addon-webgl/src/renderLayer/CursorRenderLayer.ts @@ -7,7 +7,6 @@ import { Terminal } from 'xterm'; import { BaseRenderLayer } from './BaseRenderLayer'; import { ICellData } from 'common/Types'; import { CellData } from 'common/buffer/CellData'; -import { IColorSet, ReadonlyColorSet } from 'browser/Types'; import { IRenderDimensions, IRequestRedrawEvent } from 'browser/renderer/shared/Types'; import { IEventEmitter } from 'common/EventEmitter'; import { ICoreBrowserService, IThemeService } from 'browser/services/Services';