mirror of
https://github.com/EthanShoeDev/fressh.git
synced 2026-01-12 23:02:49 +00:00
sorta working but bad init
This commit is contained in:
@@ -19,7 +19,7 @@ const root = document.getElementById('terminal')!;
|
||||
term.open(root);
|
||||
fitAddon.fit();
|
||||
|
||||
// Expose for debugging (optional)
|
||||
// Expose for debugging (typed via vite-env.d.ts)
|
||||
window.terminal = term;
|
||||
window.fitAddon = fitAddon;
|
||||
|
||||
@@ -30,7 +30,7 @@ const post = (msg: unknown) =>
|
||||
window.ReactNativeWebView?.postMessage?.(JSON.stringify(msg));
|
||||
|
||||
/**
|
||||
* Encode/decode helpers
|
||||
* Encode helper
|
||||
*/
|
||||
const enc = new TextEncoder();
|
||||
|
||||
@@ -50,74 +50,123 @@ term.onData((data /* string */) => {
|
||||
});
|
||||
|
||||
/**
|
||||
* Message handler for RN -> WebView control/data
|
||||
* We support: write, resize, setFont, setTheme, clear, focus
|
||||
* RN -> WebView control/data
|
||||
* Supported: write, resize, setFont, setTheme, setOptions, clear, focus
|
||||
* NOTE: Never spread term.options (it contains cols/rows). Only set keys you intend.
|
||||
*/
|
||||
window.addEventListener('message', (e: MessageEvent<string>) => {
|
||||
try {
|
||||
const msg = JSON.parse(e.data);
|
||||
const msg = JSON.parse(e.data) as
|
||||
| { type: 'write'; b64?: string; chunks?: string[] }
|
||||
| { type: 'resize'; cols?: number; rows?: number }
|
||||
| { type: 'setFont'; family?: string; size?: number }
|
||||
| { type: 'setTheme'; background?: string; foreground?: string }
|
||||
| {
|
||||
type: 'setOptions';
|
||||
opts: Partial<{
|
||||
cursorBlink: boolean;
|
||||
scrollback: number;
|
||||
fontFamily: string;
|
||||
fontSize: number;
|
||||
}>;
|
||||
}
|
||||
| { type: 'clear' }
|
||||
| { type: 'focus' };
|
||||
|
||||
if (!msg || typeof msg.type !== 'string') return;
|
||||
|
||||
switch (msg.type) {
|
||||
case 'write': {
|
||||
// Either a single b64 or an array of chunks
|
||||
if (typeof msg.b64 === 'string') {
|
||||
const bytes = Base64.toUint8Array(msg.b64);
|
||||
term.write(bytes);
|
||||
post({ type: 'debug', message: `write(bytes=${bytes.length})` });
|
||||
} else if (Array.isArray(msg.chunks)) {
|
||||
for (const b64 of msg.chunks) {
|
||||
const bytes = Base64.toUint8Array(b64);
|
||||
term.write(bytes);
|
||||
}
|
||||
post({
|
||||
type: 'debug',
|
||||
message: `write(chunks=${msg.chunks.length})`,
|
||||
});
|
||||
}
|
||||
break;
|
||||
}
|
||||
|
||||
case 'resize': {
|
||||
// Prefer fitAddon.fit(); only call resize if explicit cols/rows provided.
|
||||
if (typeof msg.cols === 'number' && typeof msg.rows === 'number') {
|
||||
try {
|
||||
term.resize(msg.cols, msg.rows);
|
||||
} finally {
|
||||
fitAddon.fit();
|
||||
}
|
||||
} else {
|
||||
// If cols/rows not provided, try fit
|
||||
fitAddon.fit();
|
||||
term.resize(msg.cols, msg.rows);
|
||||
post({ type: 'debug', message: `resize(${msg.cols}x${msg.rows})` });
|
||||
}
|
||||
fitAddon.fit();
|
||||
break;
|
||||
}
|
||||
|
||||
case 'setFont': {
|
||||
const { family, size } = msg;
|
||||
if (family) document.body.style.fontFamily = family;
|
||||
if (typeof size === 'number')
|
||||
document.body.style.fontSize = `${size}px`;
|
||||
fitAddon.fit();
|
||||
const patch: Partial<import('@xterm/xterm').ITerminalOptions> = {};
|
||||
if (family) patch.fontFamily = family;
|
||||
if (typeof size === 'number') patch.fontSize = size;
|
||||
if (Object.keys(patch).length) {
|
||||
term.options = patch; // no spread -> avoids cols/rows setters
|
||||
post({
|
||||
type: 'debug',
|
||||
message: `setFont(${family ?? ''}, ${size ?? ''})`,
|
||||
});
|
||||
fitAddon.fit();
|
||||
}
|
||||
break;
|
||||
}
|
||||
|
||||
case 'setTheme': {
|
||||
const { background, foreground } = msg;
|
||||
if (background) document.body.style.backgroundColor = background;
|
||||
// xterm theme API (optional)
|
||||
term.options = {
|
||||
...term.options,
|
||||
theme: {
|
||||
...(term.options.theme ?? {}),
|
||||
background,
|
||||
foreground,
|
||||
},
|
||||
};
|
||||
const theme: Partial<import('@xterm/xterm').ITheme> = {};
|
||||
if (background) {
|
||||
theme.background = background;
|
||||
document.body.style.backgroundColor = background;
|
||||
}
|
||||
if (foreground) theme.foreground = foreground;
|
||||
if (Object.keys(theme).length) {
|
||||
term.options = { theme }; // set only theme
|
||||
post({
|
||||
type: 'debug',
|
||||
message: `setTheme(bg=${background ?? ''}, fg=${foreground ?? ''})`,
|
||||
});
|
||||
}
|
||||
break;
|
||||
}
|
||||
|
||||
case 'setOptions': {
|
||||
const opts = msg.opts ?? {};
|
||||
// Filter out cols/rows defensively
|
||||
const { cursorBlink, scrollback, fontFamily, fontSize } = opts;
|
||||
const patch: Partial<import('@xterm/xterm').ITerminalOptions> = {};
|
||||
if (typeof cursorBlink === 'boolean') patch.cursorBlink = cursorBlink;
|
||||
if (typeof scrollback === 'number') patch.scrollback = scrollback;
|
||||
if (fontFamily) patch.fontFamily = fontFamily;
|
||||
if (typeof fontSize === 'number') patch.fontSize = fontSize;
|
||||
if (Object.keys(patch).length) {
|
||||
term.options = patch;
|
||||
post({
|
||||
type: 'debug',
|
||||
message: `setOptions(${Object.keys(patch).join(',')})`,
|
||||
});
|
||||
if (patch.fontFamily || patch.fontSize) fitAddon.fit();
|
||||
}
|
||||
break;
|
||||
}
|
||||
|
||||
case 'clear': {
|
||||
term.clear();
|
||||
post({ type: 'debug', message: 'clear()' });
|
||||
break;
|
||||
}
|
||||
|
||||
case 'focus': {
|
||||
term.focus();
|
||||
post({ type: 'debug', message: 'focus()' });
|
||||
break;
|
||||
}
|
||||
}
|
||||
@@ -127,7 +176,7 @@ window.addEventListener('message', (e: MessageEvent<string>) => {
|
||||
});
|
||||
|
||||
/**
|
||||
* Handle container resize
|
||||
* Keep terminal size in sync with container
|
||||
*/
|
||||
new ResizeObserver(() => {
|
||||
try {
|
||||
|
||||
Reference in New Issue
Block a user