20200312.0

gallery/src/data/media_players.ts

@@ -1,23 +1,36 @@
 import { getEntity } from "../../../src/fake_data/entity";
 
 export const createMediaPlayerEntities = () => [
-  getEntity("media_player", "bedroom", "playing", {
-    media_content_type: "movie",
-    media_title: "Epic sax guy 10 hours",
-    app_name: "YouTube",
-    friendly_name: "Skip, no pause",
-    supported_features: 32,
+  getEntity("media_player", "music_paused", "paused", {
+    friendly_name: "Pausing The Music",
+    media_content_type: "music",
+    media_title: "I Wanna Be A Hippy (Flamman & Abraxas Radio Mix)",
+    media_artist: "Technohead",
+    supported_features: 64063,
+    entity_picture: "/images/album_cover.jpg",
+    media_duration: 300,
+    media_position: 50,
+    media_position_updated_at: new Date(
+      // 23 seconds in
+      new Date().getTime() - 23000
+    ).toISOString(),
   }),
-  getEntity("media_player", "family_room", "paused", {
-    friendly_name: "Paused, music",
+  getEntity("media_player", "music_playing", "playing", {
+    friendly_name: "Playing The Music",
     media_content_type: "music",
     media_title: "I Wanna Be A Hippy (Flamman & Abraxas Radio Mix)",
     media_artist: "Technohead",
-    supported_features: 16417,
+    supported_features: 64063,
     entity_picture: "/images/album_cover.jpg",
+    media_duration: 300,
+    media_position: 0,
+    media_position_updated_at: new Date(
+      // 23 seconds in
+      new Date().getTime() - 23000
+    ).toISOString(),
   }),
-  getEntity("media_player", "family_room_no_play", "paused", {
-    friendly_name: "Paused, no play",
+  getEntity("media_player", "stream_playing", "playing", {
+    friendly_name: "Playing the Stream",
     media_content_type: "movie",
     media_title: "Epic sax guy 10 hours",
     app_name: "YouTube",
@@ -31,25 +44,19 @@ export const createMediaPlayerEntities = () => [
     app_name: "Netflix",
     supported_features: 1,
   }),
-  getEntity("media_player", "lounge_room", "idle", {
-    friendly_name: "Screen casting",
-    media_content_type: "music",
-    media_title: "I Wanna Be A Hippy (Flamman & Abraxas Radio Mix)",
-    media_artist: "Technohead",
-    supported_features: 1,
+  getEntity("media_player", "sonos_idle", "idle", {
+    friendly_name: "Sonos Idle",
+    supported_features: 64063,
   }),
   getEntity("media_player", "theater", "off", {
-    friendly_name: "Chromcast Idle",
-    media_content_type: "movie",
-    media_title: "Epic sax guy 10 hours",
-    app_name: "YouTube",
-    supported_features: 33,
+    friendly_name: "TV Off",
+    supported_features: 161,
   }),
   getEntity("media_player", "android_cast", "playing", {
-    friendly_name: "Player Off",
+    friendly_name: "Casting App",
     media_title: "Android Screen Casting",
     app_name: "Screen Mirroring",
-    supported_features: 21437,
+    // supported_features: 21437,
   }),
   getEntity("media_player", "unavailable", "unavailable", {
     friendly_name: "Player Unavailable",
@@ -59,4 +66,17 @@ export const createMediaPlayerEntities = () => [
     friendly_name: "Player Unknown",
     supported_features: 21437,
   }),
+  getEntity("media_player", "receiver_on", "on", {
+    source_list: ["AirPlay", "Blu-Ray", "TV", "USB", "iPod (USB)"],
+    volume_level: 0.63,
+    is_volume_muted: false,
+    source: "TV",
+    friendly_name: "Receiver",
+    supported_features: 84364,
+  }),
+  getEntity("media_player", "receiver_off", "off", {
+    source_list: ["AirPlay", "Blu-Ray", "TV", "USB", "iPod (USB)"],
+    friendly_name: "Receiver",
+    supported_features: 84364,
+  }),
 ];

gallery/src/demos/demo-hui-media-control-card.ts

@@ -7,24 +7,24 @@ import { createMediaPlayerEntities } from "../data/media_players";
 
 const CONFIGS = [
   {
-    heading: "Skip, no pause",
+    heading: "Paused music",
     config: `
   - type: media-control
-    entity: media_player.bedroom
+    entity: media_player.music_paused
     `,
   },
   {
-    heading: "Paused, music",
+    heading: "Playing music",
     config: `
   - type: media-control
-    entity: media_player.family_room
+    entity: media_player.music_playing
     `,
   },
   {
-    heading: "Paused, no play",
+    heading: "Playing stream",
     config: `
   - type: media-control
-    entity: media_player.family_room_no_play
+    entity: media_player.stream_playing
     `,
   },
   {
@@ -42,10 +42,10 @@ const CONFIGS = [
     `,
   },
   {
-    heading: "Chromcast Idle",
+    heading: "Sonos Idle",
     config: `
   - type: media-control
-    entity: media_player.lounge_room
+    entity: media_player.sonos_idle
     `,
   },
   {
@@ -69,6 +69,20 @@ const CONFIGS = [
     entity: media_player.unknown
     `,
   },
+  {
+    heading: "Receiver On",
+    config: `
+  - type: media-control
+    entity: media_player.receiver_on
+    `,
+  },
+  {
+    heading: "Receiver Off",
+    config: `
+  - type: media-control
+    entity: media_player.receiver_off
+    `,
+  },
 ];
 
 class DemoHuiMediControlCard extends PolymerElement {

gallery/src/demos/demo-hui-media-player-rows.ts

@@ -11,17 +11,17 @@ const CONFIGS = [
     config: `
 - type: entities
   entities:
-    - entity: media_player.bedroom
-      name: Skip, no pause
-    - entity: media_player.family_room
-      name: Paused, music
-    - entity: media_player.family_room_no_play
+    - entity: media_player.music_paused
+      name: Paused music
+    - entity: media_player.music_playing
+      name: Playing music
+    - entity: media_player.stream_playing
       name: Paused, no play
     - entity: media_player.living_room
       name: Pause, No skip, tvshow
     - entity: media_player.android_cast
       name: Screen casting
-    - entity: media_player.lounge_room
+    - entity: media_player.sonos_idle
       name: Chromcast Idle
     - entity: media_player.theater
       name: Player Off

setup.py

@@ -2,7 +2,7 @@
 
 setup(
     name="home-assistant-frontend",
-    version="20200311.1",
+    version="20200312.0",
     description="The Home Assistant frontend",
     url="https://github.com/home-assistant/home-assistant-polymer",
     author="The Home Assistant Authors",

src/common/entity/domain_icon.ts

@@ -83,9 +83,7 @@ export const domainIcon = (domain: string, state?: string): string => {
       return state && state === "unlocked" ? "hass:lock-open" : "hass:lock";
 
     case "media_player":
-      return state && state !== "off" && state !== "idle"
-        ? "hass:cast-connected"
-        : "hass:cast";
+      return state && state === "playing" ? "hass:cast-connected" : "hass:cast";
 
     case "zwave":
       switch (state) {

src/common/style/icon_color_css.ts

@@ -11,6 +11,7 @@ export const iconColorCSS = css`
   ha-icon[data-domain="light"][data-state="on"],
   ha-icon[data-domain="input_boolean"][data-state="on"],
   ha-icon[data-domain="lock"][data-state="unlocked"],
+  ha-icon[data-domain="media_player"][data-state="on"],
   ha-icon[data-domain="media_player"][data-state="paused"],
   ha-icon[data-domain="media_player"][data-state="playing"],
   ha-icon[data-domain="script"][data-state="running"],

src/components/data-table/ha-data-table.ts

@@ -534,6 +534,10 @@ export class HaDataTable extends LitElement {
         flex-shrink: 0;
       }
 
+      .mdc-data-table__cell.mdc-data-table__cell--icon {
+        overflow: initial;
+      }
+
       .mdc-data-table__header-cell--checkbox,
       .mdc-data-table__cell--checkbox {
         /* @noflip */

src/components/map/ha-map.ts

@@ -90,6 +90,27 @@ class HaMap extends LitElement {
     }
   }
 
+  protected shouldUpdate(changedProps) {
+    if (!changedProps.has("hass") || changedProps.size > 1) {
+      return true;
+    }
+
+    const oldHass = changedProps.get("hass") as HomeAssistant | undefined;
+
+    if (!oldHass || !this.entities) {
+      return true;
+    }
+
+    // Check if any state has changed
+    for (const entity of this.entities) {
+      if (oldHass.states[entity] !== this.hass!.states[entity]) {
+        return true;
+      }
+    }
+
+    return false;
+  }
+
   protected updated(changedProps: PropertyValues): void {
     if (changedProps.has("hass")) {
       this._drawEntities();

src/data/media-player.ts

@@ -14,7 +14,6 @@ export const SUPPORT_SELECT_SOURCE = 2048;
 export const SUPPORT_STOP = 4096;
 export const SUPPORTS_PLAY = 16384;
 export const SUPPORT_SELECT_SOUND_MODE = 65536;
-export const OFF_STATES = ["off", "idle"];
 export const CONTRAST_RATIO = 3.5;
 
 export interface MediaPlayerThumbnail {
@@ -56,9 +55,7 @@ export const computeMediaDescription = (stateObj: HassEntity): string => {
       }
       break;
     default:
-      secondaryTitle = stateObj.attributes.app_name
-        ? stateObj.attributes.app_name
-        : "";
+      secondaryTitle = stateObj.attributes.app_name || "";
   }
 
   return secondaryTitle;

src/dialogs/more-info/controls/more-info-person.ts

@@ -15,12 +15,15 @@ import "../../../components/map/ha-map";
 import { HomeAssistant } from "../../../types";
 import { showZoneEditor } from "../../../data/zone";
 import { fireEvent } from "../../../common/dom/fire_event";
+import memoizeOne from "memoize-one";
 
 @customElement("more-info-person")
 class MoreInfoPerson extends LitElement {
   @property() public hass!: HomeAssistant;
   @property() public stateObj?: HassEntity;
 
+  private _entityArray = memoizeOne((entityId: string) => [entityId]);
+
   protected render(): TemplateResult {
     if (!this.hass || !this.stateObj) {
       return html``;
@@ -35,7 +38,7 @@ class MoreInfoPerson extends LitElement {
         ? html`
             <ha-map
               .hass=${this.hass}
-              .entities=${[this.stateObj.entity_id]}
+              .entities=${this._entityArray(this.stateObj.entity_id)}
             ></ha-map>
           `
         : ""}

src/panels/config/areas/dialog-area-registry-detail.ts

@@ -142,9 +142,6 @@ class DialogAreaDetail extends LitElement {
     return [
       haStyleDialog,
       css`
-        ha-paper-dialog {
-          min-width: 400px;
-        }
         .form {
           padding-bottom: 24px;
         }

src/panels/config/entities/dialog-entity-editor.ts

@@ -250,6 +250,7 @@ export class DialogEntityEditor extends LitElement {
 
         ha-paper-dialog {
           width: 450px;
+          max-height: none !important;
         }
 
         /* overrule the ha-style-dialog max-height on small screens */

src/panels/config/entities/entity-registry-settings.ts

@@ -241,18 +241,11 @@ export class EntityRegistrySettings extends LitElement {
         }
         mwc-button.warning {
           margin-right: auto;
-          --mdc-theme-primary: var(--google-red-500);
-        }
-        .error {
-          color: var(--google-red-500);
         }
         .row {
           margin-top: 8px;
           color: var(--primary-text-color);
         }
-        .secondary {
-          color: var(--secondary-text-color);
-        }
       `,
     ];
   }

src/panels/config/helpers/dialog-helper-detail.ts

@@ -6,6 +6,7 @@ import {
   LitElement,
   property,
   TemplateResult,
+  query,
 } from "lit-element";
 import "../../../components/ha-dialog";
 import { HomeAssistant } from "../../../types";
@@ -44,6 +45,7 @@ export class DialogHelperDetail extends LitElement {
   @property() private _platform?: string;
   @property() private _error?: string;
   @property() private _submitting = false;
+  @query(".form") private _form?: HTMLDivElement;
 
   public async showDialog(): Promise<void> {
     this._platform = undefined;
@@ -108,11 +110,13 @@ export class DialogHelperDetail extends LitElement {
               ${Object.keys(HELPERS).map((platform: string) => {
                 const isLoaded = isComponentLoaded(this.hass, platform);
                 return html`
-                  <div>
+                  <div class="form">
                     <paper-icon-item
                       .disabled=${!isLoaded}
                       @click=${this._platformPicked}
+                      @keydown=${this._handleEnter}
                       .platform=${platform}
+                      dialogInitialFocus
                     >
                       <ha-icon
                         slot="item-icon"
@@ -166,12 +170,29 @@ export class DialogHelperDetail extends LitElement {
     }
   }
 
+  private _handleEnter(ev: KeyboardEvent) {
+    if (ev.keyCode !== 13) {
+      return;
+    }
+    ev.stopPropagation();
+    ev.preventDefault();
+    this._platformPicked(ev);
+  }
+
   private _platformPicked(ev: Event): void {
     this._platform = (ev.currentTarget! as any).platform;
+    this._focusForm();
+  }
+
+  private async _focusForm(): Promise<void> {
+    await this.updateComplete;
+    (this._form?.lastElementChild as HTMLElement).focus();
   }
 
   private _goBack() {
     this._platform = undefined;
+    this._item = undefined;
+    this._error = undefined;
   }
 
   static get styles(): CSSResult[] {