Something went wrong. Try again.
small gleam coding and persistent agent daemon with a detachable cli and a canvas ui forked from okami.mom/albedo
Something went wrong. Try again.
123456789101112131415161718192021222324252627282930313233343536373839404142import { prefs } from './prefs.svelte';
// On a narrow screen the client is a plain chat app unless the canvas is// asked for in settings: the session list, then one session's chat, with the// browser's back button between them.const NARROW = '(max-width: 760px)';
class Layout { #narrow = $state(matchMedia(NARROW).matches); phone = $derived(this.#narrow && !prefs.canvasOnPhone); /** The session open on the phone, or none for the list. */ session = $state<string | null>(history.state?.session ?? null); /** The session open full-screen over the canvas, or none. */ focus = $state<string | null>(null);
constructor() { matchMedia(NARROW).addEventListener('change', (event) => (this.#narrow = event.matches)); addEventListener('popstate', (event) => (this.session = event.state?.session ?? null)); }
open(sessionId: string) { if (this.session === sessionId) return; history.pushState({ session: sessionId }, ''); this.session = sessionId; }
back() { if (history.state?.session) history.back(); else this.session = null; }
focusSession(sessionId: string) { this.focus = sessionId; }
unfocus() { this.focus = null; }}
export const layout = new Layout();