annotate web/collector/Light9CollectorDevice.ts @ 2378:6c98a6677a7d

update js libs
author drewp@bigasterisk.com
date Sun, 12 May 2024 19:05:02 -0700
parents 4556eebe5d73
children
Ignore whitespace changes - Everywhere: Within whitespace: At end of lines:
rev   line source
2074
1a96f8647126 big graph & autodep porting to make collector display labels from a syncedgraph
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 { css, html, LitElement } from "lit";
6fbc1853c0b1 split collector elements to ts files, minor porting
drewp@bigasterisk.com
parents:
diff changeset
3 import { customElement, property } from "lit/decorators.js";
2074
1a96f8647126 big graph & autodep porting to make collector display labels from a syncedgraph
drewp@bigasterisk.com
parents: 2065
diff changeset
4 import { NamedNode } from "n3";
2151
drewp@bigasterisk.com
parents: 2077
diff changeset
5 export { ResourceDisplay } from "../../web/ResourceDisplay";
2076
33f65e2d0e59 who needs a single emitter of all graph change events that anyone on the page can find?
drewp@bigasterisk.com
parents: 2074
diff changeset
6
2074
1a96f8647126 big graph & autodep porting to make collector display labels from a syncedgraph
drewp@bigasterisk.com
parents: 2065
diff changeset
7 const log = debug("device-el");
2065
6fbc1853c0b1 split collector elements to ts files, minor porting
drewp@bigasterisk.com
parents:
diff changeset
8
6fbc1853c0b1 split collector elements to ts files, minor porting
drewp@bigasterisk.com
parents:
diff changeset
9 @customElement("light9-collector-device")
6fbc1853c0b1 split collector elements to ts files, minor porting
drewp@bigasterisk.com
parents:
diff changeset
10 export class Light9CollectorDevice extends LitElement {
6fbc1853c0b1 split collector elements to ts files, minor porting
drewp@bigasterisk.com
parents:
diff changeset
11 static styles = [
6fbc1853c0b1 split collector elements to ts files, minor porting
drewp@bigasterisk.com
parents:
diff changeset
12 css`
6fbc1853c0b1 split collector elements to ts files, minor porting
drewp@bigasterisk.com
parents:
diff changeset
13 :host {
6fbc1853c0b1 split collector elements to ts files, minor porting
drewp@bigasterisk.com
parents:
diff changeset
14 display: block;
6fbc1853c0b1 split collector elements to ts files, minor porting
drewp@bigasterisk.com
parents:
diff changeset
15 break-inside: avoid-column;
6fbc1853c0b1 split collector elements to ts files, minor porting
drewp@bigasterisk.com
parents:
diff changeset
16 font-size: 80%;
6fbc1853c0b1 split collector elements to ts files, minor porting
drewp@bigasterisk.com
parents:
diff changeset
17 }
6fbc1853c0b1 split collector elements to ts files, minor porting
drewp@bigasterisk.com
parents:
diff changeset
18 h3 {
6fbc1853c0b1 split collector elements to ts files, minor porting
drewp@bigasterisk.com
parents:
diff changeset
19 margin-top: 12px;
6fbc1853c0b1 split collector elements to ts files, minor porting
drewp@bigasterisk.com
parents:
diff changeset
20 margin-bottom: 0;
6fbc1853c0b1 split collector elements to ts files, minor porting
drewp@bigasterisk.com
parents:
diff changeset
21 }
6fbc1853c0b1 split collector elements to ts files, minor porting
drewp@bigasterisk.com
parents:
diff changeset
22 td {
6fbc1853c0b1 split collector elements to ts files, minor porting
drewp@bigasterisk.com
parents:
diff changeset
23 white-space: nowrap;
6fbc1853c0b1 split collector elements to ts files, minor porting
drewp@bigasterisk.com
parents:
diff changeset
24 }
6fbc1853c0b1 split collector elements to ts files, minor porting
drewp@bigasterisk.com
parents:
diff changeset
25
6fbc1853c0b1 split collector elements to ts files, minor porting
drewp@bigasterisk.com
parents:
diff changeset
26 td.nonzero {
6fbc1853c0b1 split collector elements to ts files, minor porting
drewp@bigasterisk.com
parents:
diff changeset
27 background: #310202;
6fbc1853c0b1 split collector elements to ts files, minor porting
drewp@bigasterisk.com
parents:
diff changeset
28 color: #e25757;
6fbc1853c0b1 split collector elements to ts files, minor porting
drewp@bigasterisk.com
parents:
diff changeset
29 }
6fbc1853c0b1 split collector elements to ts files, minor porting
drewp@bigasterisk.com
parents:
diff changeset
30 td.full {
6fbc1853c0b1 split collector elements to ts files, minor porting
drewp@bigasterisk.com
parents:
diff changeset
31 background: #2b0000;
6fbc1853c0b1 split collector elements to ts files, minor porting
drewp@bigasterisk.com
parents:
diff changeset
32 color: red;
6fbc1853c0b1 split collector elements to ts files, minor porting
drewp@bigasterisk.com
parents:
diff changeset
33 font-weight: bold;
6fbc1853c0b1 split collector elements to ts files, minor porting
drewp@bigasterisk.com
parents:
diff changeset
34 }
6fbc1853c0b1 split collector elements to ts files, minor porting
drewp@bigasterisk.com
parents:
diff changeset
35 `,
6fbc1853c0b1 split collector elements to ts files, minor porting
drewp@bigasterisk.com
parents:
diff changeset
36 ];
6fbc1853c0b1 split collector elements to ts files, minor porting
drewp@bigasterisk.com
parents:
diff changeset
37
6fbc1853c0b1 split collector elements to ts files, minor porting
drewp@bigasterisk.com
parents:
diff changeset
38 render() {
6fbc1853c0b1 split collector elements to ts files, minor porting
drewp@bigasterisk.com
parents:
diff changeset
39 return html`
2074
1a96f8647126 big graph & autodep porting to make collector display labels from a syncedgraph
drewp@bigasterisk.com
parents: 2065
diff changeset
40 <h3><resource-display .uri=${this.uri}></resource-display></h3>
2065
6fbc1853c0b1 split collector elements to ts files, minor porting
drewp@bigasterisk.com
parents:
diff changeset
41 <table class="borders">
6fbc1853c0b1 split collector elements to ts files, minor porting
drewp@bigasterisk.com
parents:
diff changeset
42 <tr>
6fbc1853c0b1 split collector elements to ts files, minor porting
drewp@bigasterisk.com
parents:
diff changeset
43 <th>out attr</th>
6fbc1853c0b1 split collector elements to ts files, minor porting
drewp@bigasterisk.com
parents:
diff changeset
44 <th>value</th>
6fbc1853c0b1 split collector elements to ts files, minor porting
drewp@bigasterisk.com
parents:
diff changeset
45 <th>chan</th>
6fbc1853c0b1 split collector elements to ts files, minor porting
drewp@bigasterisk.com
parents:
diff changeset
46 </tr>
2074
1a96f8647126 big graph & autodep porting to make collector display labels from a syncedgraph
drewp@bigasterisk.com
parents: 2065
diff changeset
47 ${this.attrs.map(
1a96f8647126 big graph & autodep porting to make collector display labels from a syncedgraph
drewp@bigasterisk.com
parents: 2065
diff changeset
48 (item) => html`
1a96f8647126 big graph & autodep porting to make collector display labels from a syncedgraph
drewp@bigasterisk.com
parents: 2065
diff changeset
49 <tr>
1a96f8647126 big graph & autodep porting to make collector display labels from a syncedgraph
drewp@bigasterisk.com
parents: 2065
diff changeset
50 <td>${item.attr}</td>
1a96f8647126 big graph & autodep porting to make collector display labels from a syncedgraph
drewp@bigasterisk.com
parents: 2065
diff changeset
51 <td class=${item.valClass}>${item.val} →</td>
1a96f8647126 big graph & autodep porting to make collector display labels from a syncedgraph
drewp@bigasterisk.com
parents: 2065
diff changeset
52 <td>${item.chan}</td>
1a96f8647126 big graph & autodep porting to make collector display labels from a syncedgraph
drewp@bigasterisk.com
parents: 2065
diff changeset
53 </tr>
1a96f8647126 big graph & autodep porting to make collector display labels from a syncedgraph
drewp@bigasterisk.com
parents: 2065
diff changeset
54 `
1a96f8647126 big graph & autodep porting to make collector display labels from a syncedgraph
drewp@bigasterisk.com
parents: 2065
diff changeset
55 )}
2065
6fbc1853c0b1 split collector elements to ts files, minor porting
drewp@bigasterisk.com
parents:
diff changeset
56 </table>
6fbc1853c0b1 split collector elements to ts files, minor porting
drewp@bigasterisk.com
parents:
diff changeset
57 `;
6fbc1853c0b1 split collector elements to ts files, minor porting
drewp@bigasterisk.com
parents:
diff changeset
58 }
2074
1a96f8647126 big graph & autodep porting to make collector display labels from a syncedgraph
drewp@bigasterisk.com
parents: 2065
diff changeset
59 @property({
2077
46a8f5a8a4dd fix collector display to show real values from py
drewp@bigasterisk.com
parents: 2076
diff changeset
60 converter: acceptStringOrUri(),
2074
1a96f8647126 big graph & autodep porting to make collector display labels from a syncedgraph
drewp@bigasterisk.com
parents: 2065
diff changeset
61 })
1a96f8647126 big graph & autodep porting to make collector display labels from a syncedgraph
drewp@bigasterisk.com
parents: 2065
diff changeset
62 uri: NamedNode = new NamedNode("");
1a96f8647126 big graph & autodep porting to make collector display labels from a syncedgraph
drewp@bigasterisk.com
parents: 2065
diff changeset
63 @property() attrs: Array<{ attr: string; valClass: string; val: string; chan: string }> = [];
2065
6fbc1853c0b1 split collector elements to ts files, minor porting
drewp@bigasterisk.com
parents:
diff changeset
64
2077
46a8f5a8a4dd fix collector display to show real values from py
drewp@bigasterisk.com
parents: 2076
diff changeset
65 setAttrs(attrs: any) {
46a8f5a8a4dd fix collector display to show real values from py
drewp@bigasterisk.com
parents: 2076
diff changeset
66 this.attrs = attrs;
46a8f5a8a4dd fix collector display to show real values from py
drewp@bigasterisk.com
parents: 2076
diff changeset
67 this.attrs.forEach(function (row: any) {
46a8f5a8a4dd fix collector display to show real values from py
drewp@bigasterisk.com
parents: 2076
diff changeset
68 row.valClass = row.val == 255 ? "full" : row.val ? "nonzero" : "";
46a8f5a8a4dd fix collector display to show real values from py
drewp@bigasterisk.com
parents: 2076
diff changeset
69 });
2074
1a96f8647126 big graph & autodep porting to make collector display labels from a syncedgraph
drewp@bigasterisk.com
parents: 2065
diff changeset
70 }
2065
6fbc1853c0b1 split collector elements to ts files, minor porting
drewp@bigasterisk.com
parents:
diff changeset
71 }
2077
46a8f5a8a4dd fix collector display to show real values from py
drewp@bigasterisk.com
parents: 2076
diff changeset
72
46a8f5a8a4dd fix collector display to show real values from py
drewp@bigasterisk.com
parents: 2076
diff changeset
73 function acceptStringOrUri() {
46a8f5a8a4dd fix collector display to show real values from py
drewp@bigasterisk.com
parents: 2076
diff changeset
74 return (s: string | null) => new NamedNode(s || "");
46a8f5a8a4dd fix collector display to show real values from py
drewp@bigasterisk.com
parents: 2076
diff changeset
75 }