This commit is contained in:
meganrogge
2022-03-17 15:14:35 -04:00
parent e293d29fd3
commit c70be89bc2
4 changed files with 11 additions and 12 deletions
+3 -3
View File
@@ -557,9 +557,9 @@ function addDecoration() {
function addOverviewRuler() {
term.options['overviewRulerWidth'] = 15;
term.registerDecoration({marker: term.addMarker(1), overviewRulerOptions: { color: '#ef2929' }});
term.registerDecoration({marker: term.addMarker(3), overviewRulerOptions: { color: '#8ae234' }});
term.registerDecoration({marker: term.addMarker(5), overviewRulerOptions: { color: '#729fcf' }});
term.registerDecoration({marker: term.addMarker(1), overviewRulerOptions: { color: '#ef2929', position: 'full' }});
term.registerDecoration({marker: term.addMarker(3), overviewRulerOptions: { color: '#8ae234', position: 'full' }});
term.registerDecoration({marker: term.addMarker(5), overviewRulerOptions: { color: '#729fcf', position: 'full' }});
term.registerDecoration({marker: term.addMarker(7), overviewRulerOptions: { color: '#ef2929', position: 'left' }});
term.registerDecoration({marker: term.addMarker(7), overviewRulerOptions: { color: '#8ae234', position: 'center' }});
term.registerDecoration({marker: term.addMarker(7), overviewRulerOptions: { color: '#729fcf', position: 'right' }});
@@ -94,11 +94,10 @@ export class OverviewRulerRenderer extends Disposable {
this._ctx.lineWidth = 1;
this._ctx.fillStyle = decoration.options.overviewRulerOptions.color;
this._ctx.fillRect(
!decoration.options.overviewRulerOptions.position || decoration.options.overviewRulerOptions.position === 'left' ? 0 : decoration.options.overviewRulerOptions.position === 'right' ? renderSizes[SizeIndex.OUTER_SIZE] + renderSizes[SizeIndex.INNER_SIZE]: renderSizes[SizeIndex.OUTER_SIZE],
decoration.options.overviewRulerOptions.position === 'full' || decoration.options.overviewRulerOptions.position === 'left' ? 0 : decoration.options.overviewRulerOptions.position === 'right' ? renderSizes[SizeIndex.OUTER_SIZE] + renderSizes[SizeIndex.INNER_SIZE]: renderSizes[SizeIndex.OUTER_SIZE],
Math.round(this._canvas.height * (decoration.options.marker.line / this._bufferService.buffers.active.lines.length)),
!decoration.options.overviewRulerOptions.position ? this._width : decoration.options.overviewRulerOptions.position === 'center' ? renderSizes[SizeIndex.INNER_SIZE] : renderSizes[SizeIndex.OUTER_SIZE],
// when a position is provided, the element has less width, so increase its height
window.devicePixelRatio * (decoration.options.overviewRulerOptions.position ? 6 : 2)
decoration.options.overviewRulerOptions.position === 'full' ? this._width : decoration.options.overviewRulerOptions.position === 'center' ? renderSizes[SizeIndex.INNER_SIZE] : renderSizes[SizeIndex.OUTER_SIZE],
window.devicePixelRatio * (decoration.options.overviewRulerOptions.position === 'full' ? 2 : 6)
);
}
+4 -4
View File
@@ -770,8 +770,8 @@ describe('API Integration Tests', function(): void {
await page.waitForSelector('.xterm-text-layer');
await page.evaluate(`window.marker1 = window.term.addMarker(1)`);
await page.evaluate(`window.marker2 = window.term.addMarker(2)`);
await page.evaluate(`window.term.registerDecoration({ marker: window.marker1, overviewRulerOptions: { color: 'red' } })`);
await page.evaluate(`window.term.registerDecoration({ marker: window.marker2, overviewRulerOptions: { color: 'blue' } })`);
await page.evaluate(`window.term.registerDecoration({ marker: window.marker1, overviewRulerOptions: { color: 'red', position: 'full' } })`);
await page.evaluate(`window.term.registerDecoration({ marker: window.marker2, overviewRulerOptions: { color: 'blue', position: 'full' } })`);
await openTerminal(page);
await pollFor(page, `document.querySelectorAll('.xterm-decoration-overview-ruler').length`, 0);
});
@@ -781,8 +781,8 @@ describe('API Integration Tests', function(): void {
await page.waitForSelector('.xterm-text-layer');
await page.evaluate(`window.marker1 = window.term.addMarker(1)`);
await page.evaluate(`window.marker2 = window.term.addMarker(2)`);
await page.evaluate(`window.term.registerDecoration({ marker: window.marker1, overviewRulerOptions: { color: 'red' } })`);
await page.evaluate(`window.term.registerDecoration({ marker: window.marker2, overviewRulerOptions: { color: 'blue' } })`);
await page.evaluate(`window.term.registerDecoration({ marker: window.marker1, overviewRulerOptions: { color: 'red', position: 'full' } })`);
await page.evaluate(`window.term.registerDecoration({ marker: window.marker2, overviewRulerOptions: { color: 'blue', position: 'full' } })`);
await openTerminal(page);
await pollFor(page, `document.querySelectorAll('.xterm-decoration-overview-ruler').length`, 1);
});
+1 -1
View File
@@ -479,7 +479,7 @@ declare module 'xterm' {
* @param color The color of the decoration.
* @param position The position of the decoration.
*/
readonly overviewRulerOptions?: { color: string; position?: 'left' | 'center' | 'right'}
readonly overviewRulerOptions?: { color: string; position: 'left' | 'center' | 'right' | 'full'}
}
/**