edbfc62f7f
A shared PTY can only be one size; min-sizing clamped the shared session to the SMALLEST viewer, so a wide desktop got letterboxed when an iPad was also attached (iPad looked full-screen, desktop did not). Switch to latest-writer-wins: the device that most recently fit/focused drives the PTY size, so whichever device you're actively using is full-screen. - session.ts: setClientDims resizes the PTY directly (drop min across clients); attach/detach/blur never resize (the active device keeps its size) - frontend: TerminalSession.refit() force-resends dims; window 'focus' / visibilitychange re-assert the active tab's size, so switching devices reclaims full-screen - tests updated for latest-wins (incl. join/hidden/blur don't resize) Verified (two ws clients): 200x50 → iPad 100x40 → desktop refit 200x50 → iPad blur keeps 200x50. 225 tests green.
100 lines
3.4 KiB
TypeScript
100 lines
3.4 KiB
TypeScript
/**
|
|
* public/main.ts — esbuild entry point for the browser frontend.
|
|
*
|
|
* Bootstraps the multi-tab app: a tab bar (#tabs) + a utility toolbar (#toolbar)
|
|
* over a stack of terminal panes (#term), each tab an independent TerminalSession.
|
|
* The mobile key bar routes input to the active tab.
|
|
*
|
|
* Per-session terminal/WS/reconnect logic lives in terminal-session.ts;
|
|
* tab management + persistence in tabs.ts.
|
|
*/
|
|
|
|
// CSS side-effect import (esbuild → public/build/main.css; typed via css.d.ts).
|
|
import '@xterm/xterm/css/xterm.css'
|
|
import { mountKeybar } from './keybar.js'
|
|
import { TabApp } from './tabs.js'
|
|
import { mountSearch } from './search.js'
|
|
import { mountQrConnect } from './qr.js'
|
|
import { mountSettings, loadSettings, type Settings } from './settings.js'
|
|
import { mountDashboard } from './dashboard.js'
|
|
import { mountHistory } from './history.js'
|
|
import { mountShortcuts } from './shortcuts.js'
|
|
import { mountShareSession } from './share.js'
|
|
|
|
const paneHost = document.getElementById('term')
|
|
const tabs = document.getElementById('tabs')
|
|
const toolbar = document.getElementById('toolbar')
|
|
if (!paneHost) throw new Error('#term element not found in DOM')
|
|
if (!tabs) throw new Error('#tabs element not found in DOM')
|
|
if (!toolbar) throw new Error('#toolbar element not found in DOM')
|
|
|
|
const app = new TabApp(paneHost, tabs)
|
|
|
|
// v0.4: a share link (?join=<id>) opens/focuses that shared session, then we
|
|
// strip the param so a refresh doesn't keep re-opening it.
|
|
const joinId = new URLSearchParams(location.search).get('join')
|
|
if (joinId) {
|
|
app.openSession(joinId)
|
|
history.replaceState(null, '', location.pathname)
|
|
}
|
|
|
|
// Apply saved theme/font (M3) to the restored tabs.
|
|
let settings: Settings = loadSettings()
|
|
app.applySettings(settings)
|
|
|
|
// Key bar (mobile + desktop) sends to whichever tab is active.
|
|
mountKeybar((data) => app.sendToActive(data))
|
|
|
|
// Multi-device: when this device regains focus, re-assert the active tab's size
|
|
// so a shared session snaps to THIS screen (latest-writer-wins) — full-screen on
|
|
// whichever device you're currently using.
|
|
window.addEventListener('focus', () => app.refitActive())
|
|
document.addEventListener('visibilitychange', () => {
|
|
if (!document.hidden) app.refitActive()
|
|
})
|
|
|
|
// Toolbar utilities.
|
|
mountSearch(toolbar, {
|
|
find: (query, dir) => app.findInActive(query, dir),
|
|
clear: () => app.clearActiveSearch(),
|
|
})
|
|
mountSettings(
|
|
toolbar,
|
|
() => settings,
|
|
(s) => {
|
|
settings = s
|
|
app.applySettings(s)
|
|
},
|
|
)
|
|
mountDashboard(toolbar, {
|
|
snapshot: () => app.snapshot(),
|
|
focus: (idx) => app.focusTab(idx),
|
|
})
|
|
mountHistory(toolbar, {
|
|
resume: (cwd, id) => app.newTabForResume(cwd, id),
|
|
})
|
|
mountShortcuts(toolbar)
|
|
mountShareSession(toolbar, () => app.activeSessionId())
|
|
|
|
// Session manager (standalone page) — manage/kill the host's running sessions.
|
|
const manageBtn = document.createElement('button')
|
|
manageBtn.className = 'toolbtn'
|
|
manageBtn.textContent = '🗂'
|
|
manageBtn.title = 'Manage sessions (open / kill)'
|
|
manageBtn.setAttribute('aria-label', 'Manage sessions')
|
|
manageBtn.addEventListener('click', () => {
|
|
location.href = '/manage.html'
|
|
})
|
|
toolbar.appendChild(manageBtn)
|
|
|
|
mountQrConnect(toolbar)
|
|
|
|
// PWA: register the service worker (installable + offline shell, M4).
|
|
if ('serviceWorker' in navigator) {
|
|
window.addEventListener('load', () => {
|
|
void navigator.serviceWorker.register('./sw.js').catch(() => {
|
|
// SW registration is best-effort; the app works without it.
|
|
})
|
|
})
|
|
}
|