Merge pull request #555 from prabhjotsbhatia-ca/main

Optional Media Controls for Chromecast style remote
PRProd · Nov 12, 2024 · 4caa17b · 4caa17b
2 parents 7973fa1 + 0d55644
commit 4caa17b
Showing 1 changed file with 42 additions and 0 deletions.
diff --git a/dist/HA-Firemote.js b/dist/HA-Firemote.js
@@ -3716,6 +3716,23 @@ class FiremoteCard extends LitElement {
       }
     }
 
+    //Draw Optional MediaControl buttons on CC
+    function drawMediaControlButtons(e, config) {
+      if (config.show_media_controls==true) {
+        return html`
+          <button class="remote-button" id="rewind-button" @pointerdown=${e.buttonDown}>
+            <ha-icon icon="mdi:rewind"></ha-icon>
+          </button>
+          <button class="remote-button${playingStatusClass}" id="playpause-button" @pointerdown=${e.buttonDown}>
+            <ha-icon icon="mdi:play-pause"></ha-icon>
+          </button>
+          <button class="remote-button" id="fastforward-button" @pointerdown=${e.buttonDown}>
+            <ha-icon icon="mdi:fast-forward"></ha-icon>
+          </button>
+          `;
+        }
+        return;
+    }
 
     // Reused SVG Logos
     function renderfiretvlogo() {
@@ -5316,6 +5333,9 @@ class FiremoteCard extends LitElement {
             <ha-icon icon="mdi:volume-mute"></ha-icon>
           </button>
 
+          ${drawMediaControlButtons(this, this._config)}
+
+
           ${drawAppLaunchButtons(this, this._config, 2, appButtonMax[getDeviceAttribute('defaultRemoteStyle')])}
 
           <div class="chromecastBottomIndentedRow">
@@ -7934,6 +7954,9 @@ class FiremoteCardEditor extends LitElement {
         case 'useCustomSkinCheckbox':
           this._config.useCustomSkin = ev.target.checked;
           break;
+        case "showMediaControlsCheckbox":
+          this._config.show_media_controls = ev.target.checked;
+          break;
       }
     }
 
@@ -8348,6 +8371,23 @@ class FiremoteCardEditor extends LitElement {
       `;
     }
   }
+  getChromecastMediaControls(remoteStyle) {
+    if (['CC1', 'CC2', 'CC3'].includes(remoteStyle)) {
+        return html`
+          <br />
+          <label for="showMediaControlsCheckbox">
+            <input
+              type="checkbox"
+              id="showMediaControlsCheckbox"
+              name="show_media_controls"
+              ?checked=${this._config.show_media_controls === true}
+              @change=${this.configChanged}
+            />&nbsp; ${this.translateToUsrLang("Show Media Controls")}
+          </label>
+          <br />
+        `;
+    }
+  }
 
   render() {
     if (!this.hass || !this._config) {
@@ -8457,6 +8497,8 @@ class FiremoteCardEditor extends LitElement {
         </select>
         <br>
         <br>
+        ${this.getChromecastMediaControls(getDeviceAttribute("defaultRemoteStyle"))}
+
         ${this.getCompatibilityModeDropdown(this._config.compatibility_mode, getDeviceAttribute('friendlyName'))}
 
         ${this.getAppChoiceOptionMenus(getDeviceAttribute("defaultRemoteStyle"))}