mirror_xterm.js/addons/fit/fit.js
paris 8dd80566d0 Fix #9
- Calculate character width by using the cursor instead of custom hack in fit addon
- Increment character width by 1 in Firefox, since it seems to have a bug in calculating width of specific elements
2014-11-17 17:08:14 +02:00

72 lines
2.4 KiB
JavaScript

/*
* Fit terminal columns and rows to the dimensions of its
* DOM element.
*
* Approach:
* - Rows: Truncate the division of the terminal parent element height
* by the terminal row height
*
* - Columns: Truncate the division of the terminal parent element width by
* the terminal character width (apply display: inline at the
* terminal row and truncate its width with the current number
* of columns)
*/
(function (fit) {
if (typeof define == 'function') {
/*
* Require.js is available
*/
define(['../../src/xterm'], fit);
} else {
/*
* Plain browser environment
*/
fit(this.Xterm);
}
})(function (Xterm) {
Xterm.prototype.proposeGeometry = function () {
var container = this.rowContainer,
subjectRow = this.rowContainer.firstElementChild,
cursor = this.element.querySelector('.terminal-cursor'),
rows,
characterWidth,
cols;
characterWidth = Math.ceil(cursor.offsetWidth);
/*
* The following hack takes place in order to get "fit" work properly
* in Mozilla Firefox.
* Most probably, because of a dimension calculation bug, Firefox
* calculates the width to be 1px less than it is actually drawn on
* screen.
*/
if (navigator.userAgent.match(/Gecko/)) {
characterWidth++;
}
cols = parseInt(container.offsetWidth / characterWidth);
var parentElementStyle = window.getComputedStyle(this.element.parentElement),
parentElementHeight = parseInt(parentElementStyle.getPropertyValue('height')),
elementStyle = window.getComputedStyle(this.element),
elementPadding = parseInt(elementStyle.getPropertyValue('padding-top')) + parseInt(elementStyle.getPropertyValue('padding-bottom')),
availableHeight = parentElementHeight - elementPadding,
rowHeight = this.rowContainer.firstElementChild.offsetHeight;
rows = parseInt(availableHeight / rowHeight);
var geometry = {
'cols': cols,
'rows': rows
};
return geometry;
};
Xterm.prototype.fit = function () {
var geometry = this.proposeGeometry();
this.resize(geometry.cols, geometry.rows);
};
});