@glassly/engine 0.1.0-dev.1 → 0.1.0-dev.101

package/build/services/CustomDashboardService.d.ts

@@ -0,0 +1,55 @@
+declare class CustomDashboardService {
+    private started;
+    private open;
+    /** Set by DashboardCoordinator; asks it to close (and restore main content). */
+    onRequestClose: (() => void) | null;
+    private view;
+    private mainIndex;
+    private appsIndex;
+    /** First visible row of the app list's scrolling window. */
+    private appsScroll;
+    /** "loading" until the first fetch resolves; "no-access" only for a real permission denial. */
+    private calendarStatus;
+    private calendarEvents;
+    private unsubs;
+    private clockTimer;
+    private calendarTimer;
+    /** Last observed eligibility, for transition detection. */
+    private eligible;
+    start(): void;
+    /**
+     * 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.
+     */
+    private syncEligibility;
+    stop(): void;
+    isEligible(): boolean;
+    get isOpen(): boolean;
+    /** Coordinator opened the dashboard: render fresh from the top. */
+    show(): void;
+    /** Coordinator closed the dashboard. */
+    hide(): void;
+    /** Returns true when an open custom dashboard consumed the gesture. */
+    handleGesture(gestureName: string): boolean;
+    private resetNavigation;
+    private handleMainGesture;
+    private handleAppMenuGesture;
+    private menuApps;
+    private widgets;
+    private openNotificationsPanel;
+    private toggleApp;
+    private calendarWidgetEnabled;
+    private refreshCalendarAndRender;
+    /** Underline hugging a builtin-font label. x/rowY are the label box's origin. */
+    private labelUnderline;
+    private canvas;
+    private render;
+    private mainElements;
+    private appMenuElements;
+}
+declare const customDashboardService: CustomDashboardService;
+export default customDashboardService;
+export { CustomDashboardService };
+//# sourceMappingURL=CustomDashboardService.d.ts.map

package/build/services/CustomDashboardService.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"CustomDashboardService.d.ts","sourceRoot":"","sources":["../../src/services/CustomDashboardService.ts"],"names":[],"mappings":"AA6FA,cAAM,sBAAsB;IAC1B,OAAO,CAAC,OAAO,CAAQ;IACvB,OAAO,CAAC,IAAI,CAAQ;IACpB,gFAAgF;IACzE,cAAc,EAAE,CAAC,MAAM,IAAI,CAAC,GAAG,IAAI,CAAO;IACjD,OAAO,CAAC,IAAI,CAA0B;IACtC,OAAO,CAAC,SAAS,CAAI;IACrB,OAAO,CAAC,SAAS,CAAI;IACrB,4DAA4D;IAC5D,OAAO,CAAC,UAAU,CAAI;IACtB,+FAA+F;IAC/F,OAAO,CAAC,cAAc,CAA4D;IAClF,OAAO,CAAC,cAAc,CAAsB;IAC5C,OAAO,CAAC,MAAM,CAAwB;IACtC,OAAO,CAAC,UAAU,CAAsB;IACxC,OAAO,CAAC,aAAa,CAAsB;IAC3C,2DAA2D;IAC3D,OAAO,CAAC,QAAQ,CAAQ;IAExB,KAAK,IAAI,IAAI;IA2Cb;;;;;OAKG;IACH,OAAO,CAAC,eAAe;IAavB,IAAI,IAAI,IAAI;IAeZ,UAAU,IAAI,OAAO;IAYrB,IAAI,MAAM,IAAI,OAAO,CAEpB;IAED,mEAAmE;IACnE,IAAI,IAAI,IAAI;IAMZ,wCAAwC;IACxC,IAAI,IAAI,IAAI;IAKZ,uEAAuE;IACvE,aAAa,CAAC,WAAW,EAAE,MAAM,GAAG,OAAO;IAiB3C,OAAO,CAAC,eAAe;IAOvB,OAAO,CAAC,iBAAiB;IAyBzB,OAAO,CAAC,oBAAoB;IAmB5B,OAAO,CAAC,QAAQ;IAKhB,OAAO,CAAC,OAAO;YAID,sBAAsB;YAOtB,SAAS;IAcvB,OAAO,CAAC,qBAAqB;YAIf,wBAAwB;IAsCtC,iFAAiF;IACjF,OAAO,CAAC,cAAc;IAatB,OAAO,CAAC,MAAM;IAQd,OAAO,CAAC,MAAM;IAQd,OAAO,CAAC,YAAY;IAiGpB,OAAO,CAAC,eAAe;CAqDxB;AAED,QAAA,MAAM,sBAAsB,wBAA+B,CAAA;AAC3D,eAAe,sBAAsB,CAAA;AACrC,OAAO,EAAC,sBAAsB,EAAC,CAAA"}

package/build/services/CustomDashboardService.js

@@ -0,0 +1,520 @@
+/**
+ * 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 { 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;
+function sameLocalDay(a, b) {
+    return a.getFullYear() === b.getFullYear() && a.getMonth() === b.getMonth() && a.getDate() === b.getDate();
+}
+/** Local midnight after tomorrow: the widget never shows a "day after tomorrow". */
+function endOfTomorrow(now) {
+    const end = new Date(now);
+    end.setHours(0, 0, 0, 0);
+    end.setDate(end.getDate() + 2);
+    return end;
+}
+/** Up to three lines per entry: title, location (when set), then the time — "tmr @ …" for tomorrow. */
+function eventLines(event, now) {
+    const lines = [event.title];
+    const location = event.location?.trim();
+    if (location)
+        lines.push(location);
+    const start = new Date(event.startsAt);
+    const tomorrow = new Date(now);
+    tomorrow.setDate(tomorrow.getDate() + 1);
+    const isTomorrow = sameLocalDay(start, tomorrow);
+    if (event.allDay) {
+        lines.push(isTomorrow ? "tmr, all day" : "All day");
+    }
+    else {
+        const time = new Intl.DateTimeFormat(undefined, { hour: "numeric", minute: "2-digit" }).format(start);
+        lines.push(isTomorrow ? `tmr @ ${time}` : time);
+    }
+    return lines;
+}
+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;
+    /** First visible row of the app list's scrolling window. */
+    appsScroll = 0;
+    /** "loading" until the first fetch resolves; "no-access" only for a real permission denial. */
+    calendarStatus = "loading";
+    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;
+        this.appsScroll = 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.appsScroll = 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();
+        // Clamped to local end-of-tomorrow: the widget only ever shows today and
+        // tomorrow ("tmr"), whatever the days-ahead setting says.
+        const daysEnd = new Date(startsAt.getTime() + Math.max(1, days) * 24 * 60 * 60 * 1000);
+        const windowEnd = endOfTomorrow(startsAt);
+        const endsAt = daysEnd < windowEnd ? daysEnd : windowEnd;
+        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, maxW) {
+        // 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);
+        const w = maxW === undefined ? textW + 4 : Math.min(textW + 4, maxW);
+        return {
+            type: "rect",
+            id,
+            box: { x: x + 2, y: rowY + UNDERLINE_OFFSET_Y, w, 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 now = new Date();
+                const lines = this.calendarStatus === "ok"
+                    ? [
+                        "Calendar",
+                        ...(this.calendarEvents.length
+                            ? this.calendarEvents.slice(0, 3).flatMap((event) => eventLines(event, now))
+                            : ["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;
+    }
+    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;
+        }
+        // Vertical side menu down the left half, stock-firmware style. The list
+        // scrolls as a window: the selection stays visible and rows shift under it.
+        const listW = Math.floor(canvas.width / 2) - MARGIN_X;
+        const visibleRows = Math.max(1, Math.floor((canvas.height - listTop) / BUTTON_H));
+        const maxScroll = Math.max(0, apps.length - visibleRows);
+        if (this.appsScroll > maxScroll)
+            this.appsScroll = maxScroll;
+        if (this.appsIndex < this.appsScroll)
+            this.appsScroll = this.appsIndex;
+        else if (this.appsIndex >= this.appsScroll + visibleRows)
+            this.appsScroll = this.appsIndex - visibleRows + 1;
+        apps.slice(this.appsScroll, this.appsScroll + visibleRows).forEach((app, row) => {
+            const y = listTop + row * BUTTON_H;
+            const label = app.running ? `${app.name} (running)` : app.name;
+            elements.push({
+                type: "text",
+                id: `app-row:${app.packageName}`,
+                box: { x: MARGIN_X, y, w: listW, h: BUTTON_H },
+                text: label,
+                style: { font: "builtin", breakMode: "strict-word", overflow: "ellipsis" },
+            });
+            if (this.appsScroll + row === this.appsIndex) {
+                elements.push(this.labelUnderline("apps-selection", MARGIN_X, y, label, listW - 2));
+            }
+        });
+        return elements;
+    }
+}
+const customDashboardService = new CustomDashboardService();
+export default customDashboardService;
+export { CustomDashboardService };
+//# sourceMappingURL=CustomDashboardService.js.map