102 lines
2.5 KiB
JavaScript

import { LitElement, html } from "card-tools/src/lit-element";
import { hass } from "card-tools/src/hass";
import { createCard } from "card-tools/src/lovelace-element";
import { deviceID } from "card-tools/src/deviceID";
class StateSwitch extends LitElement {
static get properties() {
return {
hass: {},
state: {},
};
}
setConfig(config) {
this._config = config;
this.state = undefined;
this.cards = {};
for(let k in config.states) {
this.cards[k] = createCard(config.states[k]);
this.cards[k].hass = hass();
}
if(config.entity === 'hash') {
window.addEventListener("location-changed", () => this.updated(new Map()));
}
if(config.entity === 'mediaquery') {
for(const q in this.cards) {
console.log("Register " + q);
window.matchMedia(q).addEventListener("change", this.update_state.bind(this));
}
}
}
update_state() {
let newstate = undefined;
switch(this._config.entity) {
case "user":
newstate = this.hass && this.hass.user && this.hass.user.name || undefined;
break;
case "group":
newstate = (this.hass && this.hass.user && this.hass.user.is_admin) ? "admin" : "user";
case "deviceID":
case "browser":
newstate = deviceID;
break;
case "hash":
newstate = location.hash.substr(1);
break;
case "mediaquery":
for(const q in this.cards) {
console.log("Check " + q);
console.log(window.matchMedia(q));
if(window.matchMedia(q).matches) {
newstate = q;
console.log(newstate);
break;
}
}
break;
default:
newstate = this.hass.states[this._config.entity];
newstate = newstate ? newstate.state : undefined;
}
if (newstate === undefined || !this.cards.hasOwnProperty(newstate))
newstate = this._config.default;
this.state = newstate;
}
updated(changedProperties) {
if(changedProperties.has("hass"))
for(let k in this.cards)
this.cards[k].hass = this.hass;
if(!changedProperties.has("state")) {
this.update_state();
}
}
render() {
return html`
<div id="root">
${this.cards[this.state]}
</div>
`;
}
getCardSize() {
let sz = 1;
for(let k in this.cards) {
if(this.cards[k] && this.cards[k].getCardSize)
sz = Math.max(sz, this.cards[k].getCardSize());
}
return sz;
}
}
customElements.define("state-switch", StateSwitch);