Add support for Cast.

README.md

@@ -17,8 +17,6 @@ For more usage examples, see the [cookbook](https://github.com/thomasloven/hass-
 
 # Installation instructions
 
-**NOTE: This integration requires Home Assistant version 0.95 or later**
-
 - Copy the contents of `custom_components/browser_mod/` to `<your config dir>/custom_components/browser_mod/`.
 
 - Add the following to your `configuration.yaml`:
@@ -29,6 +27,17 @@ browser_mod:
 
 - Restart Home Assistant
 
+> Note: If you want to use browser_mod with Home Assistant Cast, you need to also add:
+>
+> ```yaml
+> resources:
+>   - url: /browser_mod.js
+>     type: module
+> ```
+> to your `ui_lovelace.yaml`.
+> Don't worry about where to put browser_mod.js, the integration will handle that automatically, and please note that it's **not** `/local/browser_mod.js`.
+
+
 # Usage
 
 ## Devices

js/browser-player.js

@@ -21,7 +21,7 @@ class BrowserPlayer extends LitElement {
     window.browser_mod.set_volume({volume_level: vol});
   }
   handleMoreInfo(ev) {
-    moreInfo(window.browser_mod.entity_id);
+    moreInfo("media_player."+window.browser_mod.entity_id);
   }
   handlePlayPause(ev) {
     if (window.browser_mod.player.paused)
@@ -104,4 +104,5 @@ class BrowserPlayer extends LitElement {
 
 }
 
-customElements.define("browser-player", BrowserPlayer);
+if(!customElements.get("browser-player"))
+  customElements.define("browser-player", BrowserPlayer);

js/main.js

@@ -1,5 +1,5 @@
 import { deviceID } from "card-tools/src/deviceId";
-import { lovelace_view, provideHass, load_lovelace, lovelace } from "card-tools/src/hass";
+import { lovelace_view, provideHass, load_lovelace, lovelace, hass } from "card-tools/src/hass";
 import { popUp, closePopUp } from "card-tools/src/popup";
 import { fireEvent } from "card-tools/src/event";
 import { moreInfo } from "card-tools/src/more-info.js";
@@ -27,7 +27,10 @@ class BrowserMod {
     hass.callService = newCallService;
 
     this.hassPatched = true;
-    document.querySelector("home-assistant").hassChanged(hass, hass);
+    if(document.querySelector("hc-main"))
+      document.querySelector("hc-main").hassChanged(hass,hass);
+    else
+      document.querySelector("home-assistant").hassChanged(hass, hass);
   }
 
   playOnce(ev) {
@@ -44,9 +47,16 @@ class BrowserMod {
   }
 
   constructor() {
-    window.setTimeout(this._load_lovelace.bind(this), 500);
+    this.entity_id = deviceID.replace("-","_");
-    window.hassConnection.then((conn) => this.connect(conn.conn));
+    this.cast = document.querySelector("hc-main") !== null;
-    document.querySelector("home-assistant").addEventListener("hass-more-info", this.popup_card.bind(this));
+    if(!this.cast) {
+      window.setTimeout(this._load_lovelace.bind(this), 500);
+      window.hassConnection.then((conn) => this.connect(conn.conn));
+      document.querySelector("home-assistant").addEventListener("hass-more-info", this.popup_card.bind(this));
+    } else {
+      this.connect(hass().connection);
+    }
+
     this.player = new Audio();
     this.playedOnce = false;
 
@@ -379,15 +389,14 @@ class BrowserMod {
     if(!this.conn) return;
 
     if(msg) {
-      if(msg.entity_id) {
+      if(msg.name) {
-        this.entity_id = msg.entity_id;
+        this.entity_id = msg.name.toLowerCase();
       }
       if(msg.camera) {
         this.start_camera();
       }
     }
 
-
     this.conn.sendMessage({
       type: 'browser_mod/update',
       deviceID: deviceID,
@@ -423,4 +432,4 @@ class BrowserMod {
 
 }
 
-window.browser_mod = new BrowserMod();
+window.browser_mod = window.browser_mod || new BrowserMod();

package-lock.json

@@ -627,7 +627,7 @@
       "dev": true
     },
     "card-tools": {
-      "version": "github:thomasloven/lovelace-card-tools#8790289006f110d7aefb8cf7ab1bacdad3c620b0",
+      "version": "github:thomasloven/lovelace-card-tools#fa1edfd127bb86bf1f224dc7982cb7ad53269d35",
       "from": "github:thomasloven/lovelace-card-tools"
     },
     "chalk": {