Merge pull request #8 from isabellaalstrom/dev/wrong-entity

fix for wrong entity in config
isabellaalstrom · Aug 14, 2020 · f157487 · f157487
2 parents 92acb1b + 5233111
commit f157487
Showing 1 changed file with 140 additions and 127 deletions.
diff --git a/krisinfo-card.js b/krisinfo-card.js
@@ -1,142 +1,155 @@
 customElements.whenDefined('card-tools').then(() => {
-let cardTools = customElements.get('card-tools');
+  let cardTools = customElements.get('card-tools');
+
+  class KrisinfoCard extends cardTools.LitElement {
+
+    setConfig(config) {
 
-class KrisinfoCard extends cardTools.LitElement {
-
-  setConfig(config) {
-    if (!config.entity) {
-      throw new Error('Please define entity');
+      if (!config.entity) {
+        throw new Error('Please define entity');
+      }
+      this.config = config;
     }
-    this.config = config;
-  }
-
-  render(){
-    return cardTools.LitHtml
-    `
-      ${this._renderStyle()}
-      ${this.config.only_alerts == false || this.config.only_alerts == null
-        ? cardTools.LitHtml
-        `<ha-card>
-          <div class="header">
-            <div class="name">
-              ${this.header}
-            </div>
-          </div>
-          ${this.messages.length == 0
-            ? cardTools.LitHtml`<p>Inga meddelanden just nu</p>`
-            : this.messages.map(message => 
-              cardTools.LitHtml`<div class="message">
-                      <span>${message.SenderName}</span>
-                        </br><span>Skickat: ${message.Published}</span>
-                        <h3>${message.Event == "Alert" ? cardTools.LitHtml`<ha-icon id="state-icon" icon="mdi:alert"></ha-icon>` : ''}${message.Headline}</h3>
-                      <p class="">${message.Message}</p>
-                      <a target="_blank" href="${message.Web}">Läs mer</a>
-                    </div>
-              `)}
-          </ha-card>`
-        : // if only alerts
-        cardTools.LitHtml
+
+    render(){
+      if (!this.entity)
+        return html`
+        <hui-warning>
+          ${this._hass.localize("ui.panel.lovelace.warning.entity_not_found",
+            "entity",
+            this.config.entity
+          )}
+        </hui-warning>
         `
-        ${this.state == "Alert" ?
+      return cardTools.LitHtml
+      `
+        ${this._renderStyle()}
+        ${this.config.only_alerts == false || this.config.only_alerts == null
+          ? cardTools.LitHtml
+          `<ha-card>
+            <div class="header">
+              <div class="name">
+                ${this.header}
+              </div>
+            </div>
+            ${this.messages.length == 0
+              ? cardTools.LitHtml`<p>Inga meddelanden just nu</p>`
+              : this.messages.map(message => 
+                cardTools.LitHtml`<div class="message">
+                        <span>${message.SenderName}</span>
+                          </br><span>Skickat: ${message.Published}</span>
+                          <h3>${message.Event == "Alert" ? cardTools.LitHtml`<ha-icon id="state-icon" icon="mdi:alert"></ha-icon>` : ''}${message.Headline}</h3>
+                        <p class="">${message.Message}</p>
+                        <a target="_blank" href="${message.Web}">Läs mer</a>
+                      </div>
+                `)}
+            </ha-card>`
+          : // if only alerts
           cardTools.LitHtml
           `
-            <ha-card>
-              <div class="header">
-                <div class="name">
-                  ${this.state} - ${this.header}
+          ${this.state == "Alert" ?
+            cardTools.LitHtml
+            `
+              <ha-card>
+                <div class="header">
+                  <div class="name">
+                    ${this.state} - ${this.header}
+                  </div>
                 </div>
-              </div>
-              ${this.messages.length == 0
-                ? cardTools.LitHtml`<p>Inga meddelanden just nu</p>`
-                : this.messages.map(message => 
-                  cardTools.LitHtml`
-                  ${message.Event == "Alert" ?
-                    cardTools.LitHtml`<div class="message">
-                            <span>${message.SenderName}</span>
-                              </br><span>Skickat: ${message.Published}</span>
-                              <h3>${message.Event == "Alert" ? cardTools.LitHtml`<ha-icon id="state-icon" icon="mdi:alert"></ha-icon>` : ''}${message.Headline}</h3>
-                            <p class="">${message.Message}</p>
-                            <a target="_blank" href="${message.Web}">Läs mer</a>
-                          </div>
-                    `
-                  : ''}`
-                  )
-              
-                }
-            </ha-card>
+                ${this.messages.length == 0
+                  ? cardTools.LitHtml`<p>Inga meddelanden just nu</p>`
+                  : this.messages.map(message => 
+                    cardTools.LitHtml`
+                    ${message.Event == "Alert" ?
+                      cardTools.LitHtml`<div class="message">
+                              <span>${message.SenderName}</span>
+                                </br><span>Skickat: ${message.Published}</span>
+                                <h3>${message.Event == "Alert" ? cardTools.LitHtml`<ha-icon id="state-icon" icon="mdi:alert"></ha-icon>` : ''}${message.Headline}</h3>
+                              <p class="">${message.Message}</p>
+                              <a target="_blank" href="${message.Web}">Läs mer</a>
+                            </div>
+                      `
+                    : ''}`
+                    )
+                
+                  }
+              </ha-card>
+            `
+            : ''
+          }
           `
-          : ''
         }
+      `;
+    }    
+
+    _renderStyle() {
+        return cardTools.LitHtml
         `
+          <style>
+            ha-card {
+              padding: 16px;
+            }
+            .header {
+              padding: 0;
+              @apply --paper-font-headline;
+              line-height: 40px;
+              color: var(--primary-text-color);
+              padding: 4px 0 12px;
+            }
+            .message {
+              padding-bottom: 1em;
+            }
+            h3 {
+              margin-top: 10px;
+              margin-bottom: 0;
+            }
+            p {
+              margin-top: 7px;
+            }
+            .card {
+              padding: 1em;
+              padding-top: 0;
+            }
+            .state {
+              display: block;
+              margin: auto;
+              text-align: center;
+            }
+            #state-icon {
+              color: red;
+              padding-right: 7px;
+            }
+          </style>
+        `;
       }
-    `;
-  }    
-
-  _renderStyle() {
-      return cardTools.LitHtml
-      `
-        <style>
-          ha-card {
-            padding: 16px;
-          }
-          .header {
-            padding: 0;
-            @apply --paper-font-headline;
-            line-height: 40px;
-            color: var(--primary-text-color);
-            padding: 4px 0 12px;
-          }
-          .message {
-            padding-bottom: 1em;
-          }
-          h3 {
-            margin-top: 10px;
-            margin-bottom: 0;
-          }
-          p {
-            margin-top: 7px;
-          }
-          .card {
-            padding: 1em;
-            padding-top: 0;
-          }
-          .state {
-            display: block;
-            margin: auto;
-            text-align: center;
-          }
-          #state-icon {
-            color: red;
-            padding-right: 7px;
-          }
-        </style>
-      `;
+
+    set hass(hass) {
+      this._hass = hass;
+      this.entity = this.config.entity in hass.states ? hass.states[this.config.entity] : null;
+      if(this.entity)
+      {
+        this.header = this.entity.attributes.friendly_name;
+        this.messages = this.entity.attributes.messages;
+        this.state = this.entity.state
+      }
+
+      this.requestUpdate();
     }
 
-  set hass(hass) {
-    this._hass = hass;
-
-    const entity = hass.states[this.config.entity];
-    this.header = entity.attributes.friendly_name;
-    this.messages = entity.attributes.messages;
-    this.state = entity.state
-    this.requestUpdate();
-  }
-
-
-
-  // @TODO: This requires more intelligent logic
-  getCardSize() {
-    return 3;
+
+
+    // @TODO: This requires more intelligent logic
+    getCardSize() {
+      return 3;
+    }
   }
-}
-
-customElements.define('krisinfo-card', KrisinfoCard);
-});
-
-window.setTimeout(() => {
-  if(customElements.get('card-tools')) return;
-  customElements.define('krisinfo-card', class extends HTMLElement{
-    setConfig() { throw new Error("Can't find card-tools. See https://github.com/thomasloven/lovelace-card-tools");}
+
+  customElements.define('krisinfo-card', KrisinfoCard);
   });
-}, 2000);
+
+  window.setTimeout(() => {
+    if(customElements.get('card-tools')) return;
+    customElements.define('krisinfo-card', class extends HTMLElement{
+      setConfig() { throw new Error("Can't find card-tools. See https://github.com/thomasloven/lovelace-card-tools");}
+    });
+  }, 2000);