Mercurial > code > home > repos > homeauto
comparison service/collector/static/state.js @ 1465:9d22aa924e8a
prettier times. new streamed-graph browse link
Ignore-this: beb72354711b5b68777f622c28fea740
darcs-hash:f86e69afb36753d1afc51f92b5c75ba80b5055d6
author | drewp <drewp@bigasterisk.com> |
---|---|
date | Wed, 18 Dec 2019 17:23:34 -0800 |
parents | 71684fc9c692 |
children |
comparison
equal
deleted
inserted
replaced
1464:32d134dbfb1e | 1465:9d22aa924e8a |
---|---|
41 | 41 |
42 render() { | 42 render() { |
43 const sourcesTable = (clients) => { | 43 const sourcesTable = (clients) => { |
44 const clientRow = (client) => { | 44 const clientRow = (client) => { |
45 const d = client.reconnectedPatchSource; | 45 const d = client.reconnectedPatchSource; |
46 const now = Date.now() / 1000; | |
47 const dispSec = (sec) => ( | |
48 Math.abs(sec) > now - 1 ? '--' : | |
49 Math.abs(sec) > 3600 ? | |
50 `${Math.round(sec/3600)} hr` : Math.abs(sec) > 60 ? | |
51 `${Math.round(sec/60)} min` : | |
52 `${Math.round(sec*10)/10} sec`); | |
46 return html` | 53 return html` |
47 <tr> | 54 <tr> |
48 <td><a href="/rdf/browse/?graph=${d.url}">[browse]</a> <a href="${d.url}">${d.url}</a></td> | 55 <td><a href="/rdf/browse/?graph=${d.url}">[browse]</a> <a href="${d.url}">${d.url}</a></td> |
49 <td>${d.fullGraphReceived}</td> | 56 <td>${d.fullGraphReceived}</td> |
50 <td>${d.patchesReceived}</td> | 57 <td>${d.patchesReceived}</td> |
51 <td>${d.time.open}</td> | 58 <td>${dispSec(d.time.open - now)}</td> |
52 <td>${d.time.fullGraph}</td> | 59 <td>${dispSec(d.time.fullGraph - d.time.open)}</td> |
53 <td>${d.time.latestPatch}</td> | 60 <td>${dispSec(d.time.latestPatch - now)}</td> |
54 </tr> | 61 </tr> |
55 `; | 62 `; |
56 }; | 63 }; |
57 | 64 |
58 return html` | 65 return html` |
60 <thead> | 67 <thead> |
61 <tr> | 68 <tr> |
62 <th>patch source</th> | 69 <th>patch source</th> |
63 <th>full graph recv</th> | 70 <th>full graph recv</th> |
64 <th>patches recv</th> | 71 <th>patches recv</th> |
65 <th>time open</th> | 72 <th>time open (rel)</th> |
66 <th>time fullGraph</th> | 73 <th>time fullGraph (after open)</th> |
67 <th>time latest patch</th> | 74 <th>time latest patch (rel)</th> |
68 </tr> | 75 </tr> |
69 </thead> | 76 </thead> |
70 <tbody> | 77 <tbody> |
71 ${clients.map(clientRow)} | 78 ${clients.map(clientRow)} |
72 </tbody> | 79 </tbody> |
110 } | 117 } |
111 const d = this.latestState.graphClients; | 118 const d = this.latestState.graphClients; |
112 return html` | 119 return html` |
113 <div> | 120 <div> |
114 <p> | 121 <p> |
115 Graph: ${d.statements.len} statements | 122 Graph: ${d.statements ? d.statements.len : 0} statements |
116 </p> | 123 </p> |
117 | 124 |
118 <p> | 125 <p> |
119 Sources: | 126 Sources: |
120 ${sourcesTable(d.clients)} | 127 ${sourcesTable(d.clients || [])} |
121 </p> | 128 </p> |
122 | 129 |
123 <p> | 130 <p> |
124 Listening clients: | 131 Listening clients: |
125 ${handlersTable(d.sseHandlers)} | 132 ${handlersTable(d.sseHandlers || [])} |
126 </p> | 133 </p> |
127 </div>`; | 134 </div>`; |
128 } | 135 } |
129 } | 136 } |
130 customElements.define('collector-state', CollectorState); | 137 customElements.define('collector-state', CollectorState); |