From 918c2ce29e0b118e0c82911dff9df5322adc796a Mon Sep 17 00:00:00 2001
From: Jerad Meisner <jerad.meisner@gmail.com>
Date: Mon, 2 Jul 2018 11:20:16 -0700
Subject: [PATCH] Love: Update hui-image to use entity instead of state.
 (#1386)

* Update hui-image to use entity instead of state.

* Removed old function.
---
 .../lovelace/cards/hui-picture-entity-card.js     |  9 +++------
 .../lovelace/cards/hui-picture-glance-card.js     |  5 ++++-
 src/panels/lovelace/components/hui-image.js       | 15 +++++++--------
 3 files changed, 14 insertions(+), 15 deletions(-)

diff --git a/src/panels/lovelace/cards/hui-picture-entity-card.js b/src/panels/lovelace/cards/hui-picture-entity-card.js
index 64abd7537d..817c95bf6c 100644
--- a/src/panels/lovelace/cards/hui-picture-entity-card.js
+++ b/src/panels/lovelace/cards/hui-picture-entity-card.js
@@ -52,7 +52,7 @@ class HuiPictureEntityCard extends LocalizeMixin(PolymerElement) {
           image="[[_config.image]]" 
           state-image="[[_config.state_image]]" 
           camera-image="[[_config.camera_image]]" 
-          state="[[_getStateObj(_oldState)]]"
+          entity="[[_config.entity]]"
         ></hui-image>
         <div class="box">
           <div id="title"></div>
@@ -77,7 +77,8 @@ class HuiPictureEntityCard extends LocalizeMixin(PolymerElement) {
   }
 
   setConfig(config) {
-    if (!config || !config.entity || (!config.image && !config.state_image)) {
+    if (!config || !config.entity ||
+      (!config.image && !config.state_image && !config.camera_image)) {
       throw new Error('Error in card configuration.');
     }
     this._config = config;
@@ -134,10 +135,6 @@ class HuiPictureEntityCard extends LocalizeMixin(PolymerElement) {
       toggleEntity(this.hass, entityId);
     }
   }
-
-  _getStateObj() {
-    return this.hass && this.hass.states[this._config.entity];
-  }
 }
 
 customElements.define('hui-picture-entity-card', HuiPictureEntityCard);
diff --git a/src/panels/lovelace/cards/hui-picture-glance-card.js b/src/panels/lovelace/cards/hui-picture-glance-card.js
index 3955a9b693..3ef0e5e993 100644
--- a/src/panels/lovelace/cards/hui-picture-glance-card.js
+++ b/src/panels/lovelace/cards/hui-picture-glance-card.js
@@ -60,7 +60,9 @@ class HuiPictureGlanceCard extends LocalizeMixin(EventsMixin(PolymerElement)) {
         <hui-image 
           hass="[[hass]]" 
           image="[[_config.image]]" 
+          state-image="[[_config.state_image]]"
           camera-image="[[_config.camera_image]]"
+          entity="[[_config.entity]]"
         ></hui-image>
         <div class="box">
           <div class="title">[[_config.title]]</div>
@@ -115,7 +117,8 @@ class HuiPictureGlanceCard extends LocalizeMixin(EventsMixin(PolymerElement)) {
 
   setConfig(config) {
     if (!config || !config.entities || !Array.isArray(config.entities) ||
-      !(config.image || config.camera_image)) {
+      !(config.image || config.camera_image || config.state_image) ||
+      (config.state_image && !config.entity)) {
       throw new Error('Invalid card configuration');
     }
 
diff --git a/src/panels/lovelace/components/hui-image.js b/src/panels/lovelace/components/hui-image.js
index 066a0a5deb..7926501752 100644
--- a/src/panels/lovelace/components/hui-image.js
+++ b/src/panels/lovelace/components/hui-image.js
@@ -49,12 +49,11 @@ class HuiImage extends LocalizeMixin(PolymerElement) {
 
   static get properties() {
     return {
-      hass: Object,
-      state: {
+      hass: {
         type: Object,
-        value: null,
-        observer: '_stateChanged'
+        observer: '_hassChanged'
       },
+      entity: String,
       image: String,
       stateImage: Object,
       cameraImage: String,
@@ -102,11 +101,12 @@ class HuiImage extends LocalizeMixin(PolymerElement) {
     this._error = false;
   }
 
-  _stateChanged(state) {
-    if (this.cameraImage) {
+  _hassChanged(hass) {
+    if (this.cameraImage || !this.entity) {
       return;
     }
 
+    const state = hass.states[this.entity];
     const unavailable = !isValidObject(state, ['state']);
 
     if (!this.stateImage) {
@@ -114,8 +114,7 @@ class HuiImage extends LocalizeMixin(PolymerElement) {
       return;
     }
 
-    const stateImg = !unavailable ?
-      (this.stateImage[state.state] || this.stateImage.default) : this.stateImage.unavailable;
+    const stateImg = !unavailable ? this.stateImage[state.state] : this.stateImage.unavailable;
 
     this.setProperties({
       _imageClass: !stateImg && (unavailable || STATES_OFF.includes(state.state)) ? 'state-off' : '',