Lovelace: Pic entity show name, state options (#5880)

* Lovelace: cleanup picture entity (#5855)

* Lovelace: Pic entity show name, state options

source/_lovelace/picture-entity.markdown

@@ -1,8 +1,8 @@
 ---
 layout: page
-title: "Picture Entity Card"
+title: Picture Entity Card
 sidebar_label: Picture Entity
-description: "A very useful card for controlling entities. By default, you will get `more-info-dialog` but using `tap_action` you can directly control entities that have `on`/`off` states."
+description: Displays the entity in form of an image. Instead of images from URL it can also show the picture of `camera` entities.
 date: 2018-07-01 10:28 +00:00
 sidebar: true
 comments: false
@@ -10,15 +10,11 @@ sharing: true
 footer: true
 ---
 
-A very useful card for controlling entities. By default, you will get `more-info-dialog` but using `tap_action` you can directly control entities that have `on`/`off` states. It allows you to generate a very nice looking card with a big touch area, highly recommended for mobile dashboards on small screens.
+Displays the entity in form of an image. Instead of images from URL it can also show the picture of `camera` entities.
-
-You can use different image combination to get a more realistic view for images with lights. The image setup also allows enough flexibility to get your garage picture with the door opened and closed.
-
-You can also use `camera` domain entities to use that as `camera_image`.
 
 <p class='img'>
-<img src='/images/lovelace/lovelace_picture_entity.gif' alt='Screenshot of the picture entity card'>
+  <img src='/images/lovelace/lovelace_picture_entity.gif' alt='Picture entity card'>
-Screenshot of the picture entity card.
+  Background changes according to the entity state.
 </p>
 
 {% configuration %}
@@ -28,60 +24,39 @@ type:
   type: string
 entity:
   required: true
-  description: "An `entity_id` to control via picture."
+  description: "An `entity_id` used for the picture."
   type: string
 camera_image:
   required: false
-  description: "Camera `entity_id` to use."
+  description: "Camera `entity_id` to use. (not required if `entity` is already a camera-entity)."
   type: string
-  default: None
 image:
   required: false
   description: URL of an image.
   type: string
-  default: None
 state_image:
   required: false
-  description: "See `state_image` object structure."
+  description: "Map entity states to images (`state: image URL`, check the example below)."
-  type: object
-  keys:
-    "on":
-      required: true
-      description: URL of an image used for on state.
-      type: string
-    "off":
-      required: true
-      description: URL of an image used for off state.
-      type: string
-      default: None
-    home:
-      required: false
-      description: URL of an image used for home state.
-      type: string
-    not_home:
-      required: false
-      description: URL of an image used for not_home state.
-      type: string
-      default: None
-    any:
-      required: false
-      description: Any state that is supported by the entity works.
   type: object
 name:
   required: false
-  description: Custom name for entity.
+  description: Overwrite entity name.
   type: string
-  default: None
+show_name:
-show_info:
   required: false
-  description: Set to false to hide infobar.
+  description: Shows name in footer.
+  type: boolean
+  default: true
+show_state:
+  required: false
+  description: Shows state in footer.
   type: boolean
   default: true
 tap_action:
   required: false
-  description: "Set to `toggle` for turning entity on/off without opening a dialog."
+  description: "Set to `toggle` for turning entity on/off."
   type: string
-  default: dialog
+  default: more-info
 {% endconfiguration %}
 
 ## {% linkable_title Examples %}
@@ -90,22 +65,16 @@ Basic example:
 
 ```yaml
 - type: picture-entity
-  image: https://images.pexels.com/photos/775219/pexels-photo-775219.jpeg?auto=compress&cs=tinysrgb&dpr=2&h=295&w=490
   entity: light.bed_light
+  image: /local/bed_light.png
 ```
 
-<p class='img'>
+Different images for each state:
-<img src='/images/lovelace/lovelace_picture_entity_2.gif' alt='Screenshot of the picture entity card'>
-Screenshot of the picture entity card.
-</p>
-
-Example with night/day:
 
 ```yaml
 - type: picture-entity
   entity: light.bed_light
-  image: http://farm7.static.flickr.com/6153/6220100622_88e64ec5d8_b.jpg
   state_image:
-    "on": http://farm7.static.flickr.com/6220/6220100616_a877f41a66_b.jpg
+    "on": /local/bed_light_on.png
-  title: Livingroom lights
+    "off": /local/bed_light_off.png
 ```