From b0f1c38fd21d75773bca6a77079e5a0ecc64d658 Mon Sep 17 00:00:00 2001 From: Daniel Imms <2193314+Tyriar@users.noreply.github.com> Date: Sat, 15 Oct 2022 13:44:52 -0700 Subject: [PATCH] Move all other refs in canvas over --- .../xterm-addon-canvas/src/BaseRenderLayer.ts | 126 +++++++++--------- .../xterm-addon-canvas/src/TextRenderLayer.ts | 4 +- 2 files changed, 65 insertions(+), 65 deletions(-) diff --git a/addons/xterm-addon-canvas/src/BaseRenderLayer.ts b/addons/xterm-addon-canvas/src/BaseRenderLayer.ts index 29c85558..ccd1f56f 100644 --- a/addons/xterm-addon-canvas/src/BaseRenderLayer.ts +++ b/addons/xterm-addon-canvas/src/BaseRenderLayer.ts @@ -24,12 +24,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 _selectionModel: ISelectionRenderModel = createSelectionRenderModel(); private _cellColorResolver: CellColorResolver; @@ -112,25 +112,25 @@ export abstract class BaseRenderLayer extends Disposable implements IRenderLayer * @param colorSet The color set to use for the char atlas. */ private _refreshCharAtlas(colorSet: ReadonlyColorSet): void { - if (this._scaledCharWidth <= 0 && this._scaledCharHeight <= 0) { + if (this._deviceCharWidth <= 0 && this._deviceCharHeight <= 0) { return; } - this._charAtlas = acquireTextureAtlas(this._terminal, colorSet, this._scaledCellWidth, this._scaledCellHeight, this._scaledCharWidth, this._scaledCharHeight, this._coreBrowserService.dpr); + this._charAtlas = acquireTextureAtlas(this._terminal, colorSet, this._deviceCellWidth, this._deviceCellHeight, this._deviceCharWidth, this._deviceCharHeight, this._coreBrowserService.dpr); this._charAtlas.warmUp(); this._bitmapGenerator = new BitmapGenerator(this._charAtlas.cacheCanvas); } public resize(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) { @@ -155,10 +155,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); } /** @@ -168,11 +168,11 @@ export abstract class BaseRenderLayer extends Disposable implements IRenderLayer * @param y The row to fill. */ protected _fillMiddleLineAtCells(x: number, y: number, width: number = 1): void { - const cellOffset = Math.ceil(this._scaledCellHeight * 0.5); + const cellOffset = Math.ceil(this._deviceCellHeight * 0.5); this._ctx.fillRect( - x * this._scaledCellWidth, - (y + 1) * this._scaledCellHeight - cellOffset - this._coreBrowserService.dpr, - width * this._scaledCellWidth, + x * this._deviceCellWidth, + (y + 1) * this._deviceCellHeight - cellOffset - this._coreBrowserService.dpr, + width * this._deviceCellWidth, this._coreBrowserService.dpr); } @@ -184,9 +184,9 @@ export abstract class BaseRenderLayer extends Disposable implements IRenderLayer */ protected _fillBottomLineAtCells(x: number, y: number, width: number = 1, pixelOffset: number = 0): void { this._ctx.fillRect( - x * this._scaledCellWidth, - (y + 1) * this._scaledCellHeight + pixelOffset - this._coreBrowserService.dpr - 1 /* Ensure it's drawn within the cell */, - width * this._scaledCellWidth, + x * this._deviceCellWidth, + (y + 1) * this._deviceCellHeight + pixelOffset - this._coreBrowserService.dpr - 1 /* Ensure it's drawn within the cell */, + width * this._deviceCellWidth, this._coreBrowserService.dpr); } @@ -197,10 +197,10 @@ export abstract class BaseRenderLayer extends Disposable implements IRenderLayer const lineWidth = this._coreBrowserService.dpr; this._ctx.lineWidth = lineWidth; for (let xOffset = 0; xOffset < width; xOffset++) { - const xLeft = (x + xOffset) * this._scaledCellWidth; - const xMid = (x + xOffset + 0.5) * this._scaledCellWidth; - const xRight = (x + xOffset + 1) * this._scaledCellWidth; - const yMid = (y + 1) * this._scaledCellHeight - lineWidth - 1; + const xLeft = (x + xOffset) * this._deviceCellWidth; + const xMid = (x + xOffset + 0.5) * this._deviceCellWidth; + const xRight = (x + xOffset + 1) * this._deviceCellWidth; + const yMid = (y + 1) * this._deviceCellHeight - lineWidth - 1; const yMidBot = yMid - lineWidth; const yMidTop = yMid + lineWidth; this._ctx.moveTo(xLeft, yMid); @@ -226,12 +226,12 @@ export abstract class BaseRenderLayer extends Disposable implements IRenderLayer const lineWidth = this._coreBrowserService.dpr; this._ctx.lineWidth = lineWidth; this._ctx.setLineDash([lineWidth * 2, lineWidth]); - const xLeft = x * this._scaledCellWidth; - const yMid = (y + 1) * this._scaledCellHeight - lineWidth - 1; + const xLeft = x * this._deviceCellWidth; + const yMid = (y + 1) * this._deviceCellHeight - lineWidth - 1; this._ctx.moveTo(xLeft, yMid); for (let xOffset = 0; xOffset < width; xOffset++) { - // const xLeft = x * this._scaledCellWidth; - const xRight = (x + width + xOffset) * this._scaledCellWidth; + // const xLeft = x * this._deviceCellWidth; + const xRight = (x + width + xOffset) * this._deviceCellWidth; this._ctx.lineTo(xRight, yMid); } this._ctx.stroke(); @@ -246,9 +246,9 @@ export abstract class BaseRenderLayer extends Disposable implements IRenderLayer const lineWidth = this._coreBrowserService.dpr; this._ctx.lineWidth = lineWidth; this._ctx.setLineDash([lineWidth * 4, lineWidth * 3]); - const xLeft = x * this._scaledCellWidth; - const xRight = (x + width) * this._scaledCellWidth; - const yMid = (y + 1) * this._scaledCellHeight - lineWidth - 1; + const xLeft = x * this._deviceCellWidth; + const xRight = (x + width) * this._deviceCellWidth; + const yMid = (y + 1) * this._deviceCellHeight - lineWidth - 1; this._ctx.moveTo(xLeft, yMid); this._ctx.lineTo(xRight, yMid); this._ctx.stroke(); @@ -264,10 +264,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); } /** @@ -280,10 +280,10 @@ export abstract class BaseRenderLayer extends Disposable implements IRenderLayer const lineWidth = this._coreBrowserService.dpr; this._ctx.lineWidth = lineWidth; this._ctx.strokeRect( - x * this._scaledCellWidth + lineWidth / 2, - y * this._scaledCellHeight + (lineWidth / 2), - width * this._scaledCellWidth - lineWidth, - (height * this._scaledCellHeight) - lineWidth); + x * this._deviceCellWidth + lineWidth / 2, + y * this._deviceCellHeight + (lineWidth / 2), + width * this._deviceCellWidth - lineWidth, + (height * this._deviceCellHeight) - lineWidth); } /** @@ -308,17 +308,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); } } @@ -338,15 +338,15 @@ export abstract class BaseRenderLayer extends Disposable implements IRenderLayer // Draw custom characters if applicable let drawSuccess = false; if (this._optionsService.rawOptions.customGlyphs !== false) { - drawSuccess = tryDrawCustomChar(this._ctx, cell.getChars(), x * this._scaledCellWidth, y * this._scaledCellHeight, this._scaledCellWidth, this._scaledCellHeight, this._optionsService.rawOptions.fontSize, this._coreBrowserService.dpr); + drawSuccess = tryDrawCustomChar(this._ctx, cell.getChars(), x * this._deviceCellWidth, y * this._deviceCellHeight, this._deviceCellWidth, this._deviceCellHeight, this._optionsService.rawOptions.fontSize, this._coreBrowserService.dpr); } // Draw the character if (!drawSuccess) { 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); } } @@ -376,8 +376,8 @@ export abstract class BaseRenderLayer extends Disposable implements IRenderLayer glyph.texturePosition.y, glyph.size.x, glyph.size.y, - x * this._scaledCellWidth - glyph.offset.x, - y * this._scaledCellHeight - glyph.offset.y, + x * this._deviceCellWidth - glyph.offset.x, + y * this._deviceCellHeight - glyph.offset.y, glyph.size.x, glyph.size.y ); @@ -392,9 +392,9 @@ export abstract class BaseRenderLayer extends Disposable implements IRenderLayer this._ctx.beginPath(); this._ctx.rect( 0, - y * this._scaledCellHeight, - this._bufferService.cols * this._scaledCellWidth, - this._scaledCellHeight); + y * this._deviceCellHeight, + this._bufferService.cols * this._deviceCellWidth, + this._deviceCellHeight); this._ctx.clip(); } diff --git a/addons/xterm-addon-canvas/src/TextRenderLayer.ts b/addons/xterm-addon-canvas/src/TextRenderLayer.ts index e2a35751..66fc5106 100644 --- a/addons/xterm-addon-canvas/src/TextRenderLayer.ts +++ b/addons/xterm-addon-canvas/src/TextRenderLayer.ts @@ -53,8 +53,8 @@ export class TextRenderLayer extends BaseRenderLayer { // Clear the character width cache if the font or width has changed const terminalFont = this._getFont(false, false); - if (this._characterWidth !== dim.scaledCharWidth || this._characterFont !== terminalFont) { - this._characterWidth = dim.scaledCharWidth; + if (this._characterWidth !== dim.device.char.width || this._characterFont !== terminalFont) { + this._characterWidth = dim.device.char.width; this._characterFont = terminalFont; this._characterOverlapCache = {}; }