diff --git a/demo/main.js b/demo/main.js index 51d86ce3..b03edf7d 100644 --- a/demo/main.js +++ b/demo/main.js @@ -1,13 +1,13 @@ var terminalContainer = document.getElementById('terminal-container'), - term = new Terminal({ - geometry: [95, 37] - }); + term = new Terminal(); + +term.open(terminalContainer); +term.fit(); term.prompt = function () { term.write('\r\n> '); } -term.open(terminalContainer); term.writeln('Welcome to xterm.js'); term.writeln('Just type some keys in the prompt below.'); term.writeln(''); diff --git a/src/xterm.js b/src/xterm.js index 88b85020..0926be4a 100644 --- a/src/xterm.js +++ b/src/xterm.js @@ -2712,9 +2712,38 @@ Terminal.prototype.resize = function(x, y) { this.normal = null; - this.emit('resize', {terminal: this, columns: x, rows: y}); + this.emit('resize', {terminal: this, cols: x, rows: y}); }; +/* +* 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) +*/ +Terminal.prototype.fit = function () { + var container = this.element.parentElement, + subjectRow = this.element.firstElementChild, + rows = parseInt(container.offsetHeight / subjectRow.offsetHeight), + characterWidth, + cols; + + subjectRow.style.display = 'inline'; + characterWidth = parseInt(subjectRow.offsetWidth / this.cols); + subjectRow.style.display = ''; + + cols = parseInt(container.offsetWidth / characterWidth); + + this.resize(cols, rows); +} + Terminal.prototype.updateRange = function(y) { if (y < this.refreshStart) this.refreshStart = y; if (y > this.refreshEnd) this.refreshEnd = y;