annotate web/TiledHome.ts @ 2406:68d8e905d61a

dead end
author drewp@bigasterisk.com
date Fri, 17 May 2024 17:39:40 -0700
parents 69ca2b2fc133
children 6697a68800d2
Ignore whitespace changes - Everywhere: Within whitespace: At end of lines:
rev   line source
2402
1d3594ffd14b new home-status elt
drewp@bigasterisk.com
parents: 2382
diff changeset
1 import debug from "debug";
1d3594ffd14b new home-status elt
drewp@bigasterisk.com
parents: 2382
diff changeset
2 import * as FlexLayout from "flexlayout-react";
1d3594ffd14b new home-status elt
drewp@bigasterisk.com
parents: 2382
diff changeset
3 import { LitElement, html } from "lit";
1d3594ffd14b new home-status elt
drewp@bigasterisk.com
parents: 2382
diff changeset
4 import { customElement } from "lit/decorators.js";
2374
9d47c44d4ae4 experimental tiled-layout home page
drewp@bigasterisk.com
parents:
diff changeset
5 import * as React from "react";
9d47c44d4ae4 experimental tiled-layout home page
drewp@bigasterisk.com
parents:
diff changeset
6 import { createRoot } from "react-dom/client";
2402
1d3594ffd14b new home-status elt
drewp@bigasterisk.com
parents: 2382
diff changeset
7 import { getTopGraph } from "./RdfdbSyncedGraph";
1d3594ffd14b new home-status elt
drewp@bigasterisk.com
parents: 2382
diff changeset
8 import { SyncedGraph } from "./SyncedGraph";
1d3594ffd14b new home-status elt
drewp@bigasterisk.com
parents: 2382
diff changeset
9 import { Patch } from "./patch";
2405
69ca2b2fc133 overcomplicated attempt at persisting the pane layout in the rdf graph
drewp@bigasterisk.com
parents: 2402
diff changeset
10 import { SimpleLayout, fullLayout, persistedLayout, simpleLayout } from "./tiledLayoutPersistence";
2402
1d3594ffd14b new home-status elt
drewp@bigasterisk.com
parents: 2382
diff changeset
11 import { NamedNode } from "n3";
1d3594ffd14b new home-status elt
drewp@bigasterisk.com
parents: 2382
diff changeset
12 export { RdfdbSyncedGraph } from "./RdfdbSyncedGraph";
1d3594ffd14b new home-status elt
drewp@bigasterisk.com
parents: 2382
diff changeset
13 export { Light9CollectorUi } from "./collector/Light9CollectorUi";
1d3594ffd14b new home-status elt
drewp@bigasterisk.com
parents: 2382
diff changeset
14 export { Light9FadeUi } from "./fade/Light9FadeUi";
2374
9d47c44d4ae4 experimental tiled-layout home page
drewp@bigasterisk.com
parents:
diff changeset
15 export { Light9DeviceSettings } from "./live/Light9DeviceSettings";
2402
1d3594ffd14b new home-status elt
drewp@bigasterisk.com
parents: 2382
diff changeset
16 import { showRoot } from "./show_specific";
1d3594ffd14b new home-status elt
drewp@bigasterisk.com
parents: 2382
diff changeset
17 import { HandlerFunc } from "./AutoDependencies";
1d3594ffd14b new home-status elt
drewp@bigasterisk.com
parents: 2382
diff changeset
18 const log = debug("home");
2374
9d47c44d4ae4 experimental tiled-layout home page
drewp@bigasterisk.com
parents:
diff changeset
19
2382
40d5a54dec99 ts warnings
drewp@bigasterisk.com
parents: 2376
diff changeset
20 const config: FlexLayout.IJsonModel = {
2402
1d3594ffd14b new home-status elt
drewp@bigasterisk.com
parents: 2382
diff changeset
21 global: {
1d3594ffd14b new home-status elt
drewp@bigasterisk.com
parents: 2382
diff changeset
22 tabEnableRename: false,
1d3594ffd14b new home-status elt
drewp@bigasterisk.com
parents: 2382
diff changeset
23 },
2374
9d47c44d4ae4 experimental tiled-layout home page
drewp@bigasterisk.com
parents:
diff changeset
24 borders: [],
2405
69ca2b2fc133 overcomplicated attempt at persisting the pane layout in the rdf graph
drewp@bigasterisk.com
parents: 2402
diff changeset
25 layout: fullLayout(persistedLayout) as FlexLayout.IJsonRowNode,
2374
9d47c44d4ae4 experimental tiled-layout home page
drewp@bigasterisk.com
parents:
diff changeset
26 };
9d47c44d4ae4 experimental tiled-layout home page
drewp@bigasterisk.com
parents:
diff changeset
27
9d47c44d4ae4 experimental tiled-layout home page
drewp@bigasterisk.com
parents:
diff changeset
28 // see https://github.com/lit/lit/tree/main/packages/labs/react
9d47c44d4ae4 experimental tiled-layout home page
drewp@bigasterisk.com
parents:
diff changeset
29
9d47c44d4ae4 experimental tiled-layout home page
drewp@bigasterisk.com
parents:
diff changeset
30 class Main extends React.Component {
2382
40d5a54dec99 ts warnings
drewp@bigasterisk.com
parents: 2376
diff changeset
31 state: { model: FlexLayout.Model };
40d5a54dec99 ts warnings
drewp@bigasterisk.com
parents: 2376
diff changeset
32 constructor(props: any) {
2374
9d47c44d4ae4 experimental tiled-layout home page
drewp@bigasterisk.com
parents:
diff changeset
33 super(props);
9d47c44d4ae4 experimental tiled-layout home page
drewp@bigasterisk.com
parents:
diff changeset
34 this.state = { model: FlexLayout.Model.fromJson(config) };
9d47c44d4ae4 experimental tiled-layout home page
drewp@bigasterisk.com
parents:
diff changeset
35 }
9d47c44d4ae4 experimental tiled-layout home page
drewp@bigasterisk.com
parents:
diff changeset
36
2382
40d5a54dec99 ts warnings
drewp@bigasterisk.com
parents: 2376
diff changeset
37 factory = (node: any) => {
2374
9d47c44d4ae4 experimental tiled-layout home page
drewp@bigasterisk.com
parents:
diff changeset
38 var component = node.getComponent();
2402
1d3594ffd14b new home-status elt
drewp@bigasterisk.com
parents: 2382
diff changeset
39 return React.createElement(component, null, "");
2374
9d47c44d4ae4 experimental tiled-layout home page
drewp@bigasterisk.com
parents:
diff changeset
40 };
9d47c44d4ae4 experimental tiled-layout home page
drewp@bigasterisk.com
parents:
diff changeset
41
9d47c44d4ae4 experimental tiled-layout home page
drewp@bigasterisk.com
parents:
diff changeset
42 render() {
2402
1d3594ffd14b new home-status elt
drewp@bigasterisk.com
parents: 2382
diff changeset
43 return React.createElement(FlexLayout.Layout, {
1d3594ffd14b new home-status elt
drewp@bigasterisk.com
parents: 2382
diff changeset
44 model: this.state.model,
1d3594ffd14b new home-status elt
drewp@bigasterisk.com
parents: 2382
diff changeset
45 realtimeResize: true,
1d3594ffd14b new home-status elt
drewp@bigasterisk.com
parents: 2382
diff changeset
46 factory: this.factory,
1d3594ffd14b new home-status elt
drewp@bigasterisk.com
parents: 2382
diff changeset
47 });
1d3594ffd14b new home-status elt
drewp@bigasterisk.com
parents: 2382
diff changeset
48 }
1d3594ffd14b new home-status elt
drewp@bigasterisk.com
parents: 2382
diff changeset
49 }
1d3594ffd14b new home-status elt
drewp@bigasterisk.com
parents: 2382
diff changeset
50
1d3594ffd14b new home-status elt
drewp@bigasterisk.com
parents: 2382
diff changeset
51 @customElement("light9-home-status")
1d3594ffd14b new home-status elt
drewp@bigasterisk.com
parents: 2382
diff changeset
52 export class Light9HomeStatus extends LitElement {
1d3594ffd14b new home-status elt
drewp@bigasterisk.com
parents: 2382
diff changeset
53 graph!: SyncedGraph;
1d3594ffd14b new home-status elt
drewp@bigasterisk.com
parents: 2382
diff changeset
54 render() {
1d3594ffd14b new home-status elt
drewp@bigasterisk.com
parents: 2382
diff changeset
55 return html`<rdfdb-synced-graph></rdfdb-synced-graph>
1d3594ffd14b new home-status elt
drewp@bigasterisk.com
parents: 2382
diff changeset
56 <a href="metrics/">metrics</a> `;
1d3594ffd14b new home-status elt
drewp@bigasterisk.com
parents: 2382
diff changeset
57 }
1d3594ffd14b new home-status elt
drewp@bigasterisk.com
parents: 2382
diff changeset
58 constructor() {
1d3594ffd14b new home-status elt
drewp@bigasterisk.com
parents: 2382
diff changeset
59 super();
1d3594ffd14b new home-status elt
drewp@bigasterisk.com
parents: 2382
diff changeset
60 getTopGraph().then((g) => {
1d3594ffd14b new home-status elt
drewp@bigasterisk.com
parents: 2382
diff changeset
61 this.graph = g;
2405
69ca2b2fc133 overcomplicated attempt at persisting the pane layout in the rdf graph
drewp@bigasterisk.com
parents: 2402
diff changeset
62 runHandlerAfterGraphLoads(this.graph, this.homeLayout.bind(this), "homeLayout");
2402
1d3594ffd14b new home-status elt
drewp@bigasterisk.com
parents: 2382
diff changeset
63 });
2374
9d47c44d4ae4 experimental tiled-layout home page
drewp@bigasterisk.com
parents:
diff changeset
64 }
2405
69ca2b2fc133 overcomplicated attempt at persisting the pane layout in the rdf graph
drewp@bigasterisk.com
parents: 2402
diff changeset
65 homeLayout(patch?: Patch) {
69ca2b2fc133 overcomplicated attempt at persisting the pane layout in the rdf graph
drewp@bigasterisk.com
parents: 2402
diff changeset
66 const U = this.graph.U();
69ca2b2fc133 overcomplicated attempt at persisting the pane layout in the rdf graph
drewp@bigasterisk.com
parents: 2402
diff changeset
67 const s = U(":homeLayout");
69ca2b2fc133 overcomplicated attempt at persisting the pane layout in the rdf graph
drewp@bigasterisk.com
parents: 2402
diff changeset
68 const p = U(":config");
69ca2b2fc133 overcomplicated attempt at persisting the pane layout in the rdf graph
drewp@bigasterisk.com
parents: 2402
diff changeset
69 let cfg;
69ca2b2fc133 overcomplicated attempt at persisting the pane layout in the rdf graph
drewp@bigasterisk.com
parents: 2402
diff changeset
70
69ca2b2fc133 overcomplicated attempt at persisting the pane layout in the rdf graph
drewp@bigasterisk.com
parents: 2402
diff changeset
71 try {
69ca2b2fc133 overcomplicated attempt at persisting the pane layout in the rdf graph
drewp@bigasterisk.com
parents: 2402
diff changeset
72 cfg = this.graph.stringValue(s, p);
69ca2b2fc133 overcomplicated attempt at persisting the pane layout in the rdf graph
drewp@bigasterisk.com
parents: 2402
diff changeset
73 } catch (e) {
69ca2b2fc133 overcomplicated attempt at persisting the pane layout in the rdf graph
drewp@bigasterisk.com
parents: 2402
diff changeset
74 const ctx = new NamedNode(showRoot + "/homeLayout");
69ca2b2fc133 overcomplicated attempt at persisting the pane layout in the rdf graph
drewp@bigasterisk.com
parents: 2402
diff changeset
75 log(`no config in graph- adding one to `, ctx);
69ca2b2fc133 overcomplicated attempt at persisting the pane layout in the rdf graph
drewp@bigasterisk.com
parents: 2402
diff changeset
76 cfg = JSON.stringify(persistedLayout);
69ca2b2fc133 overcomplicated attempt at persisting the pane layout in the rdf graph
drewp@bigasterisk.com
parents: 2402
diff changeset
77 this.graph.patchObject(s, p, this.graph.Literal(cfg), ctx);
69ca2b2fc133 overcomplicated attempt at persisting the pane layout in the rdf graph
drewp@bigasterisk.com
parents: 2402
diff changeset
78 }
69ca2b2fc133 overcomplicated attempt at persisting the pane layout in the rdf graph
drewp@bigasterisk.com
parents: 2402
diff changeset
79 const fl = fullLayout(JSON.parse(cfg) as SimpleLayout);
69ca2b2fc133 overcomplicated attempt at persisting the pane layout in the rdf graph
drewp@bigasterisk.com
parents: 2402
diff changeset
80 log("got config", fl);
69ca2b2fc133 overcomplicated attempt at persisting the pane layout in the rdf graph
drewp@bigasterisk.com
parents: 2402
diff changeset
81 }
69ca2b2fc133 overcomplicated attempt at persisting the pane layout in the rdf graph
drewp@bigasterisk.com
parents: 2402
diff changeset
82 }
69ca2b2fc133 overcomplicated attempt at persisting the pane layout in the rdf graph
drewp@bigasterisk.com
parents: 2402
diff changeset
83
69ca2b2fc133 overcomplicated attempt at persisting the pane layout in the rdf graph
drewp@bigasterisk.com
parents: 2402
diff changeset
84 function runHandlerAfterGraphLoads(graph: SyncedGraph, handler: HandlerFunc, label: string) {
69ca2b2fc133 overcomplicated attempt at persisting the pane layout in the rdf graph
drewp@bigasterisk.com
parents: 2402
diff changeset
85 let patchesSeen = 0;
69ca2b2fc133 overcomplicated attempt at persisting the pane layout in the rdf graph
drewp@bigasterisk.com
parents: 2402
diff changeset
86 const wrapHandler = (patch?: Patch) => {
69ca2b2fc133 overcomplicated attempt at persisting the pane layout in the rdf graph
drewp@bigasterisk.com
parents: 2402
diff changeset
87 patchesSeen += 1;
69ca2b2fc133 overcomplicated attempt at persisting the pane layout in the rdf graph
drewp@bigasterisk.com
parents: 2402
diff changeset
88 if (patchesSeen == 2) {
69ca2b2fc133 overcomplicated attempt at persisting the pane layout in the rdf graph
drewp@bigasterisk.com
parents: 2402
diff changeset
89 handler(patch);
69ca2b2fc133 overcomplicated attempt at persisting the pane layout in the rdf graph
drewp@bigasterisk.com
parents: 2402
diff changeset
90 } else {
69ca2b2fc133 overcomplicated attempt at persisting the pane layout in the rdf graph
drewp@bigasterisk.com
parents: 2402
diff changeset
91 graph.objects(null, null);
69ca2b2fc133 overcomplicated attempt at persisting the pane layout in the rdf graph
drewp@bigasterisk.com
parents: 2402
diff changeset
92 }
69ca2b2fc133 overcomplicated attempt at persisting the pane layout in the rdf graph
drewp@bigasterisk.com
parents: 2402
diff changeset
93 };
69ca2b2fc133 overcomplicated attempt at persisting the pane layout in the rdf graph
drewp@bigasterisk.com
parents: 2402
diff changeset
94
69ca2b2fc133 overcomplicated attempt at persisting the pane layout in the rdf graph
drewp@bigasterisk.com
parents: 2402
diff changeset
95 graph.runHandler(wrapHandler, label);
2374
9d47c44d4ae4 experimental tiled-layout home page
drewp@bigasterisk.com
parents:
diff changeset
96 }
9d47c44d4ae4 experimental tiled-layout home page
drewp@bigasterisk.com
parents:
diff changeset
97
9d47c44d4ae4 experimental tiled-layout home page
drewp@bigasterisk.com
parents:
diff changeset
98 const root = createRoot(document.getElementById("container")!);
9d47c44d4ae4 experimental tiled-layout home page
drewp@bigasterisk.com
parents:
diff changeset
99 root.render(React.createElement(Main));