waveterm/xterm.js
0
0
Fork 0
mirror of https://github.com/wavetermdev/xterm.js.git synced 2026-08-05 13:43:48 -07:00
Code Issues Packages Projects Releases Wiki Activity

Merge remote-tracking branch 'origin/master' into noUnusedLocals

Browse Source
This commit is contained in:
Daniel Imms
2018-03-09 08:43:21 -08:00
parent b794dc017d 842c7132ec
commit 811aa9c413
8 changed files with 55 additions and 76 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/renderer/Types.ts
+3 -8
View File
@@ -5,6 +5,7 @@
import { ITerminal } from '../Types';
import { IEventEmitter, ITheme } from 'xterm';
import { IColorSet } from '../shared/Types';
/**
* Flags used to render terminal text properly.
@@ -39,14 +40,8 @@ export interface IColorManager {
colors: IColorSet;
}
export interface IColorSet {
foreground: string;
background: string;
cursor: string;
cursorAccent: string;
selection: string;
ansi: string[];
}
// TODO: We should probably rewrite the imports for IColorSet, but there's a lot of them
export { IColorSet };
export interface IRenderDimensions {
scaledCharWidth: number;
src/renderer/atlas/CharAtlas.ts
+3 -17
View File
@@ -5,8 +5,8 @@
import { ITerminal } from '../../Types';
import { IColorSet } from '../Types';
import { ICharAtlasConfig } from './Types';
import { generateCharAtlas, ICharAtlasRequest } from '../../shared/atlas/CharAtlasGenerator';
import { ICharAtlasConfig } from '../../shared/atlas/Types';
import { generateCharAtlas } from '../../shared/atlas/CharAtlasGenerator';
import { generateConfig, configEquals } from './CharAtlasUtils';
interface ICharAtlasCacheEntry {
@@ -62,22 +62,8 @@ export function acquireCharAtlas(terminal: ITerminal, colors: IColorSet, scaledC
return canvas;
};
const charAtlasConfig: ICharAtlasRequest = {
scaledCharWidth,
scaledCharHeight,
fontSize: terminal.options.fontSize,
fontFamily: terminal.options.fontFamily,
fontWeight: terminal.options.fontWeight,
fontWeightBold: terminal.options.fontWeightBold,
background: colors.background,
foreground: colors.foreground,
ansiColors: colors.ansi,
devicePixelRatio: window.devicePixelRatio,
allowTransparency: terminal.options.allowTransparency
};
const newEntry: ICharAtlasCacheEntry = {
bitmap: generateCharAtlas(window, canvasFactory, charAtlasConfig),
bitmap: generateCharAtlas(window, canvasFactory, newConfig),
config: newConfig,
ownedBy: [terminal]
};
src/renderer/atlas/CharAtlasUtils.ts
+4 -2
View File
@@ -5,7 +5,7 @@
import { ITerminal } from '../../Types';
import { IColorSet } from '../Types';
import { ICharAtlasConfig } from './Types';
import { ICharAtlasConfig } from '../../shared/atlas/Types';
export function generateConfig(scaledCharWidth: number, scaledCharHeight: number, terminal: ITerminal, colors: IColorSet): ICharAtlasConfig {
const clonedColors = {
@@ -17,6 +17,7 @@ export function generateConfig(scaledCharWidth: number, scaledCharHeight: number
ansi: colors.ansi.slice(0, 16)
};
return {
devicePixelRatio: window.devicePixelRatio,
scaledCharWidth,
scaledCharHeight,
fontFamily: terminal.options.fontFamily,
@@ -34,7 +35,8 @@ export function configEquals(a: ICharAtlasConfig, b: ICharAtlasConfig): boolean
return false;
}
}
return a.fontFamily === b.fontFamily &&
return a.devicePixelRatio === b.devicePixelRatio &&
a.fontFamily === b.fontFamily &&
a.fontSize === b.fontSize &&
a.fontWeight === b.fontWeight &&
a.fontWeightBold === b.fontWeightBold &&
src/renderer/atlas/Types.ts
-14
View File
@@ -3,19 +3,5 @@
* @license MIT
*/
import { FontWeight } from 'xterm';
import { IColorSet } from '../Types';
export const INVERTED_DEFAULT_COLOR = -1;
export const DIM_OPACITY = 0.5;
export interface ICharAtlasConfig {
fontSize: number;
fontFamily: string;
fontWeight: FontWeight;
fontWeightBold: FontWeight;
scaledCharWidth: number;
scaledCharHeight: number;
allowTransparency: boolean;
colors: IColorSet;
}
src/shared/Types.ts
+13
View File
@@ -0,0 +1,13 @@
/**
* Copyright (c) 2017 The xterm.js authors. All rights reserved.
* @license MIT
*/
export interface IColorSet {
foreground: string;
background: string;
cursor: string;
cursorAccent: string;
selection: string;
ansi: string[];
}
src/shared/atlas/CharAtlasGenerator.ts
+17 -31
View File
@@ -4,7 +4,7 @@
*/
import { FontWeight } from 'xterm';
import { CHAR_ATLAS_CELL_SPACING } from './Types';
import { CHAR_ATLAS_CELL_SPACING, ICharAtlasConfig } from './Types';
import { isFirefox } from '../utils/Browser';
declare const Promise: any;
@@ -16,41 +16,27 @@ export interface IOffscreenCanvas {
transferToImageBitmap(): ImageBitmap;
}
export interface ICharAtlasRequest {
scaledCharWidth: number;
scaledCharHeight: number;
fontSize: number;
fontFamily: string;
fontWeight: FontWeight;
fontWeightBold: FontWeight;
background: string;
foreground: string;
ansiColors: string[];
devicePixelRatio: number;
allowTransparency: boolean;
}
/**
* Generates a char atlas.
* @param context The window or worker context.
* @param canvasFactory A function to generate a canvas with a width or height.
* @param request The config for the new char atlas.
*/
export function generateCharAtlas(context: Window, canvasFactory: (width: number, height: number) => HTMLCanvasElement | IOffscreenCanvas, request: ICharAtlasRequest): HTMLCanvasElement | Promise<ImageBitmap> {
const cellWidth = request.scaledCharWidth + CHAR_ATLAS_CELL_SPACING;
const cellHeight = request.scaledCharHeight + CHAR_ATLAS_CELL_SPACING;
export function generateCharAtlas(context: Window, canvasFactory: (width: number, height: number) => HTMLCanvasElement | IOffscreenCanvas, config: ICharAtlasConfig): HTMLCanvasElement | Promise<ImageBitmap> {
const cellWidth = config.scaledCharWidth + CHAR_ATLAS_CELL_SPACING;
const cellHeight = config.scaledCharHeight + CHAR_ATLAS_CELL_SPACING;
const canvas = canvasFactory(
/*255 ascii chars*/255 * cellWidth,
(/*default+default bold*/2 + /*0-15*/16) * cellHeight
);
const ctx = canvas.getContext('2d', {alpha: request.allowTransparency});
const ctx = canvas.getContext('2d', {alpha: config.allowTransparency});
ctx.fillStyle = request.background;
ctx.fillStyle = config.colors.background;
ctx.fillRect(0, 0, canvas.width, canvas.height);
ctx.save();
ctx.fillStyle = request.foreground;
ctx.font = getFont(request.fontWeight, request);
ctx.fillStyle = config.colors.foreground;
ctx.font = getFont(config.fontWeight, config);
ctx.textBaseline = 'top';
// Default color
@@ -64,7 +50,7 @@ export function generateCharAtlas(context: Window, canvasFactory: (width: number
}
// Default color bold
ctx.save();
ctx.font = getFont(request.fontWeightBold, request);
ctx.font = getFont(config.fontWeightBold, config);
for (let i = 0; i < 256; i++) {
ctx.save();
ctx.beginPath();
@@ -76,11 +62,11 @@ export function generateCharAtlas(context: Window, canvasFactory: (width: number
ctx.restore();
// Colors 0-15
ctx.font = getFont(request.fontWeight, request);
ctx.font = getFont(config.fontWeight, config);
for (let colorIndex = 0; colorIndex < 16; colorIndex++) {
// colors 8-15 are bold
if (colorIndex === 8) {
ctx.font = getFont(request.fontWeightBold, request);
ctx.font = getFont(config.fontWeightBold, config);
}
const y = (colorIndex + 2) * cellHeight;
// Draw ascii characters
@@ -89,7 +75,7 @@ export function generateCharAtlas(context: Window, canvasFactory: (width: number
ctx.beginPath();
ctx.rect(i * cellWidth, y, cellWidth, cellHeight);
ctx.clip();
ctx.fillStyle = request.ansiColors[colorIndex];
ctx.fillStyle = config.colors.ansi[colorIndex];
ctx.fillText(String.fromCharCode(i), i * cellWidth, y);
ctx.restore();
}
@@ -114,9 +100,9 @@ export function generateCharAtlas(context: Window, canvasFactory: (width: number
const charAtlasImageData = ctx.getImageData(0, 0, canvas.width, canvas.height);
// Remove the background color from the image so characters may overlap
const r = parseInt(request.background.substr(1, 2), 16);
const g = parseInt(request.background.substr(3, 2), 16);
const b = parseInt(request.background.substr(5, 2), 16);
const r = parseInt(config.colors.background.substr(1, 2), 16);
const g = parseInt(config.colors.background.substr(3, 2), 16);
const b = parseInt(config.colors.background.substr(5, 2), 16);
clearColor(charAtlasImageData, r, g, b);
return context.createImageBitmap(charAtlasImageData);
@@ -135,6 +121,6 @@ function clearColor(imageData: ImageData, r: number, g: number, b: number): void
}
}
function getFont(fontWeight: FontWeight, request: ICharAtlasRequest): string {
return `${fontWeight} ${request.fontSize * request.devicePixelRatio}px ${request.fontFamily}`;
function getFont(fontWeight: FontWeight, config: ICharAtlasConfig): string {
return `${fontWeight} ${config.fontSize * config.devicePixelRatio}px ${config.fontFamily}`;
}
src/shared/atlas/Types.ts
+15
View File
@@ -3,4 +3,19 @@
* @license MIT
*/
import { FontWeight } from 'xterm';
import { IColorSet } from '../Types';
export const CHAR_ATLAS_CELL_SPACING = 1;
export interface ICharAtlasConfig {
devicePixelRatio: number;
fontSize: number;
fontFamily: string;
fontWeight: FontWeight;
fontWeightBold: FontWeight;
scaledCharWidth: number;
scaledCharHeight: number;
allowTransparency: boolean;
colors: IColorSet;
}
src/xterm.css
-4
View File
@@ -144,10 +144,6 @@
color: transparent;
}
.xterm .xterm-accessibility-tree:focus [id^="xterm-active-item-"] {
outline: 1px solid #F80;
}
.xterm .live-region {
position: absolute;
left: -9999px;