ednl-liftstatus-web-components
Version:
The EDNL LiftStatus web components
93 lines (92 loc) • 3.02 kB
JavaScript
import { Host, h } from "@stencil/core";
import { getStore } from "../../store";
import { sensorInfo } from "../../utils/sensorInfo";
export class LsIndicator {
constructor() {
this.processSensorUpdate = (sensorData) => {
let sensorValues = sensorData.values;
// The sensor values of 501 and 514 and 515 are zero based, but we need to show them one based
this.sensorData =
sensorValues[this.sensorId] === ""
? sensorValues[this.sensorId]
: sensorValues[this.sensorId] + 1;
};
this.sensorId = undefined;
this.dataLabel = undefined;
this.sensorData = undefined;
this.idKey = undefined;
}
async componentWillLoad() {
this.store = await getStore(this.idKey);
this.processSensorUpdate(this.store.state.currentSensorData);
this.store.onChange("currentSensorData", (sensorData) => {
this.processSensorUpdate(sensorData);
});
this.dataLabel = sensorInfo.getShortLabel(this.sensorId);
}
render() {
if (this.sensorId === null) {
console.group("%cError%c [LsIndicator] No sensor ID supplied", "color: #DC2626; background-color: #FEF2F2; display: inline-block; padding: 0 4px; border-radius: 2px;", "");
console.log(`Add the ID to the LsIndicator component like so: %c<ls-indicator sensor-id="yourId"></ls-indicator>%c`, "color:#27272A; background-color: #E4E4E7; display: inline-block; padding: 0 4px; border-radius: 2px;", "");
console.groupEnd();
}
return (h(Host, null, h("div", { class: "label" }, this.sensorId === null ? "No ID supplied" : this.dataLabel), h("div", { class: "backdrop" }, "00"), h("div", { class: "indicator" }, this.sensorData || "")));
}
static get is() { return "ls-indicator"; }
static get encapsulation() { return "shadow"; }
static get originalStyleUrls() {
return {
"$": ["ls-indicator.css"]
};
}
static get styleUrls() {
return {
"$": ["ls-indicator.css"]
};
}
static get properties() {
return {
"sensorId": {
"type": "number",
"mutable": false,
"complexType": {
"original": "number",
"resolved": "number",
"references": {}
},
"required": false,
"optional": false,
"docs": {
"tags": [],
"text": "The ID of the sensor that is to be displayed."
},
"attribute": "sensor-id",
"reflect": false
},
"idKey": {
"type": "string",
"mutable": false,
"complexType": {
"original": "string",
"resolved": "string",
"references": {}
},
"required": false,
"optional": false,
"docs": {
"tags": [],
"text": "The unique key that is used to identify store data."
},
"attribute": "id-key",
"reflect": false
}
};
}
static get states() {
return {
"dataLabel": {},
"sensorData": {}
};
}
}
//# sourceMappingURL=ls-indicator.js.map