mirror of
https://github.com/wavetermdev/xterm.js.git
synced 2026-08-05 13:43:48 -07:00
Replace BLOCK_PATTERN_WITH_REGION with new clipPath
This commit is contained in:
@@ -432,46 +432,46 @@ export const customGlyphDefinitions: { [index: string]: CustomGlyphCharacterDefi
|
||||
'\u{1FB8B}': { type: CustomGlyphDefinitionType.SOLID_OCTANT_BLOCK_VECTOR, data: [{ x: 1, y: 0, w: 7, h: 8 }] }, // RIGHT SEVEN EIGHTHS B0OCK
|
||||
|
||||
// Rectangular shade characters (1FB8C-1FB94)
|
||||
'\u{1FB8C}': { type: CustomGlyphDefinitionType.BLOCK_PATTERN_WITH_REGION, data: [[ // LEFT HALF MEDIUM SHADE
|
||||
'\u{1FB8C}': { type: CustomGlyphDefinitionType.BLOCK_PATTERN, data: [ // LEFT HALF MEDIUM SHADE
|
||||
[1, 0],
|
||||
[0, 1]
|
||||
], [0, 0, 0.5, 1]] },
|
||||
'\u{1FB8D}': { type: CustomGlyphDefinitionType.BLOCK_PATTERN_WITH_REGION, data: [[ // RIGHT HALF MEDIUM SHADE
|
||||
], clipPath: 'M0,0 L0.5,0 L0.5,1 L0,1 Z' },
|
||||
'\u{1FB8D}': { type: CustomGlyphDefinitionType.BLOCK_PATTERN, data: [ // RIGHT HALF MEDIUM SHADE
|
||||
[1, 0],
|
||||
[0, 1]
|
||||
], [0.5, 0, 0.5, 1]] },
|
||||
'\u{1FB8E}': { type: CustomGlyphDefinitionType.BLOCK_PATTERN_WITH_REGION, data: [[ // UPPER HALF MEDIUM SHADE
|
||||
], clipPath: 'M0.5,0 L1,0 L1,1 L0.5,1 Z' },
|
||||
'\u{1FB8E}': { type: CustomGlyphDefinitionType.BLOCK_PATTERN, data: [ // UPPER HALF MEDIUM SHADE
|
||||
[1, 0],
|
||||
[0, 1]
|
||||
], [0, 0, 1, 0.5]] },
|
||||
'\u{1FB8F}': { type: CustomGlyphDefinitionType.BLOCK_PATTERN_WITH_REGION, data: [[ // LOWER HALF MEDIUM SHADE
|
||||
], clipPath: 'M0,0 L1,0 L1,0.5 L0,0.5 Z' },
|
||||
'\u{1FB8F}': { type: CustomGlyphDefinitionType.BLOCK_PATTERN, data: [ // LOWER HALF MEDIUM SHADE
|
||||
[1, 0],
|
||||
[0, 1]
|
||||
], [0, 0.5, 1, 0.5]] },
|
||||
'\u{1FB90}': { type: CustomGlyphDefinitionType.BLOCK_PATTERN_WITH_REGION, data: [[ // INVERSE MEDIUM SHADE
|
||||
], clipPath: 'M0,0.5 L1,0.5 L1,1 L0,1 Z' },
|
||||
'\u{1FB90}': { type: CustomGlyphDefinitionType.BLOCK_PATTERN, data: [ // INVERSE MEDIUM SHADE
|
||||
[0, 1],
|
||||
[1, 0]
|
||||
], [0, 0, 1, 1]] },
|
||||
] },
|
||||
'\u{1FB91}': [ // UPPER HALF BLOCK AND LOWER HALF INVERSE MEDIUM SHADE
|
||||
{ type: CustomGlyphDefinitionType.BLOCK_PATTERN_WITH_REGION, data: [[
|
||||
{ type: CustomGlyphDefinitionType.BLOCK_PATTERN, data: [
|
||||
[0, 1],
|
||||
[1, 0]
|
||||
], [0, 0.5, 1, 0.5]] },
|
||||
], clipPath: 'M0,0.5 L1,0.5 L1,1 L0,1 Z' },
|
||||
{ type: CustomGlyphDefinitionType.SOLID_OCTANT_BLOCK_VECTOR, data: [{ x: 0, y: 0, w: 8, h: 4 }] }
|
||||
],
|
||||
'\u{1FB92}': [ // UPPER HALF INVERSE MEDIUM SHADE AND LOWER HALF BLOCK
|
||||
{ type: CustomGlyphDefinitionType.BLOCK_PATTERN_WITH_REGION, data: [[
|
||||
{ type: CustomGlyphDefinitionType.BLOCK_PATTERN, data: [
|
||||
[0, 1],
|
||||
[1, 0]
|
||||
], [0, 0, 1, 0.5]] },
|
||||
], clipPath: 'M0,0 L1,0 L1,0.5 L0,0.5 Z' },
|
||||
{ type: CustomGlyphDefinitionType.SOLID_OCTANT_BLOCK_VECTOR, data: [{ x: 0, y: 4, w: 8, h: 4 }] }
|
||||
],
|
||||
// 1FB93 is <reserved>
|
||||
'\u{1FB94}': [ // LEFT HALF INVERSE MEDIUM SHADE AND RIGHT HALF BLOCK
|
||||
{ type: CustomGlyphDefinitionType.BLOCK_PATTERN_WITH_REGION, data: [[
|
||||
{ type: CustomGlyphDefinitionType.BLOCK_PATTERN, data: [
|
||||
[0, 1],
|
||||
[1, 0]
|
||||
], [0, 0, 0.5, 1]] },
|
||||
], clipPath: 'M0,0 L0.5,0 L0.5,1 L0,1 Z' },
|
||||
{ type: CustomGlyphDefinitionType.SOLID_OCTANT_BLOCK_VECTOR, data: [{ x: 4, y: 0, w: 4, h: 8 }] }
|
||||
],
|
||||
|
||||
|
||||
@@ -5,7 +5,7 @@
|
||||
|
||||
import { throwIfFalsy } from 'browser/renderer/shared/RendererUtils';
|
||||
import { customGlyphDefinitions } from './CustomGlyphDefinitions';
|
||||
import { CustomGlyphDefinitionType, CustomGlyphVectorType, type CustomGlyphDefinitionPart, type CustomGlyphPathDrawFunctionDefinition, type CustomGlyphPatternDefinition, type CustomGlyphRegionDefinition, type ICustomGlyphSolidOctantBlockVector, type ICustomGlyphVectorShape } from './Types';
|
||||
import { CustomGlyphDefinitionType, CustomGlyphVectorType, type CustomGlyphDefinitionPart, type CustomGlyphPathDrawFunctionDefinition, type CustomGlyphPatternDefinition, type ICustomGlyphSolidOctantBlockVector, type ICustomGlyphVectorShape } from './Types';
|
||||
|
||||
/**
|
||||
* Try drawing a custom block element or box drawing character, returning whether it was
|
||||
@@ -59,9 +59,6 @@ function drawDefinitionPart(
|
||||
case CustomGlyphDefinitionType.BLOCK_PATTERN:
|
||||
drawPatternChar(ctx, part.data, xOffset, yOffset, deviceCellWidth, deviceCellHeight);
|
||||
break;
|
||||
case CustomGlyphDefinitionType.BLOCK_PATTERN_WITH_REGION:
|
||||
drawBlockPatternWithRegion(ctx, part.data, xOffset, yOffset, deviceCellWidth, deviceCellHeight);
|
||||
break;
|
||||
case CustomGlyphDefinitionType.PATH_FUNCTION:
|
||||
case CustomGlyphDefinitionType.PATH:
|
||||
drawPathDefinitionCharacter(ctx, part.data, xOffset, yOffset, deviceCellWidth, deviceCellHeight);
|
||||
@@ -420,40 +417,6 @@ function drawPatternChar(
|
||||
ctx.fillRect(xOffset, yOffset, deviceCellWidth, deviceCellHeight);
|
||||
}
|
||||
|
||||
/**
|
||||
* Draws rectangular shade characters - medium shade pattern clipped to a region.
|
||||
* Uses a checkerboard pattern that shifts 1px each row (same as medium shade U+2592).
|
||||
*/
|
||||
function drawBlockPatternWithRegion(
|
||||
ctx: CanvasRenderingContext2D,
|
||||
definition: [pattern: CustomGlyphPatternDefinition, region: CustomGlyphRegionDefinition],
|
||||
xOffset: number,
|
||||
yOffset: number,
|
||||
deviceCellWidth: number,
|
||||
deviceCellHeight: number
|
||||
): void {
|
||||
const [pattern, region] = definition;
|
||||
const [rx, ry, rw, rh] = region;
|
||||
const regionX = Math.round(xOffset + rx * deviceCellWidth);
|
||||
const regionY = Math.round(yOffset + ry * deviceCellHeight);
|
||||
const regionW = Math.round(rw * deviceCellWidth);
|
||||
const regionH = Math.round(rh * deviceCellHeight);
|
||||
|
||||
// Save context state
|
||||
ctx.save();
|
||||
|
||||
// Clip to the region
|
||||
ctx.beginPath();
|
||||
ctx.rect(regionX, regionY, regionW, regionH);
|
||||
ctx.clip();
|
||||
|
||||
// Draw the pattern
|
||||
drawPatternChar(ctx, pattern, xOffset, yOffset, deviceCellWidth, deviceCellHeight);
|
||||
|
||||
// Restore context state
|
||||
ctx.restore();
|
||||
}
|
||||
|
||||
function drawPathDefinitionCharacterWithWeight(
|
||||
ctx: CanvasRenderingContext2D,
|
||||
charDefinition: { [fontWeight: number]: string | ((xp: number, yp: number) => string) },
|
||||
|
||||
@@ -33,7 +33,6 @@ export type CustomGlyphPatternDefinition = number[][];
|
||||
export const enum CustomGlyphDefinitionType {
|
||||
SOLID_OCTANT_BLOCK_VECTOR,
|
||||
BLOCK_PATTERN,
|
||||
BLOCK_PATTERN_WITH_REGION,
|
||||
PATH_FUNCTION,
|
||||
PATH_FUNCTION_WITH_WEIGHT,
|
||||
PATH,
|
||||
@@ -41,12 +40,9 @@ export const enum CustomGlyphDefinitionType {
|
||||
VECTOR_SHAPE,
|
||||
}
|
||||
|
||||
export type CustomGlyphRegionDefinition = [x: number, y: number, w: number, h: number];
|
||||
|
||||
export type CustomGlyphDefinitionPartRaw = (
|
||||
{ type: CustomGlyphDefinitionType.SOLID_OCTANT_BLOCK_VECTOR, data: ICustomGlyphSolidOctantBlockVector[] } |
|
||||
{ type: CustomGlyphDefinitionType.BLOCK_PATTERN, data: CustomGlyphPatternDefinition } |
|
||||
{ type: CustomGlyphDefinitionType.BLOCK_PATTERN_WITH_REGION, data: [pattern: CustomGlyphPatternDefinition, region: CustomGlyphRegionDefinition] } |
|
||||
{ type: CustomGlyphDefinitionType.PATH_FUNCTION, data: CustomGlyphPathDrawFunctionDefinition } |
|
||||
{ type: CustomGlyphDefinitionType.PATH_FUNCTION_WITH_WEIGHT, data: { [fontWeight: number]: string | CustomGlyphPathDrawFunctionDefinition } } |
|
||||
{ type: CustomGlyphDefinitionType.PATH, data: string } |
|
||||
|
||||
Reference in New Issue
Block a user