mirror of
https://github.com/zaphar/Heracles.git
synced 2025-07-23 04:29:48 -04:00
feat: Graphs update on an interval now.
This commit is contained in:
parent
9e52ac341b
commit
a725e39140
@ -2,16 +2,19 @@ class TimeseriesGraph extends HTMLElement {
|
||||
#uri;
|
||||
#width;
|
||||
#height;
|
||||
#intervalId;
|
||||
#pollSeconds;
|
||||
constructor() {
|
||||
super();
|
||||
const root = this.attachShadow({ mode: "open" });
|
||||
var template = document.getElementById("timeseries_template");
|
||||
this.#width = 1000;
|
||||
this.height = 500;
|
||||
this.#height = 500;
|
||||
this.#pollSeconds = 5;
|
||||
root.appendChild(template.content.cloneNode(true));
|
||||
}
|
||||
|
||||
static observedAttributes = ['uri', 'width', 'height'];
|
||||
static observedAttributes = ['uri', 'width', 'height', 'poll-seconds'];
|
||||
|
||||
attributeChanged(name, _oldValue, newValue) {
|
||||
switch (name) {
|
||||
@ -24,6 +27,9 @@ class TimeseriesGraph extends HTMLElement {
|
||||
case 'height':
|
||||
this.#height = newValue;
|
||||
break;
|
||||
case 'poll-seconds':
|
||||
this.#pollSeconds = newValue;
|
||||
break;
|
||||
default: // do nothing;
|
||||
break;
|
||||
}
|
||||
@ -31,25 +37,40 @@ class TimeseriesGraph extends HTMLElement {
|
||||
// TODO(zaphar): reset update timer as well
|
||||
}
|
||||
|
||||
getTargetNode() {
|
||||
console.log("shadowroot: ", this.shadowRoot);
|
||||
return this.shadowRoot.firstChild;
|
||||
}
|
||||
|
||||
connectedCallback() {
|
||||
// TODO(zaphar): Set up the timer loop to update graph data.
|
||||
this.#uri = this.getAttribute('uri');
|
||||
if (this.#uri) {
|
||||
this.updateGraph();
|
||||
}
|
||||
this.resetInterval()
|
||||
}
|
||||
|
||||
disconnectedCallback() {
|
||||
// TODO(zaphar): Turn off the timer loop to update graph.
|
||||
clearInterval(this.#intervalId);
|
||||
this.#intervalId = null;
|
||||
}
|
||||
|
||||
static elementName = "timeseries-graph";
|
||||
|
||||
getTargetNode() {
|
||||
console.log("shadowroot: ", this.shadowRoot);
|
||||
return this.shadowRoot.firstChild;
|
||||
}
|
||||
|
||||
stopInterval() {
|
||||
if (this.#intervalId) {
|
||||
clearInterval(this.#intervalId);
|
||||
this.#intervalId = null;
|
||||
}
|
||||
}
|
||||
|
||||
resetInterval() {
|
||||
this.stopInterval()
|
||||
this.#intervalId = setInterval(() => this.updateGraph(), 1000 * this.#pollSeconds);
|
||||
}
|
||||
|
||||
static registerElement() {
|
||||
if (!customElements.get(TimeseriesGraph.elementName)) {
|
||||
customElements.define(TimeseriesGraph.elementName, TimeseriesGraph);
|
||||
|
Loading…
x
Reference in New Issue
Block a user