proxmox-mirrors/mirror_xterm.js
1
0
Fork 0
mirror of https://git.proxmox.com/git/mirror_xterm.js synced 2025-10-26 01:10:32 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

Add base viewport, set line height

Browse Source 
Fixes #149
This commit is contained in:
Daniel Imms 2016-08-02 12:42:10 -07:00
parent d2cef6f29d
commit 670b0d58c7
2 changed files with 41 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
src/xterm.css
View File

@ -103,6 +103,13 @@
display: block; display: block;
} }
.terminal .xterm-char-measure-element {
display: inline-block;
visibility: hidden;
position: absolute;
left: -9999em;
}
/* /*
* Determine default colors for xterm.js * Determine default colors for xterm.js
*/ */
@ -2169,11 +2176,3 @@
.terminal .xterm-bg-color-255 { .terminal .xterm-bg-color-255 {
background-color: #eeeeee; background-color: #eeeeee;
} }
/**
* All terminal rows should have explicitly declared height,
* in order to allow child elements to adjust.
*/
.terminal .xterm-rows > div {
line-height: normal;
}

38
src/xterm.js
View File

@ -324,6 +324,24 @@
this.textarea.style.top = ''; this.textarea.style.top = '';
} }
function Viewport(terminal, viewportElement, charMeasureElement) {
this.terminal = terminal;
this.viewportElement = viewportElement;
this.charMeasureElement = charMeasureElement;
this.currentHeight = 0;
this.terminal.on('refresh', this.refreshRowHeight.bind(this));
}
Viewport.prototype.refreshRowHeight = function() {
var size = this.charMeasureElement.getBoundingClientRect();
if (size.height > 0 && size.height !== this.currentHeight) {
this.currentHeight = size.height;
this.terminal.rowContainer.style.lineHeight = size.height + 'px';
this.terminal.rowContainer.style.height = size.height * this.terminal.rows;
}
}
/** /**
* States * States
*/ */
@ -787,7 +805,6 @@
return row; return row;
}; };
/** /**
* Opens the terminal within an element. * Opens the terminal within an element.
* *
@ -841,15 +858,21 @@
this.element.classList.add('terminal'); this.element.classList.add('terminal');
this.element.classList.add('xterm'); this.element.classList.add('xterm');
this.element.classList.add('xterm-theme-' + this.theme); this.element.classList.add('xterm-theme-' + this.theme);
this.element.style.height
this.element.setAttribute('tabindex', 0); this.element.setAttribute('tabindex', 0);
this.viewportElement = document.createElement('div');
this.viewportElement.classList.add('xterm-viewport');
this.element.appendChild(this.viewportElement);
/* /*
* Create the container that will hold the lines of the terminal and then * Create the container that will hold the lines of the terminal and then
* produce the lines the lines. * produce the lines the lines.
*/ */
this.rowContainer = document.createElement('div'); this.rowContainer = document.createElement('div');
this.rowContainer.classList.add('xterm-rows'); this.rowContainer.classList.add('xterm-rows');
this.element.appendChild(this.rowContainer); this.viewportElement.appendChild(this.rowContainer);
this.children = []; this.children = [];
/* /*
@ -879,6 +902,13 @@
this.compositionHelper = new CompositionHelper(this.textarea, this.compositionView, this); this.compositionHelper = new CompositionHelper(this.textarea, this.compositionView, this);
this.helperContainer.appendChild(this.compositionView); this.helperContainer.appendChild(this.compositionView);
this.charMeasureElement = document.createElement('div');
this.charMeasureElement.classList.add('xterm-char-measure-element');
this.charMeasureElement.innerHTML = 'W';
this.helperContainer.appendChild(this.charMeasureElement);
this.viewport = new Viewport(this, this.viewportElement, this.charMeasureElement);
for (; i < this.rows; i++) { for (; i < this.rows; i++) {
this.insertRow(); this.insertRow();
} }
@ -1367,7 +1397,7 @@
if (end - start >= this.rows / 2) { if (end - start >= this.rows / 2) {
parent = this.element.parentNode; parent = this.element.parentNode;
if (parent) { if (parent) {
this.element.removeChild(this.rowContainer); this.viewportElement.removeChild(this.rowContainer);
} }
} }
@ -1517,7 +1547,7 @@
} }
if (parent) { if (parent) {
this.element.appendChild(this.rowContainer); this.viewportElement.appendChild(this.rowContainer);
} }
this.emit('refresh', {element: this.element, start: start, end: end}); this.emit('refresh', {element: this.element, start: start, end: end});