Set output rows based on window size
This commit is contained in:
33
emu.js
33
emu.js
@@ -13,7 +13,6 @@ const PERIPHS_SIZE = 69; // Nice
|
||||
const POLL_INTERVAL_MS = 20;
|
||||
|
||||
const COLS = 80;
|
||||
const ROWS = 36;
|
||||
const TAB_WIDTH = 8;
|
||||
|
||||
const CURSOR_IDLE_TIME_MS = 1000;
|
||||
@@ -36,8 +35,9 @@ class Emulator {
|
||||
this.rx_queue = [];
|
||||
this.timer = setInterval(() => this.poll(), POLL_INTERVAL_MS);
|
||||
|
||||
this.rows = this.max_rows();
|
||||
this.grid = Array.from(
|
||||
{ length: ROWS },
|
||||
{ length: this.rows },
|
||||
() => new Array(COLS).fill(' '));
|
||||
this.cursor = { x: 0, y: 0 };
|
||||
this.range = {
|
||||
@@ -47,6 +47,7 @@ class Emulator {
|
||||
this.idle_timer = null;
|
||||
this.input_enable = false;
|
||||
document.addEventListener('keydown', (e) => this.handle_keydown(e));
|
||||
window.addEventListener('resize', () => this.handle_resize());
|
||||
|
||||
this.worker = new Worker('boot.js');
|
||||
this.worker.postMessage(this.mem);
|
||||
@@ -142,7 +143,7 @@ class Emulator {
|
||||
this.cursor_move(1, 0);
|
||||
} else if (e.key == 'Enter') {
|
||||
this.cursor.y = this.range.end.y + 1;
|
||||
if (this.cursor.y >= ROWS)
|
||||
while (this.cursor.y >= this.rows)
|
||||
this.scroll();
|
||||
this.cursor.x = 0;
|
||||
this.submit_line();
|
||||
@@ -228,7 +229,7 @@ class Emulator {
|
||||
next_cell(cell) {
|
||||
if (cell.x < COLS - 1)
|
||||
return { x: cell.x + 1, y: cell.y };
|
||||
else if (cell.y < ROWS - 1)
|
||||
else if (cell.y < this.rows - 1)
|
||||
return { x: 0, y: cell.y + 1 };
|
||||
else
|
||||
return null;
|
||||
@@ -295,6 +296,30 @@ class Emulator {
|
||||
this.range.start.y -= 1;
|
||||
this.range.end.y -= 1;
|
||||
}
|
||||
|
||||
max_rows() {
|
||||
const style = getComputedStyle(this.output);
|
||||
const line_height = parseFloat(style.lineHeight);
|
||||
const margin_top = parseFloat(style.marginTop);
|
||||
const margin_bottom = parseFloat(style.marginBottom);
|
||||
|
||||
const viewport_height = window.innerHeight;
|
||||
const output_height = viewport_height - margin_top - margin_bottom;
|
||||
return Math.floor(output_height / line_height) - 1;
|
||||
}
|
||||
|
||||
handle_resize() {
|
||||
this.rows = this.max_rows();
|
||||
while (this.grid.length < this.rows)
|
||||
this.grid.push(new Array(COLS).fill(' '));
|
||||
while (this.grid.length > this.rows) {
|
||||
this.grid.shift()
|
||||
this.cursor.y -= 1;
|
||||
this.range.start.y -= 1;
|
||||
this.range.end.y -= 1;
|
||||
}
|
||||
this.flush_output();
|
||||
}
|
||||
}
|
||||
|
||||
window.addEventListener('DOMContentLoaded', () => {
|
||||
|
||||
Reference in New Issue
Block a user