From 1ab1cf0fab48e5f63e19d2d49c2593567acb467e Mon Sep 17 00:00:00 2001
From: Paul Bottein <paul.bottein@gmail.com>
Date: Mon, 20 Feb 2023 14:32:13 +0100
Subject: [PATCH] Add support for buffering state in media browser (#15459)

---
 src/data/media-player.ts                      |  4 +++-
 .../media-browser/browser-media-player.ts     | 22 +++++++++----------
 .../media-browser/ha-bar-media-player.ts      |  2 +-
 3 files changed, 15 insertions(+), 13 deletions(-)

diff --git a/src/data/media-player.ts b/src/data/media-player.ts
index 657b2bbf41..c666c0ec52 100644
--- a/src/data/media-player.ts
+++ b/src/data/media-player.ts
@@ -73,7 +73,9 @@ export interface MediaPlayerEntity extends HassEntityBase {
     | "off"
     | "on"
     | "unavailable"
-    | "unknown";
+    | "unknown"
+    | "standby"
+    | "buffering";
 }
 
 export const enum MediaPlayerEntityFeature {
diff --git a/src/panels/media-browser/browser-media-player.ts b/src/panels/media-browser/browser-media-player.ts
index 53aa891a7b..d8c082f1ac 100644
--- a/src/panels/media-browser/browser-media-player.ts
+++ b/src/panels/media-browser/browser-media-player.ts
@@ -70,10 +70,6 @@ export class BrowserMediaPlayer {
     }
   }
 
-  public get isPlaying(): boolean {
-    return this.buffering || (!this.player.paused && !this.player.ended);
-  }
-
   static idleStateObj(): MediaPlayerEntity {
     const now = new Date().toISOString();
     return {
@@ -88,9 +84,13 @@ export class BrowserMediaPlayer {
 
   toStateObj(): MediaPlayerEntity {
     // https://developer.mozilla.org/en-US/docs/Web/API/HTMLMediaElement
-    const base = BrowserMediaPlayer.idleStateObj();
-    base.state = this.isPlaying ? "playing" : "paused";
-    base.attributes = {
+    const stateObj = BrowserMediaPlayer.idleStateObj();
+    stateObj.state = this.buffering
+      ? "buffering"
+      : this.player.paused || this.player.ended
+      ? "paused"
+      : "playing";
+    stateObj.attributes = {
       media_title: this.item.title,
       entity_picture: this.item.thumbnail,
       volume_level: this.player.volume,
@@ -103,10 +103,10 @@ export class BrowserMediaPlayer {
     };
 
     if (this.player.duration) {
-      base.attributes.media_duration = this.player.duration;
-      base.attributes.media_position = this.player.currentTime;
-      base.attributes.media_position_updated_at = base.last_updated;
+      stateObj.attributes.media_duration = this.player.duration;
+      stateObj.attributes.media_position = this.player.currentTime;
+      stateObj.attributes.media_position_updated_at = stateObj.last_updated;
     }
-    return base;
+    return stateObj;
   }
 }
diff --git a/src/panels/media-browser/ha-bar-media-player.ts b/src/panels/media-browser/ha-bar-media-player.ts
index 17e2986ab5..c41d57c9a8 100644
--- a/src/panels/media-browser/ha-bar-media-player.ts
+++ b/src/panels/media-browser/ha-bar-media-player.ts
@@ -244,7 +244,7 @@ export class BarMediaPlayer extends SubscribeMixin(LitElement) {
         </div>
       </div>
       <div class="controls-progress">
-        ${this._browserPlayer?.buffering
+        ${stateObj.state === "buffering"
           ? html` <ha-circular-progress active></ha-circular-progress> `
           : html`
               <div class="controls">