Mercurial > code > home > repos > light9

annotate web/collector/Light9CollectorUi.ts @ 2376:4556eebe5d73

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
topdir reorgs; let pdm have its src/ dir; separate vite area from light9/
author drewp@bigasterisk.com
date Sun, 12 May 2024 19:02:10 -0700
parents light9/web/collector/Light9CollectorUi.ts@06bf6dae8e64
children ffa2f340ffdf
Ignore whitespace changes - Everywhere: Within whitespace: At end of lines:
rev   line source
2069
d678c2757cd4 config log() better. note that in chrome, you have to turn on 'verbose' in the console log to see anything :(
drewp@bigasterisk.com
parents: 2065
diff changeset
1 import debug from "debug";
2065
6fbc1853c0b1 split collector elements to ts files, minor porting
drewp@bigasterisk.com
parents:
diff changeset
2 import { html, LitElement } from "lit";
2076
33f65e2d0e59 who needs a single emitter of all graph change events that anyone on the page can find?
drewp@bigasterisk.com
parents: 2075
diff changeset
3 import { customElement, property } from "lit/decorators.js";
33f65e2d0e59 who needs a single emitter of all graph change events that anyone on the page can find?
drewp@bigasterisk.com
parents: 2075
diff changeset
4 import { NamedNode } from "n3";
2077
46a8f5a8a4dd fix collector display to show real values from py
drewp@bigasterisk.com
parents: 2076
diff changeset
5 import ReconnectingWebSocket from "reconnectingwebsocket";
2072
d5f1cc9615af collector: rewrites for asyncio
drewp@bigasterisk.com
parents: 2069
diff changeset
6 import { sortBy, uniq } from "underscore";
2372
06bf6dae8e64 reorg tools into light9/web/ and a single vite instance
drewp@bigasterisk.com
parents: 2151
diff changeset
7 import { Patch } from "../patch";
06bf6dae8e64 reorg tools into light9/web/ and a single vite instance
drewp@bigasterisk.com
parents: 2151
diff changeset
8 import { getTopGraph } from "../RdfdbSyncedGraph";
06bf6dae8e64 reorg tools into light9/web/ and a single vite instance
drewp@bigasterisk.com
parents: 2151
diff changeset
9 import { SyncedGraph } from "../SyncedGraph";
2151
drewp@bigasterisk.com
parents: 2077
diff changeset
10 import { Light9CollectorDevice } from "./Light9CollectorDevice";
2372
06bf6dae8e64 reorg tools into light9/web/ and a single vite instance
drewp@bigasterisk.com
parents: 2151
diff changeset
11 export { RdfdbSyncedGraph } from "../RdfdbSyncedGraph";
2077
46a8f5a8a4dd fix collector display to show real values from py
drewp@bigasterisk.com
parents: 2076
diff changeset
12 export { Light9CollectorDevice };
2074
1a96f8647126 big graph & autodep porting to make collector display labels from a syncedgraph
drewp@bigasterisk.com
parents: 2072
diff changeset
13
1a96f8647126 big graph & autodep porting to make collector display labels from a syncedgraph
drewp@bigasterisk.com
parents: 2072
diff changeset
14 debug.enable("*");
2069
d678c2757cd4 config log() better. note that in chrome, you have to turn on 'verbose' in the console log to see anything :(
drewp@bigasterisk.com
parents: 2065
diff changeset
15 const log = debug("collector");
2065
6fbc1853c0b1 split collector elements to ts files, minor porting
drewp@bigasterisk.com
parents:
diff changeset
16
6fbc1853c0b1 split collector elements to ts files, minor porting
drewp@bigasterisk.com
parents:
diff changeset
17 @customElement("light9-collector-ui")
2076
33f65e2d0e59 who needs a single emitter of all graph change events that anyone on the page can find?
drewp@bigasterisk.com
parents: 2075
diff changeset
18 export class Light9CollectorUi extends LitElement {
33f65e2d0e59 who needs a single emitter of all graph change events that anyone on the page can find?
drewp@bigasterisk.com
parents: 2075
diff changeset
19 graph!: SyncedGraph;
2065
6fbc1853c0b1 split collector elements to ts files, minor porting
drewp@bigasterisk.com
parents:
diff changeset
20 render() {
2076
33f65e2d0e59 who needs a single emitter of all graph change events that anyone on the page can find?
drewp@bigasterisk.com
parents: 2075
diff changeset
21 return html`<rdfdb-synced-graph></rdfdb-synced-graph>
2376
4556eebe5d73 topdir reorgs; let pdm have its src/ dir; separate vite area from light9/
drewp@bigasterisk.com
parents: 2372
diff changeset
22 <h1>Collector</h1>
2065
6fbc1853c0b1 split collector elements to ts files, minor porting
drewp@bigasterisk.com
parents:
diff changeset
23
6fbc1853c0b1 split collector elements to ts files, minor porting
drewp@bigasterisk.com
parents:
diff changeset
24 <h2>Devices</h2>
2077
46a8f5a8a4dd fix collector display to show real values from py
drewp@bigasterisk.com
parents: 2076
diff changeset
25 <div style="column-width: 11em">${this.devices.map((d) => html`<light9-collector-device .uri=${d}></light9-collector-device>`)}</div> `;
2074
1a96f8647126 big graph & autodep porting to make collector display labels from a syncedgraph
drewp@bigasterisk.com
parents: 2072
diff changeset
26 }
1a96f8647126 big graph & autodep porting to make collector display labels from a syncedgraph
drewp@bigasterisk.com
parents: 2072
diff changeset
27
1a96f8647126 big graph & autodep porting to make collector display labels from a syncedgraph
drewp@bigasterisk.com
parents: 2072
diff changeset
28 @property() devices: NamedNode[] = [];
2076
33f65e2d0e59 who needs a single emitter of all graph change events that anyone on the page can find?
drewp@bigasterisk.com
parents: 2075
diff changeset
29
2072
d5f1cc9615af collector: rewrites for asyncio
drewp@bigasterisk.com
parents: 2069
diff changeset
30 constructor() {
d5f1cc9615af collector: rewrites for asyncio
drewp@bigasterisk.com
parents: 2069
diff changeset
31 super();
2074
1a96f8647126 big graph & autodep porting to make collector display labels from a syncedgraph
drewp@bigasterisk.com
parents: 2072
diff changeset
32 getTopGraph().then((g) => {
1a96f8647126 big graph & autodep porting to make collector display labels from a syncedgraph
drewp@bigasterisk.com
parents: 2072
diff changeset
33 this.graph = g;
1a96f8647126 big graph & autodep porting to make collector display labels from a syncedgraph
drewp@bigasterisk.com
parents: 2072
diff changeset
34 this.graph.runHandler(this.findDevices.bind(this), "findDevices");
2072
d5f1cc9615af collector: rewrites for asyncio
drewp@bigasterisk.com
parents: 2069
diff changeset
35 });
2077
46a8f5a8a4dd fix collector display to show real values from py
drewp@bigasterisk.com
parents: 2076
diff changeset
36
2372
06bf6dae8e64 reorg tools into light9/web/ and a single vite instance
drewp@bigasterisk.com
parents: 2151
diff changeset
37 const ws = new ReconnectingWebSocket(location.href.replace("http", "ws") + "../service/collector/updates");
2077
46a8f5a8a4dd fix collector display to show real values from py
drewp@bigasterisk.com
parents: 2076
diff changeset
38 ws.addEventListener("message", (ev: any) => {
46a8f5a8a4dd fix collector display to show real values from py
drewp@bigasterisk.com
parents: 2076
diff changeset
39 const outputAttrsSet = JSON.parse(ev.data).outputAttrsSet;
46a8f5a8a4dd fix collector display to show real values from py
drewp@bigasterisk.com
parents: 2076
diff changeset
40 if (outputAttrsSet) {
46a8f5a8a4dd fix collector display to show real values from py
drewp@bigasterisk.com
parents: 2076
diff changeset
41 this.updateDev(outputAttrsSet.dev, outputAttrsSet.attrs);
46a8f5a8a4dd fix collector display to show real values from py
drewp@bigasterisk.com
parents: 2076
diff changeset
42 }
46a8f5a8a4dd fix collector display to show real values from py
drewp@bigasterisk.com
parents: 2076
diff changeset
43 });
2065
6fbc1853c0b1 split collector elements to ts files, minor porting
drewp@bigasterisk.com
parents:
diff changeset
44 }
2076
33f65e2d0e59 who needs a single emitter of all graph change events that anyone on the page can find?
drewp@bigasterisk.com
parents: 2075
diff changeset
45
2074
1a96f8647126 big graph & autodep porting to make collector display labels from a syncedgraph
drewp@bigasterisk.com
parents: 2072
diff changeset
46 findDevices(patch?: Patch) {
1a96f8647126 big graph & autodep porting to make collector display labels from a syncedgraph
drewp@bigasterisk.com
parents: 2072
diff changeset
47 const U = this.graph.U();
2076
33f65e2d0e59 who needs a single emitter of all graph change events that anyone on the page can find?
drewp@bigasterisk.com
parents: 2075
diff changeset
48
2074
1a96f8647126 big graph & autodep porting to make collector display labels from a syncedgraph
drewp@bigasterisk.com
parents: 2072
diff changeset
49 this.devices = [];
2077
46a8f5a8a4dd fix collector display to show real values from py
drewp@bigasterisk.com
parents: 2076
diff changeset
50 this.clearDeviceChildElementCache();
2065
6fbc1853c0b1 split collector elements to ts files, minor porting
drewp@bigasterisk.com
parents:
diff changeset
51 let classes = this.graph.subjects(U("rdf:type"), U(":DeviceClass"));
6fbc1853c0b1 split collector elements to ts files, minor porting
drewp@bigasterisk.com
parents:
diff changeset
52 uniq(sortBy(classes, "value"), true).forEach((dc) => {
6fbc1853c0b1 split collector elements to ts files, minor porting
drewp@bigasterisk.com
parents:
diff changeset
53 sortBy(this.graph.subjects(U("rdf:type"), dc), "value").forEach((dev) => {
2074
1a96f8647126 big graph & autodep porting to make collector display labels from a syncedgraph
drewp@bigasterisk.com
parents: 2072
diff changeset
54 this.devices.push(dev as NamedNode);
2065
6fbc1853c0b1 split collector elements to ts files, minor porting
drewp@bigasterisk.com
parents:
diff changeset
55 });
6fbc1853c0b1 split collector elements to ts files, minor porting
drewp@bigasterisk.com
parents:
diff changeset
56 });
6fbc1853c0b1 split collector elements to ts files, minor porting
drewp@bigasterisk.com
parents:
diff changeset
57 }
2077
46a8f5a8a4dd fix collector display to show real values from py
drewp@bigasterisk.com
parents: 2076
diff changeset
58
46a8f5a8a4dd fix collector display to show real values from py
drewp@bigasterisk.com
parents: 2076
diff changeset
59 deviceElements: Map<string, Light9CollectorDevice> = new Map();
46a8f5a8a4dd fix collector display to show real values from py
drewp@bigasterisk.com
parents: 2076
diff changeset
60
46a8f5a8a4dd fix collector display to show real values from py
drewp@bigasterisk.com
parents: 2076
diff changeset
61 clearDeviceChildElementCache() {
46a8f5a8a4dd fix collector display to show real values from py
drewp@bigasterisk.com
parents: 2076
diff changeset
62 this.deviceElements = new Map();
46a8f5a8a4dd fix collector display to show real values from py
drewp@bigasterisk.com
parents: 2076
diff changeset
63 }
46a8f5a8a4dd fix collector display to show real values from py
drewp@bigasterisk.com
parents: 2076
diff changeset
64
46a8f5a8a4dd fix collector display to show real values from py
drewp@bigasterisk.com
parents: 2076
diff changeset
65 findDeviceChildElement(uri: string): Light9CollectorDevice | undefined {
46a8f5a8a4dd fix collector display to show real values from py
drewp@bigasterisk.com
parents: 2076
diff changeset
66 const known = this.deviceElements.get(uri);
46a8f5a8a4dd fix collector display to show real values from py
drewp@bigasterisk.com
parents: 2076
diff changeset
67 if (known) {
46a8f5a8a4dd fix collector display to show real values from py
drewp@bigasterisk.com
parents: 2076
diff changeset
68 return known;
46a8f5a8a4dd fix collector display to show real values from py
drewp@bigasterisk.com
parents: 2076
diff changeset
69 }
46a8f5a8a4dd fix collector display to show real values from py
drewp@bigasterisk.com
parents: 2076
diff changeset
70
46a8f5a8a4dd fix collector display to show real values from py
drewp@bigasterisk.com
parents: 2076
diff changeset
71 for (const el of this.shadowRoot!.querySelectorAll("light9-collector-device")) {
46a8f5a8a4dd fix collector display to show real values from py
drewp@bigasterisk.com
parents: 2076
diff changeset
72 const eld = el as Light9CollectorDevice;
46a8f5a8a4dd fix collector display to show real values from py
drewp@bigasterisk.com
parents: 2076
diff changeset
73 if (eld.uri.value == uri) {
46a8f5a8a4dd fix collector display to show real values from py
drewp@bigasterisk.com
parents: 2076
diff changeset
74 this.deviceElements.set(uri, eld);
46a8f5a8a4dd fix collector display to show real values from py
drewp@bigasterisk.com
parents: 2076
diff changeset
75 return eld;
46a8f5a8a4dd fix collector display to show real values from py
drewp@bigasterisk.com
parents: 2076
diff changeset
76 }
46a8f5a8a4dd fix collector display to show real values from py
drewp@bigasterisk.com
parents: 2076
diff changeset
77 }
46a8f5a8a4dd fix collector display to show real values from py
drewp@bigasterisk.com
parents: 2076
diff changeset
78
46a8f5a8a4dd fix collector display to show real values from py
drewp@bigasterisk.com
parents: 2076
diff changeset
79 return undefined;
46a8f5a8a4dd fix collector display to show real values from py
drewp@bigasterisk.com
parents: 2076
diff changeset
80 }
46a8f5a8a4dd fix collector display to show real values from py
drewp@bigasterisk.com
parents: 2076
diff changeset
81
46a8f5a8a4dd fix collector display to show real values from py
drewp@bigasterisk.com
parents: 2076
diff changeset
82 updateDev(uri: string, attrs: { attr: string; chan: string; val: string; valClass: string }[]) {
46a8f5a8a4dd fix collector display to show real values from py
drewp@bigasterisk.com
parents: 2076
diff changeset
83 const el = this.findDeviceChildElement(uri);
46a8f5a8a4dd fix collector display to show real values from py
drewp@bigasterisk.com
parents: 2076
diff changeset
84 if (!el) {
46a8f5a8a4dd fix collector display to show real values from py
drewp@bigasterisk.com
parents: 2076
diff changeset
85 // unresolved race: updates come in before we have device elements to display them
46a8f5a8a4dd fix collector display to show real values from py
drewp@bigasterisk.com
parents: 2076
diff changeset
86 setTimeout(() => this.updateDev(uri, attrs), 300);
46a8f5a8a4dd fix collector display to show real values from py
drewp@bigasterisk.com
parents: 2076
diff changeset
87 return;
46a8f5a8a4dd fix collector display to show real values from py
drewp@bigasterisk.com
parents: 2076
diff changeset
88 }
46a8f5a8a4dd fix collector display to show real values from py
drewp@bigasterisk.com
parents: 2076
diff changeset
89 el.setAttrs(attrs);
46a8f5a8a4dd fix collector display to show real values from py
drewp@bigasterisk.com
parents: 2076
diff changeset
90 }
2065
6fbc1853c0b1 split collector elements to ts files, minor porting
drewp@bigasterisk.com
parents:
diff changeset
91 }