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/v3' into more_rendering_improvements

Browse Source
This commit is contained in:
Daniel Imms
2017-10-13 13:02:38 -07:00
parent eb57cc3e9e c1ec68091a
commit e86aebaa41
6 changed files with 40 additions and 157 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/InputHandler.test.ts
-139
View File
@@ -67,142 +67,3 @@ describe('InputHandler', () => {
});
});
});
const old_wcwidth = (function(opts: {nul: number, control: number}): (ucs: number) => number {
// extracted from https://www.cl.cam.ac.uk/%7Emgk25/ucs/wcwidth.c
// combining characters
const COMBINING = [
[0x0300, 0x036F], [0x0483, 0x0486], [0x0488, 0x0489],
[0x0591, 0x05BD], [0x05BF, 0x05BF], [0x05C1, 0x05C2],
[0x05C4, 0x05C5], [0x05C7, 0x05C7], [0x0600, 0x0603],
[0x0610, 0x0615], [0x064B, 0x065E], [0x0670, 0x0670],
[0x06D6, 0x06E4], [0x06E7, 0x06E8], [0x06EA, 0x06ED],
[0x070F, 0x070F], [0x0711, 0x0711], [0x0730, 0x074A],
[0x07A6, 0x07B0], [0x07EB, 0x07F3], [0x0901, 0x0902],
[0x093C, 0x093C], [0x0941, 0x0948], [0x094D, 0x094D],
[0x0951, 0x0954], [0x0962, 0x0963], [0x0981, 0x0981],
[0x09BC, 0x09BC], [0x09C1, 0x09C4], [0x09CD, 0x09CD],
[0x09E2, 0x09E3], [0x0A01, 0x0A02], [0x0A3C, 0x0A3C],
[0x0A41, 0x0A42], [0x0A47, 0x0A48], [0x0A4B, 0x0A4D],
[0x0A70, 0x0A71], [0x0A81, 0x0A82], [0x0ABC, 0x0ABC],
[0x0AC1, 0x0AC5], [0x0AC7, 0x0AC8], [0x0ACD, 0x0ACD],
[0x0AE2, 0x0AE3], [0x0B01, 0x0B01], [0x0B3C, 0x0B3C],
[0x0B3F, 0x0B3F], [0x0B41, 0x0B43], [0x0B4D, 0x0B4D],
[0x0B56, 0x0B56], [0x0B82, 0x0B82], [0x0BC0, 0x0BC0],
[0x0BCD, 0x0BCD], [0x0C3E, 0x0C40], [0x0C46, 0x0C48],
[0x0C4A, 0x0C4D], [0x0C55, 0x0C56], [0x0CBC, 0x0CBC],
[0x0CBF, 0x0CBF], [0x0CC6, 0x0CC6], [0x0CCC, 0x0CCD],
[0x0CE2, 0x0CE3], [0x0D41, 0x0D43], [0x0D4D, 0x0D4D],
[0x0DCA, 0x0DCA], [0x0DD2, 0x0DD4], [0x0DD6, 0x0DD6],
[0x0E31, 0x0E31], [0x0E34, 0x0E3A], [0x0E47, 0x0E4E],
[0x0EB1, 0x0EB1], [0x0EB4, 0x0EB9], [0x0EBB, 0x0EBC],
[0x0EC8, 0x0ECD], [0x0F18, 0x0F19], [0x0F35, 0x0F35],
[0x0F37, 0x0F37], [0x0F39, 0x0F39], [0x0F71, 0x0F7E],
[0x0F80, 0x0F84], [0x0F86, 0x0F87], [0x0F90, 0x0F97],
[0x0F99, 0x0FBC], [0x0FC6, 0x0FC6], [0x102D, 0x1030],
[0x1032, 0x1032], [0x1036, 0x1037], [0x1039, 0x1039],
[0x1058, 0x1059], [0x1160, 0x11FF], [0x135F, 0x135F],
[0x1712, 0x1714], [0x1732, 0x1734], [0x1752, 0x1753],
[0x1772, 0x1773], [0x17B4, 0x17B5], [0x17B7, 0x17BD],
[0x17C6, 0x17C6], [0x17C9, 0x17D3], [0x17DD, 0x17DD],
[0x180B, 0x180D], [0x18A9, 0x18A9], [0x1920, 0x1922],
[0x1927, 0x1928], [0x1932, 0x1932], [0x1939, 0x193B],
[0x1A17, 0x1A18], [0x1B00, 0x1B03], [0x1B34, 0x1B34],
[0x1B36, 0x1B3A], [0x1B3C, 0x1B3C], [0x1B42, 0x1B42],
[0x1B6B, 0x1B73], [0x1DC0, 0x1DCA], [0x1DFE, 0x1DFF],
[0x200B, 0x200F], [0x202A, 0x202E], [0x2060, 0x2063],
[0x206A, 0x206F], [0x20D0, 0x20EF], [0x302A, 0x302F],
[0x3099, 0x309A], [0xA806, 0xA806], [0xA80B, 0xA80B],
[0xA825, 0xA826], [0xFB1E, 0xFB1E], [0xFE00, 0xFE0F],
[0xFE20, 0xFE23], [0xFEFF, 0xFEFF], [0xFFF9, 0xFFFB],
[0x10A01, 0x10A03], [0x10A05, 0x10A06], [0x10A0C, 0x10A0F],
[0x10A38, 0x10A3A], [0x10A3F, 0x10A3F], [0x1D167, 0x1D169],
[0x1D173, 0x1D182], [0x1D185, 0x1D18B], [0x1D1AA, 0x1D1AD],
[0x1D242, 0x1D244], [0xE0001, 0xE0001], [0xE0020, 0xE007F],
[0xE0100, 0xE01EF]
];
// binary search
function bisearch(ucs: number): boolean {
let min = 0;
let max = COMBINING.length - 1;
let mid;
if (ucs < COMBINING[0][0] || ucs > COMBINING[max][1])
return false;
while (max >= min) {
mid = Math.floor((min + max) / 2);
if (ucs > COMBINING[mid][1])
min = mid + 1;
else if (ucs < COMBINING[mid][0])
max = mid - 1;
else
return true;
}
return false;
}
function wcwidth(ucs: number): number {
// test for 8-bit control characters
if (ucs === 0) {
return opts.nul;
}
if (ucs < 32 || (ucs >= 0x7f && ucs < 0xa0)) {
return opts.control;
}
// binary search in table of non-spacing characters
if (bisearch(ucs)) {
return 0;
}
// if we arrive here, ucs is not a combining or C0/C1 control character
if (isWide(ucs)) {
return 2;
}
return 1;
}
function isWide(ucs: number): boolean {
return (
ucs >= 0x1100 && (
ucs <= 0x115f || // Hangul Jamo init. consonants
ucs === 0x2329 ||
ucs === 0x232a ||
(ucs >= 0x2e80 && ucs <= 0xa4cf && ucs !== 0x303f) || // CJK..Yi
(ucs >= 0xac00 && ucs <= 0xd7a3) || // Hangul Syllables
(ucs >= 0xf900 && ucs <= 0xfaff) || // CJK Compat Ideographs
(ucs >= 0xfe10 && ucs <= 0xfe19) || // Vertical forms
(ucs >= 0xfe30 && ucs <= 0xfe6f) || // CJK Compat Forms
(ucs >= 0xff00 && ucs <= 0xff60) || // Fullwidth Forms
(ucs >= 0xffe0 && ucs <= 0xffe6) ||
(ucs >= 0x20000 && ucs <= 0x2fffd) ||
(ucs >= 0x30000 && ucs <= 0x3fffd)));
}
return wcwidth;
})({nul: 0, control: 0}); // configurable options
describe('wcwidth', () => {
it('same as old implementation for BMP and individual higher', (done) => {
for (let i = 0; i < 65536; ++i)
assert.equal(wcwidth(i), old_wcwidth(i));
// test some individual higher to fullfill branching
assert.equal(wcwidth(0x10A01), old_wcwidth(0x10A01));
assert.equal(wcwidth(0x30000), old_wcwidth(0x30000));
assert.equal(wcwidth(0x3fffe), old_wcwidth(0x3fffe));
done();
}).timeout(3000);
/*
it('new is at least 5 times faster', () => {
let start_new = new Date().getTime();
let x = 0;
for (let runs = 0; runs < 1; ++runs)
for (let i = 0; i < 65536; ++i)
x = wcwidth(i);
let end_new = new Date().getTime();
let start_old = new Date().getTime();
let y = 0;
for (let runs = 0; runs < 1; ++runs)
for (let i = 0; i < 65536; ++i)
y = old_wcwidth(i);
let end_old = new Date().getTime();
// console.log((end_new - start_new));
// console.log((end_old - start_old));
assert.equal(((end_new - start_new) * 5 < (end_old - start_old)), true);
});
*/
});
src/InputHandler.ts
+17 -11
View File
@@ -9,6 +9,7 @@ import { C0 } from './EscapeSequences';
import { DEFAULT_CHARSET } from './Charsets';
import { CharData } from './Types';
import { CHAR_DATA_CHAR_INDEX, CHAR_DATA_WIDTH_INDEX } from './Buffer';
import { FLAGS } from './renderer/Types';
/**
* The terminal's standard implementation of IInputHandler, this handles all
@@ -1107,6 +1108,7 @@ export class InputHandler implements IInputHandler {
* CSI Pm m Character Attributes (SGR).
* Ps = 0 -> Normal (default).
* Ps = 1 -> Bold.
* Ps = 2 -> Faint, decreased intensity (ISO 6429).
* Ps = 4 -> Underlined.
* Ps = 5 -> Blink (appears as Bold).
* Ps = 7 -> Inverse.
@@ -1206,35 +1208,39 @@ export class InputHandler implements IInputHandler {
// bg = 0x1ff;
} else if (p === 1) {
// bold text
flags |= 1;
flags |= FLAGS.BOLD;
} else if (p === 4) {
// underlined text
flags |= 2;
flags |= FLAGS.UNDERLINE;
} else if (p === 5) {
// blink
flags |= 4;
flags |= FLAGS.BLINK;
} else if (p === 7) {
// inverse and positive
// test with: echo -e '\e[31m\e[42mhello\e[7mworld\e[27mhi\e[m'
flags |= 8;
flags |= FLAGS.INVERSE;
} else if (p === 8) {
// invisible
flags |= 16;
flags |= FLAGS.INVISIBLE;
} else if (p === 2) {
// dimmed text
flags |= FLAGS.DIM;
} else if (p === 22) {
// not bold
flags &= ~1;
// not bold nor faint
flags &= ~FLAGS.BOLD;
flags &= ~FLAGS.DIM;
} else if (p === 24) {
// not underlined
flags &= ~2;
flags &= ~FLAGS.UNDERLINE;
} else if (p === 25) {
// not blink
flags &= ~4;
flags &= ~FLAGS.BLINK;
} else if (p === 27) {
// not inverse
flags &= ~8;
flags &= ~FLAGS.INVERSE;
} else if (p === 28) {
// not invisible
flags &= ~16;
flags &= ~FLAGS.INVISIBLE;
} else if (p === 39) {
// reset fg
fg = (this._terminal.defAttr >> 9) & 0x1ff;
src/SelectionModel.ts
+3
View File
@@ -97,6 +97,9 @@ export class SelectionModel {
public areSelectionValuesReversed(): boolean {
const start = this.selectionStart;
const end = this.selectionEnd;
if (!start || !end) {
return false;
}
return start[1] > end[1] || (start[1] === end[1] && start[0] > end[0]);
}
src/renderer/BaseRenderLayer.ts
+17 -5
View File
@@ -10,6 +10,7 @@ import { CharData } from '../Types';
import { CHAR_DATA_WIDTH_INDEX, CHAR_DATA_CHAR_INDEX } from '../Buffer';
export const INVERTED_DEFAULT_COLOR = -1;
const DIM_OPACITY = 0.5;
export abstract class BaseRenderLayer implements IRenderLayer {
private _canvas: HTMLCanvasElement;
@@ -223,7 +224,7 @@ export abstract class BaseRenderLayer implements IRenderLayer {
* This is used to validate whether a cached image can be used.
* @param bold Whether the text is bold.
*/
protected drawChar(terminal: ITerminal, char: string, code: number, width: number, x: number, y: number, fg: number, bg: number, bold: boolean): void {
protected drawChar(terminal: ITerminal, char: string, code: number, width: number, x: number, y: number, fg: number, bg: number, bold: boolean, dim: boolean): void {
let colorIndex = 0;
if (fg < 256) {
colorIndex = fg + 2;
@@ -234,13 +235,20 @@ export abstract class BaseRenderLayer implements IRenderLayer {
}
}
const isAscii = code < 256;
const isBasicColor = (colorIndex > 1 && fg < 16);
// A color is basic if it is one of the standard normal or bold weight
// colors of the characters held in the char atlas. Note that this excludes
// the normal weight light color characters
const isBasicColor = (colorIndex > 1 && fg < 16) && (fg < 8 || bold);
const isDefaultColor = fg >= 256;
const isDefaultBackground = bg >= 256;
if (this._charAtlas && isAscii && (isBasicColor || isDefaultColor) && isDefaultBackground) {
// ImageBitmap's draw about twice as fast as from a canvas
const charAtlasCellWidth = this._scaledCharWidth + CHAR_ATLAS_CELL_SPACING;
const charAtlasCellHeight = this._scaledCharHeight + CHAR_ATLAS_CELL_SPACING;
// Apply alpha to dim the character
if (dim) {
this._ctx.globalAlpha = DIM_OPACITY;
}
this._ctx.drawImage(this._charAtlas,
code * charAtlasCellWidth,
colorIndex * charAtlasCellHeight,
@@ -248,10 +256,10 @@ export abstract class BaseRenderLayer implements IRenderLayer {
this._scaledCharHeight,
x * this._scaledCellWidth + this._scaledCharLeft,
y * this._scaledCellHeight + this._scaledCharTop,
this._scaledCharWidth,
charAtlasCellWidth,
this._scaledCharHeight);
} else {
this._drawUncachedChar(terminal, char, width, fg, x, y, bold);
this._drawUncachedChar(terminal, char, width, fg, x, y, bold, dim);
}
// This draws the atlas (for debugging purposes)
// this._ctx.clearRect(0, 0, this._canvas.width, this._canvas.height);
@@ -269,7 +277,7 @@ export abstract class BaseRenderLayer implements IRenderLayer {
* @param x The column to draw at.
* @param y The row to draw at.
*/
private _drawUncachedChar(terminal: ITerminal, char: string, width: number, fg: number, x: number, y: number, bold: boolean): void {
private _drawUncachedChar(terminal: ITerminal, char: string, width: number, fg: number, x: number, y: number, bold: boolean, dim: boolean): void {
this._ctx.save();
this._ctx.font = `${terminal.options.fontSize * window.devicePixelRatio}px ${terminal.options.fontFamily}`;
if (bold) {
@@ -288,6 +296,10 @@ export abstract class BaseRenderLayer implements IRenderLayer {
this._clipRow(terminal, y);
// Apply alpha to dim the character
if (dim) {
this._ctx.globalAlpha = DIM_OPACITY;
}
// Draw the character
this._ctx.fillText(
char,
src/renderer/TextRenderLayer.ts
+1 -1
View File
@@ -185,7 +185,7 @@ export class TextRenderLayer extends BaseRenderLayer {
this.fillBottomLineAtCells(x, y);
}
this.drawChar(terminal, char, code, width, x, y, fg, bg, !!(flags & FLAGS.BOLD));
this.drawChar(terminal, char, code, width, x, y, fg, bg, !!(flags & FLAGS.BOLD), !!(flags & FLAGS.DIM));
this._ctx.restore();
}
src/renderer/Types.ts
+2 -1
View File
@@ -11,5 +11,6 @@ export enum FLAGS {
UNDERLINE = 2,
BLINK = 4,
INVERSE = 8,
INVISIBLE = 16
INVISIBLE = 16,
DIM = 32
};