* Resize canvas to fit terminal dimensions
(cols: number, rows: number)
| 234 | * Resize canvas to fit terminal dimensions |
| 235 | */ |
| 236 | public resize(cols: number, rows: number): void { |
| 237 | const cssWidth = cols * this.metrics.width; |
| 238 | const cssHeight = rows * this.metrics.height; |
| 239 | |
| 240 | // Set CSS size (what user sees) |
| 241 | this.canvas.style.width = `${cssWidth}px`; |
| 242 | this.canvas.style.height = `${cssHeight}px`; |
| 243 | |
| 244 | // Set actual canvas size (scaled for DPI) |
| 245 | this.canvas.width = cssWidth * this.devicePixelRatio; |
| 246 | this.canvas.height = cssHeight * this.devicePixelRatio; |
| 247 | |
| 248 | // Scale context to match DPI (setting canvas.width/height resets the context) |
| 249 | this.ctx.scale(this.devicePixelRatio, this.devicePixelRatio); |
| 250 | |
| 251 | // Set text rendering properties for crisp text |
| 252 | this.ctx.textBaseline = 'alphabetic'; |
| 253 | this.ctx.textAlign = 'left'; |
| 254 | |
| 255 | // Fill background after resize |
| 256 | this.ctx.fillStyle = this.theme.background; |
| 257 | this.ctx.fillRect(0, 0, cssWidth, cssHeight); |
| 258 | } |
| 259 | |
| 260 | // ========================================================================== |
| 261 | // Main Rendering |