@glassly/engine 0.1.0-dev.98 → 0.2.8-dev.445

package/build/services/CustomDashboardService.js

@@ -1,576 +0,0 @@
-/**
- * Scene API dashboard for G2 custom firmware.
- *
- * G2.swift marks the published firmware version after it detects the CFW
- * capability advertisement. DashboardCoordinator owns open/close and display
- * switching; this service renders the widgets and handles gestures while open.
- *
- * The dashboard is composed of user-orderable widgets (clock, calendar, apps
- * button, notifications button) stacked vertically on the CFW scene canvas.
- * The apps button switches to a second, dashboard-rendered app menu view.
- */
-import { File } from "expo-file-system";
-import { BluetoothSdk } from "@glassly/bluetooth-sdk";
-import { MiniappErrorCode } from "@glassly/miniapp";
-import { useAppStatusStore } from "../stores/apps";
-import { useGlassesStore } from "../stores/glasses";
-import { SETTINGS, useSettingsStore } from "../stores/settings";
-import { TextMeasurer } from "../utils/display/measurer";
-import { BgTimer } from "../utils/timers";
-import { appMenuActions, dashboardActions, formatDashboardClock, isCustomDashboardEligible, normalizeDashboardWidgets, orderedDashboardApps, } from "./CustomDashboardModel";
-import displayProcessor from "./DisplayProcessor";
-import { isGlassesConnected } from "./GlassesReadiness";
-import localDisplayManager from "./LocalDisplayManager";
-import { listPhoneCalendarEvents, PhoneCalendarError } from "./PhoneCalendarService";
-import sceneRenderer from "./SceneRenderer";
-const DASHBOARD_APP_ID = "system.custom-dashboard";
-const CLOCK_REFRESH_MS = 30_000;
-const CALENDAR_REFRESH_MS = 5 * 60_000;
-/** Matches the boot message's window; stops have no unmount-driven end signal. */
-const STOP_NOTICE_MS = 1500;
-// CFW blits the stock compositor's 576×288 canvas; used when the firmware has
-// not reported scene capabilities yet.
-const FALLBACK_CANVAS = { width: 576, height: 288 };
-const MARGIN_X = 16;
-const MARGIN_TOP = 10;
-const WIDGET_GAP = 10;
-/** Row height for the glasses' builtin 20px font engine. */
-const LINE_H = 24;
-const BUTTON_H = 34;
-/**
- * Selection marker: a text-hugging bar under the focused label instead of a
- * boxed border. Drawn as a rect (h 3, border 2 — the strokes overlap into a
- * solid bar) because mode 15 renders only glyphs; the bar must be in the
- * raster or the firmware never shows it.
- */
-const UNDERLINE_H = 3;
-/** Row-top → underline-top: just under the builtin font's 27px line. */
-const UNDERLINE_OFFSET_Y = BUTTON_H - 4;
-/**
- * App-menu icon grid: 2 rows × 4 columns per page. CFW rasterizes scenes
- * phone-side, so the stock firmware's 4-image container pool does not bound
- * the page (getEffectiveCapabilities lifts the element caps while the CFW
- * canvas is active).
- */
-const APP_GRID_COLS = 4;
-const APP_GRID_ROWS = 2;
-const APPS_PER_PAGE = APP_GRID_COLS * APP_GRID_ROWS;
-const APP_CELL = 36;
-const APP_CELL_GAP = 12;
-const APP_ICON_INSET = 2;
-const APP_ICON = APP_CELL - APP_ICON_INSET * 2;
-function eventLine(event) {
-    const when = event.allDay
-        ? "All day"
-        : new Intl.DateTimeFormat(undefined, { hour: "numeric", minute: "2-digit" }).format(new Date(event.startsAt));
-    return `${when}  ${event.title}`;
-}
-class CustomDashboardService {
-    started = false;
-    open = false;
-    /** Set by DashboardCoordinator; asks it to close (and restore main content). */
-    onRequestClose = null;
-    view = "main";
-    mainIndex = 0;
-    appsIndex = 0;
-    /** "loading" until the first fetch resolves; "no-access" only for a real permission denial. */
-    calendarStatus = "loading";
-    /** packageName → base64 icon bytes, or null when the icon can't be loaded (monogram fallback). */
-    iconCache = new Map();
-    iconLoads = new Set();
-    calendarEvents = [];
-    unsubs = [];
-    clockTimer = null;
-    calendarTimer = null;
-    /** Last observed eligibility, for transition detection. */
-    eligible = false;
-    start() {
-        if (this.started)
-            return;
-        this.started = true;
-        this.unsubs.push(useGlassesStore.subscribe((state) => `${state.connection.state}:${state.deviceModel}:${state.firmwareVersion}`, () => {
-            if (!this.syncEligibility())
-                return;
-            void this.refreshCalendarAndRender();
-        }), 
-        // Selector: only dashboard-relevant settings retrigger a refresh. The
-        // whole-store form fired a calendar query on every settings write.
-        useSettingsStore.subscribe((state) => JSON.stringify([
-            state.getSetting(SETTINGS.custom_dashboard_enabled.key),
-            state.getSetting(SETTINGS.custom_dashboard_widgets.key),
-            state.getSetting(SETTINGS.custom_dashboard_clock_style.key),
-            state.getSetting(SETTINGS.custom_dashboard_clock_show_date.key),
-            state.getSetting(SETTINGS.twelve_hour_time.key),
-            state.getSetting(SETTINGS.custom_dashboard_calendar_event_count.key),
-            state.getSetting(SETTINGS.custom_dashboard_calendar_days_ahead.key),
-            state.getSetting(SETTINGS.menu_apps.key),
-        ]), () => {
-            if (!this.syncEligibility())
-                return;
-            void this.refreshCalendarAndRender();
-        }), useAppStatusStore.subscribe(() => {
-            if (this.isEligible())
-                this.render();
-        }));
-        this.clockTimer = BgTimer.setInterval(() => {
-            if (this.isEligible())
-                this.render();
-        }, CLOCK_REFRESH_MS);
-        this.calendarTimer = BgTimer.setInterval(() => {
-            if (this.isEligible())
-                void this.refreshCalendarAndRender();
-        }, CALENDAR_REFRESH_MS);
-        this.eligible = this.isEligible();
-    }
-    /**
-     * Track eligible⇄ineligible transitions from any trigger (setting toggle,
-     * connect/disconnect, firmware change). Leaving closes the dashboard via the
-     * coordinator (which restores main content) and drops the retained scene so
-     * a stale frame can't be replayed after the feature was turned off.
-     */
-    syncEligibility() {
-        const eligible = this.isEligible();
-        if (eligible === this.eligible)
-            return eligible;
-        this.eligible = eligible;
-        if (!eligible) {
-            if (this.open)
-                this.onRequestClose?.();
-            this.open = false;
-            this.resetNavigation();
-            sceneRenderer.clearApp(DASHBOARD_APP_ID);
-        }
-        return eligible;
-    }
-    stop() {
-        for (const unsub of this.unsubs)
-            unsub();
-        this.unsubs = [];
-        if (this.clockTimer !== null)
-            BgTimer.clearInterval(this.clockTimer);
-        if (this.calendarTimer !== null)
-            BgTimer.clearInterval(this.calendarTimer);
-        this.clockTimer = null;
-        this.calendarTimer = null;
-        if (this.open)
-            this.onRequestClose?.();
-        this.open = false;
-        this.eligible = false;
-        this.resetNavigation();
-        this.started = false;
-        sceneRenderer.clearApp(DASHBOARD_APP_ID);
-    }
-    isEligible() {
-        if (useSettingsStore.getState().getSetting(SETTINGS.custom_dashboard_enabled.key) === false)
-            return false;
-        const state = useGlassesStore.getState();
-        return (isGlassesConnected(state.connection) &&
-            isCustomDashboardEligible({
-                model: state.deviceModel,
-                firmwareVersion: state.firmwareVersion,
-            }));
-    }
-    get isOpen() {
-        return this.open;
-    }
-    /** Coordinator opened the dashboard: render fresh from the top. */
-    show() {
-        this.open = true;
-        this.resetNavigation();
-        void this.refreshCalendarAndRender();
-    }
-    /** Coordinator closed the dashboard. */
-    hide() {
-        this.open = false;
-        this.resetNavigation();
-    }
-    /** Returns true when an open custom dashboard consumed the gesture. */
-    handleGesture(gestureName) {
-        if (!this.open || !this.isEligible())
-            return false;
-        if (gestureName === "double_tap") {
-            // In the app menu a double tap backs out to the top of the dashboard
-            // (there is no Back row); on the main view it closes the dashboard.
-            if (this.view === "apps") {
-                this.resetNavigation();
-                this.render();
-                return true;
-            }
-            this.onRequestClose?.();
-            return true;
-        }
-        if (this.view === "apps")
-            return this.handleAppMenuGesture(gestureName);
-        return this.handleMainGesture(gestureName);
-    }
-    resetNavigation() {
-        this.view = "main";
-        this.mainIndex = 0;
-        this.appsIndex = 0;
-    }
-    handleMainGesture(gestureName) {
-        const actions = dashboardActions(this.widgets());
-        if (this.mainIndex >= actions.length)
-            this.mainIndex = Math.max(0, actions.length - 1);
-        if (gestureName === "swipe_down" || gestureName === "swipe_up") {
-            if (actions.length === 0)
-                return true;
-            const delta = gestureName === "swipe_down" ? 1 : -1;
-            this.mainIndex = (this.mainIndex + delta + actions.length) % actions.length;
-            this.render();
-            return true;
-        }
-        if (gestureName === "single_tap") {
-            const action = actions[this.mainIndex];
-            if (action?.kind === "apps-menu") {
-                this.view = "apps";
-                this.appsIndex = 0;
-                this.render();
-            }
-            else if (action?.kind === "notifications") {
-                void this.openNotificationsPanel();
-            }
-            return true;
-        }
-        return false;
-    }
-    handleAppMenuGesture(gestureName) {
-        const rows = appMenuActions(this.menuApps());
-        if (this.appsIndex >= rows.length)
-            this.appsIndex = Math.max(0, rows.length - 1);
-        if (gestureName === "swipe_down" || gestureName === "swipe_up") {
-            const delta = gestureName === "swipe_down" ? 1 : -1;
-            this.appsIndex = (this.appsIndex + delta + rows.length) % rows.length;
-            this.render();
-            return true;
-        }
-        if (gestureName === "single_tap") {
-            const row = rows[this.appsIndex];
-            if (row?.kind === "app") {
-                void this.toggleApp(row.packageName);
-            }
-            return true;
-        }
-        return false;
-    }
-    menuApps() {
-        const menu = useSettingsStore.getState().getSetting(SETTINGS.menu_apps.key);
-        return orderedDashboardApps(menu, useAppStatusStore.getState().apps);
-    }
-    widgets() {
-        return normalizeDashboardWidgets(useSettingsStore.getState().getSetting(SETTINGS.custom_dashboard_widgets.key));
-    }
-    async openNotificationsPanel() {
-        this.onRequestClose?.();
-        await BluetoothSdk.showNativeNotificationPanel().catch((error) => {
-            console.error("CustomDashboard: notification panel failed", error);
-        });
-    }
-    async toggleApp(packageName) {
-        this.onRequestClose?.();
-        const app = useAppStatusStore.getState().apps.find((candidate) => candidate.packageName === packageName);
-        if (!app)
-            return;
-        if (app.running) {
-            // Mirror the "Starting X…" boot message: without this the dashboard just
-            // closes and the stop is invisible on the glasses.
-            localDisplayManager.showSystemNotice(`Stopping ${app.name}…`, STOP_NOTICE_MS);
-            await useAppStatusStore.getState().stop(app.packageName);
-        }
-        else {
-            await useAppStatusStore.getState().start(app, { skipNavigation: true });
-        }
-    }
-    calendarWidgetEnabled() {
-        return this.widgets().some((widget) => widget.id === "calendar" && widget.enabled);
-    }
-    async refreshCalendarAndRender() {
-        if (!this.open)
-            return;
-        if (!this.calendarWidgetEnabled()) {
-            this.calendarStatus = "loading";
-            this.calendarEvents = [];
-            this.render();
-            return;
-        }
-        const settings = useSettingsStore.getState();
-        const count = Number(settings.getSetting(SETTINGS.custom_dashboard_calendar_event_count.key) ?? 2);
-        const days = Number(settings.getSetting(SETTINGS.custom_dashboard_calendar_days_ahead.key) ?? 3);
-        const startsAt = new Date();
-        const endsAt = new Date(startsAt.getTime() + Math.max(1, days) * 24 * 60 * 60 * 1000);
-        try {
-            const result = await listPhoneCalendarEvents({
-                startsAt: startsAt.toISOString(),
-                endsAt: endsAt.toISOString(),
-                limit: Math.max(1, Math.min(3, count)),
-            });
-            this.calendarStatus = "ok";
-            this.calendarEvents = result.events;
-        }
-        catch (error) {
-            // Permission is requested from the Custom Dashboard settings screen;
-            // only a real denial should read as one — any other failure is
-            // "Unavailable" (and logged) so it can't masquerade as a permission
-            // problem.
-            const denied = error instanceof PhoneCalendarError && error.code === MiniappErrorCode.PERMISSION_DENIED;
-            this.calendarStatus = denied ? "no-access" : "unavailable";
-            this.calendarEvents = [];
-            if (!denied)
-                console.warn("CustomDashboard: calendar fetch failed", error);
-        }
-        this.render();
-    }
-    /** Underline hugging a builtin-font label. x/rowY are the label box's origin. */
-    labelUnderline(id, x, rowY, label) {
-        // Same metrics processScene uses to ellipsize builtin text; the raster
-        // insets text by 2px, so the bar starts under the first glyph.
-        const textW = new TextMeasurer(displayProcessor.getProfile()).measureText(label);
-        return {
-            type: "rect",
-            id,
-            box: { x: x + 2, y: rowY + UNDERLINE_OFFSET_Y, w: textW + 4, h: UNDERLINE_H },
-            style: { border: 2 },
-        };
-    }
-    canvas() {
-        const { sceneCanvasWidth, sceneCanvasHeight } = useGlassesStore.getState();
-        if (sceneCanvasWidth && sceneCanvasWidth > 0 && sceneCanvasHeight && sceneCanvasHeight > 0) {
-            return { width: sceneCanvasWidth, height: sceneCanvasHeight };
-        }
-        return FALLBACK_CANVAS;
-    }
-    render() {
-        // Only while open: emitting into the single native view while closed
-        // would clobber the main content.
-        if (!this.open || !this.isEligible())
-            return;
-        const elements = this.view === "apps" ? this.appMenuElements() : this.mainElements();
-        sceneRenderer.emitScene(DASHBOARD_APP_ID, "dashboard", elements);
-    }
-    mainElements() {
-        const canvas = this.canvas();
-        const settings = useSettingsStore.getState();
-        const widgets = this.widgets().filter((widget) => widget.enabled);
-        const actions = dashboardActions(widgets);
-        if (this.mainIndex >= actions.length)
-            this.mainIndex = Math.max(0, actions.length - 1);
-        const selected = actions[this.mainIndex];
-        const clockStyle = settings.getSetting(SETTINGS.custom_dashboard_clock_style.key) === "large"
-            ? "large"
-            : "compact";
-        const calendarEnabled = widgets.some((widget) => widget.id === "calendar");
-        // Calendar lives in the right half; everything else stacks in the left
-        // half (full width when the calendar widget is off).
-        const halfW = Math.floor(canvas.width / 2) - MARGIN_X - Math.floor(WIDGET_GAP / 2);
-        const width = calendarEnabled ? halfW : canvas.width - MARGIN_X * 2;
-        const rightX = Math.floor(canvas.width / 2) + Math.floor(WIDGET_GAP / 2);
-        const elements = [];
-        let y = MARGIN_TOP;
-        for (const widget of widgets) {
-            if (widget.id === "clock") {
-                const fontSize = clockStyle === "large" ? 48 : 32;
-                const clock = formatDashboardClock(new Date(), {
-                    twelveHour: settings.getSetting(SETTINGS.twelve_hour_time.key) === true,
-                    showDate: settings.getSetting(SETTINGS.custom_dashboard_clock_show_date.key) !== false,
-                });
-                elements.push({
-                    type: "text",
-                    id: "clock",
-                    box: { x: MARGIN_X, y, w: width, h: fontSize + 6 },
-                    text: clock.time,
-                    style: { font: "mono", fontSize, breakMode: "strict-word" },
-                });
-                y += fontSize + 6;
-                if (clock.date) {
-                    elements.push({
-                        type: "text",
-                        id: "clock-date",
-                        box: { x: MARGIN_X, y, w: width, h: LINE_H },
-                        text: clock.date,
-                        style: { font: "builtin", breakMode: "strict-word" },
-                    });
-                    y += LINE_H;
-                }
-                y += WIDGET_GAP;
-            }
-            else if (widget.id === "calendar") {
-                // Right half, top-aligned, independent of the left stack. A missing
-                // calendar shows a hint instead of silently vanishing — "No access"
-                // strictly for permission denial, "Unavailable" for any other failure.
-                const lines = this.calendarStatus === "ok"
-                    ? [
-                        "Calendar",
-                        ...(this.calendarEvents.length
-                            ? this.calendarEvents.slice(0, 3).map(eventLine)
-                            : ["No upcoming events"]),
-                    ]
-                    : this.calendarStatus === "loading"
-                        ? ["Calendar"]
-                        : ["Calendar", this.calendarStatus === "no-access" ? "No access" : "Unavailable"];
-                elements.push({
-                    type: "text",
-                    id: "calendar",
-                    box: { x: rightX, y: MARGIN_TOP, w: halfW, h: lines.length * LINE_H },
-                    text: lines.join("\n"),
-                    style: { font: "builtin", breakMode: "strict-word", overflow: "ellipsis" },
-                });
-            }
-            else if (widget.id === "apps") {
-                elements.push({
-                    type: "text",
-                    id: "apps-button",
-                    box: { x: MARGIN_X, y, w: width, h: BUTTON_H },
-                    text: "Apps",
-                    style: { font: "builtin" },
-                });
-                if (selected?.kind === "apps-menu")
-                    elements.push(this.labelUnderline("apps-underline", MARGIN_X, y, "Apps"));
-                y += BUTTON_H + WIDGET_GAP;
-            }
-            else if (widget.id === "notifications") {
-                elements.push({
-                    type: "text",
-                    id: "notifications",
-                    box: { x: MARGIN_X, y, w: width, h: BUTTON_H },
-                    text: "Notifications",
-                    style: { font: "builtin" },
-                });
-                if (selected?.kind === "notifications") {
-                    elements.push(this.labelUnderline("notifications-underline", MARGIN_X, y, "Notifications"));
-                }
-                y += BUTTON_H + WIDGET_GAP;
-            }
-        }
-        return elements;
-    }
-    /**
-     * Resolve a miniapp icon to base64 for the glasses. Local/bundled miniapps
-     * carry a file:// icon.png; store apps an https URL; the offline system
-     * tiles a bundler asset id (unsupported here — monogram fallback). Loads
-     * are async and cached; a finished load repaints the open app menu.
-     */
-    loadIcon(app) {
-        if (this.iconCache.has(app.packageName) || this.iconLoads.has(app.packageName))
-            return;
-        const url = typeof app.logoUrl === "string" ? app.logoUrl : "";
-        if (!/^(file|https?):/.test(url)) {
-            this.iconCache.set(app.packageName, null);
-            return;
-        }
-        this.iconLoads.add(app.packageName);
-        void (async () => {
-            try {
-                let base64;
-                if (url.startsWith("file:")) {
-                    base64 = await new File(url).base64();
-                }
-                else {
-                    const response = await fetch(url);
-                    const blob = await response.blob();
-                    base64 = await new Promise((resolve, reject) => {
-                        const reader = new FileReader();
-                        reader.onload = () => resolve(String(reader.result).split(",")[1] ?? "");
-                        reader.onerror = () => reject(reader.error);
-                        reader.readAsDataURL(blob);
-                    });
-                }
-                this.iconCache.set(app.packageName, base64 || null);
-            }
-            catch {
-                this.iconCache.set(app.packageName, null);
-            }
-            finally {
-                this.iconLoads.delete(app.packageName);
-                if (this.open && this.view === "apps")
-                    this.render();
-            }
-        })();
-    }
-    appMenuElements() {
-        const canvas = this.canvas();
-        const width = canvas.width - MARGIN_X * 2;
-        const apps = this.menuApps();
-        const rows = appMenuActions(apps);
-        if (this.appsIndex >= rows.length)
-            this.appsIndex = Math.max(0, rows.length - 1);
-        const elements = [
-            {
-                type: "text",
-                id: "apps-title",
-                box: { x: MARGIN_X, y: MARGIN_TOP, w: width, h: LINE_H },
-                text: "Apps",
-                style: { font: "builtin" },
-            },
-        ];
-        const listTop = MARGIN_TOP + LINE_H + 16;
-        if (apps.length === 0) {
-            elements.push({
-                type: "text",
-                id: "apps-empty",
-                box: { x: MARGIN_X, y: listTop, w: width, h: LINE_H },
-                text: "No apps in Glasses Menu",
-                style: { font: "builtin" },
-            });
-            return elements;
-        }
-        // Icon grid, paged, row-major. Selection is the underlined cell.
-        const perPage = APPS_PER_PAGE;
-        const pageStart = Math.floor(this.appsIndex / perPage) * perPage;
-        const page = apps.slice(pageStart, pageStart + perPage);
-        const cols = Math.min(page.length, APP_GRID_COLS);
-        const totalW = cols * APP_CELL + (cols - 1) * APP_CELL_GAP;
-        const startX = Math.max(MARGIN_X, Math.round((canvas.width - totalW) / 2));
-        page.forEach((app, cell) => {
-            const x = startX + (cell % APP_GRID_COLS) * (APP_CELL + APP_CELL_GAP);
-            const y = listTop + Math.floor(cell / APP_GRID_COLS) * (APP_CELL + APP_CELL_GAP);
-            const selected = pageStart + cell === this.appsIndex;
-            const icon = this.iconCache.get(app.packageName);
-            if (icon === undefined)
-                this.loadIcon(app);
-            if (icon) {
-                elements.push({
-                    type: "image",
-                    id: `app-icon:${app.packageName}`,
-                    box: { x: x + APP_ICON_INSET, y: y + APP_ICON_INSET, w: APP_ICON, h: APP_ICON },
-                    data: icon,
-                });
-            }
-            else {
-                // Monogram fallback for icons that can't load (bundler-asset tiles).
-                elements.push({
-                    type: "text",
-                    id: `app-icon:${app.packageName}`,
-                    box: { x: x + APP_ICON_INSET, y: y + APP_ICON_INSET, w: APP_ICON, h: APP_ICON },
-                    text: (app.name.trim()[0] ?? "?").toUpperCase(),
-                    style: { font: "mono", fontSize: 20 },
-                });
-            }
-            if (selected) {
-                elements.push({
-                    type: "rect",
-                    id: "apps-selection",
-                    box: { x, y: y + APP_CELL + 2, w: APP_CELL, h: UNDERLINE_H },
-                    style: { border: 2 },
-                });
-            }
-        });
-        // Grayscale mini icons are ambiguous on their own: caption the selection.
-        const gridRows = Math.ceil(page.length / APP_GRID_COLS);
-        const gridH = gridRows * APP_CELL + (gridRows - 1) * APP_CELL_GAP;
-        const selectedApp = apps[this.appsIndex];
-        if (selectedApp) {
-            elements.push({
-                type: "text",
-                id: "apps-selected-name",
-                box: { x: MARGIN_X, y: listTop + gridH + 12, w: width, h: LINE_H },
-                text: `${selectedApp.name}${selectedApp.running ? " (running)" : ""}`,
-                style: { font: "builtin", breakMode: "strict-word", overflow: "ellipsis" },
-            });
-        }
-        return elements;
-    }
-}
-const customDashboardService = new CustomDashboardService();
-export default customDashboardService;
-export { CustomDashboardService };
-//# sourceMappingURL=CustomDashboardService.js.map