diff --git a/web/TiledHome.ts b/web/TiledHome.ts --- a/web/TiledHome.ts +++ b/web/TiledHome.ts @@ -7,6 +7,7 @@ import { createRoot } from "react-dom/cl import { getTopGraph } from "./RdfdbSyncedGraph"; import { SyncedGraph } from "./SyncedGraph"; import { Patch } from "./patch"; +import { SimpleLayout, fullLayout, persistedLayout, simpleLayout } from "./tiledLayoutPersistence"; import { NamedNode } from "n3"; export { RdfdbSyncedGraph } from "./RdfdbSyncedGraph"; export { Light9CollectorUi } from "./collector/Light9CollectorUi"; @@ -21,22 +22,7 @@ const config: FlexLayout.IJsonModel = { tabEnableRename: false, }, borders: [], - layout: { - type: "row", - weight: 100, - children: [ - { - type: "tabset", - weight: 50, - children: [{ type: "tab", name: "devsettings", component: "light9-device-settings" }], - }, - { - type: "tabset", - weight: 50, - children: [{ type: "tab", name: "collector", component: "light9-collector-ui" }], - }, - ], - }, + layout: fullLayout(persistedLayout) as FlexLayout.IJsonRowNode, }; // see https://github.com/lit/lit/tree/main/packages/labs/react @@ -73,8 +59,40 @@ export class Light9HomeStatus extends Li super(); getTopGraph().then((g) => { this.graph = g; + runHandlerAfterGraphLoads(this.graph, this.homeLayout.bind(this), "homeLayout"); }); } + homeLayout(patch?: Patch) { + const U = this.graph.U(); + const s = U(":homeLayout"); + const p = U(":config"); + let cfg; + + try { + cfg = this.graph.stringValue(s, p); + } catch (e) { + const ctx = new NamedNode(showRoot + "/homeLayout"); + log(`no config in graph- adding one to `, ctx); + cfg = JSON.stringify(persistedLayout); + this.graph.patchObject(s, p, this.graph.Literal(cfg), ctx); + } + const fl = fullLayout(JSON.parse(cfg) as SimpleLayout); + log("got config", fl); + } +} + +function runHandlerAfterGraphLoads(graph: SyncedGraph, handler: HandlerFunc, label: string) { + let patchesSeen = 0; + const wrapHandler = (patch?: Patch) => { + patchesSeen += 1; + if (patchesSeen == 2) { + handler(patch); + } else { + graph.objects(null, null); + } + }; + + graph.runHandler(wrapHandler, label); } const root = createRoot(document.getElementById("container")!);