jeans/frontend
jeans/frontend
1
0
Fork 0
mirror of https://github.com/home-assistant/frontend.git synced 2025-08-02 05:57:54 +00:00
Code Issues Packages Projects Releases Wiki Activity

Update Media Card to check for supported features

Browse Source
This commit is contained in:
Zack Arnett 2020-02-11 13:11:25 -05:00
parent 1437b4c4b6
commit d33e035db7
2 changed files with 66 additions and 27 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
src/data/media-player.ts
View File

@ -3,8 +3,17 @@ import { HomeAssistant } from "../types";
import { timeCachePromiseFunc } from "../common/util/time-cache-function-promise"; import { timeCachePromiseFunc } from "../common/util/time-cache-function-promise";
export const SUPPORT_PAUSE = 1; export const SUPPORT_PAUSE = 1;
export const SUPPORT_VOLUME_SET = 4;
export const SUPPORT_VOLUME_MUTE = 8;
export const SUPPORT_PREVIOUS_TRACK = 16;
export const SUPPORT_NEXT_TRACK = 32; export const SUPPORT_NEXT_TRACK = 32;
export const SUPPORT_TURN_ON = 128;
export const SUPPORT_TURN_OFF = 256;
export const SUPPORT_PLAY_MEDIA = 512;
export const SUPPORT_VOLUME_BUTTONS = 1024;
export const SUPPORT_SELECT_SOURCE = 2048;
export const SUPPORTS_PLAY = 16384; export const SUPPORTS_PLAY = 16384;
export const SUPPORT_SELECT_SOUND_MODE = 65536;
export const OFF_STATES = ["off", "idle"]; export const OFF_STATES = ["off", "idle"];
export interface MediaPlayerThumbnail { export interface MediaPlayerThumbnail {

84
src/panels/lovelace/cards/hui-media-control-card.ts
View File

@ -16,7 +16,15 @@ import "../../../components/ha-card";
import { applyThemesOnElement } from "../../../common/dom/apply_themes_on_element"; import { applyThemesOnElement } from "../../../common/dom/apply_themes_on_element";
import { computeStateName } from "../../../common/entity/compute_state_name"; import { computeStateName } from "../../../common/entity/compute_state_name";
import { supportsFeature } from "../../../common/entity/supports-feature"; import { supportsFeature } from "../../../common/entity/supports-feature";
import { OFF_STATES, SUPPORT_PAUSE } from "../../../data/media-player"; import {
OFF_STATES,
SUPPORT_PAUSE,
SUPPORT_TURN_ON,
SUPPORT_TURN_OFF,
SUPPORT_PREVIOUS_TRACK,
SUPPORT_NEXT_TRACK,
SUPPORTS_PLAY,
} from "../../../data/media-player";
import { hasConfigOrEntityChanged } from "../common/has-changed"; import { hasConfigOrEntityChanged } from "../common/has-changed";
import { HomeAssistant, MediaEntity } from "../../../types"; import { HomeAssistant, MediaEntity } from "../../../types";
import { LovelaceCard, LovelaceCardEditor } from "../types"; import { LovelaceCard, LovelaceCardEditor } from "../types";
@ -89,7 +97,9 @@ export class HuiMediaControlCard extends LitElement implements LovelaceCard {
</div> </div>
</div> </div>
</div> </div>
${OFF_STATES.includes(stateObj.state) ${OFF_STATES.includes(stateObj.state) ||
!stateObj.attributes.media_duration ||
!stateObj.attributes.media_position
? "" ? ""
: html` : html`
<paper-progress <paper-progress
@ -99,32 +109,52 @@ export class HuiMediaControlCard extends LitElement implements LovelaceCard {
></paper-progress> ></paper-progress>
`} `}
<div class="controls"> <div class="controls">
<paper-icon-button ${(stateObj.state === "off" &&
icon="hass:power" !supportsFeature(stateObj, SUPPORT_TURN_ON)) ||
.action=${stateObj.state === "off" ? "turn_on" : "turn_off"} (stateObj.state === "on" &&
@click=${this._handleClick} !supportsFeature(stateObj, SUPPORT_TURN_OFF))
></paper-icon-button> ? ""
: html`
<paper-icon-button
icon="hass:power"
.action=${stateObj.state === "off" ? "turn_on" : "turn_off"}
@click=${this._handleClick}
></paper-icon-button>
`}
<div class="playback-controls"> <div class="playback-controls">
<paper-icon-button ${!supportsFeature(stateObj, SUPPORT_PREVIOUS_TRACK)
icon="hass:skip-previous" ? ""
.action=${"media_previous_track"} : html`
@click=${this._handleClick} <paper-icon-button
></paper-icon-button> icon="hass:skip-previous"
<paper-icon-button .action=${"media_previous_track"}
class="playPauseButton" @click=${this._handleClick}
icon=${stateObj.state !== "playing" ></paper-icon-button>
? "hass:play" `}
: supportsFeature(stateObj, SUPPORT_PAUSE) ${stateObj.state !== "playing" &&
? "hass:pause" !supportsFeature(stateObj, SUPPORTS_PLAY)
: "hass:stop"} ? ""
.action=${"media_play_pause"} : html`
@click=${this._handleClick} <paper-icon-button
></paper-icon-button> class="playPauseButton"
<paper-icon-button icon=${stateObj.state !== "playing"
icon="hass:skip-next" ? "hass:play"
.action=${"media_next_track"} : supportsFeature(stateObj, SUPPORT_PAUSE)
@click=${this._handleClick} ? "hass:pause"
></paper-icon-button> : "hass:stop"}
.action=${"media_play_pause"}
@click=${this._handleClick}
></paper-icon-button>
`}
${!supportsFeature(stateObj, SUPPORT_NEXT_TRACK)
? ""
: html`
<paper-icon-button
icon="hass:skip-next"
.action=${"media_next_track"}
@click=${this._handleClick}
></paper-icon-button>
`}
</div> </div>
<paper-icon-button <paper-icon-button
icon="hass:dots-vertical" icon="hass:dots-vertical"