Iāve finally started investing some limited time in converting my dashboards over to these cards. Iām making some good progress so thought Iād share.
This card allows me to control the Harmony Hub activities. There is some automations in the background that manage the sleep timers but thatās out of scope for this thread. The sleep timers section is only shown if there is an active activity. The sleep timer countdown is only visible if the sleep timer is active.
By default the Harmony integration does not enable switches for the activities and I wanted to keep the integrations as close to default as possible. So, this implementation will take the options from the select entity and create the card.
I use decluttering-card to generalise it so that it is reusable but hopefully this might give some ideas.
The YAML (not using decluttering-card) is as follows.
Other cards required (besides mushroom): -
type: vertical-stack
cards:
- type: custom:mushroom-title-card
title: '{{ area_name(''select.lounge_activities'') }} - Media Activities'
- type: entities
entities:
- type: custom:auto-entities
card:
type: custom:layout-card
layout_type: custom:grid-layout
layout:
grid-auto-columns: 1fr
grid-auto-flow: column
margin: 0
padding: 0
card_margin: 0
card_param: cards
filter:
template: >
{% set ns = namespace(activities=[]) %} {% for opt in
state_attr('select.lounge_activities', 'options') if opt |
lower != 'poweroff' %}
{% set icon = iif(opt | lower == 'watch films', 'mdi:filmstrip', '') %}
{% set icon = iif(opt | lower == 'watch tv', 'mdi:television', icon) %}
{% set icon = iif(opt | lower == 'watch roku', 'mdi:play-box-multiple-outline', icon) %}
{% set icon = iif(opt | lower == 'watch tv app', 'mdi:television-guide', icon) %}
{% set icon = iif((opt | lower).startswith('listen to music'), 'mdi:music-box-outline', icon) %}
{% set icon = iif(opt | lower == 'listen to music - upstairs', 'mdi:music-box-multiple-outline', icon) %}
{% set icon = iif(icon == '', 'mdi:help', icon) %}
{% set action_option = iif(is_state('select.lounge_activities', opt), 'PowerOff', opt) %}
{% set ns.activities = ns.activities + [{
'type': 'custom:mushroom-template-card',
'card_mod': {
'style': {
'.': 'ha-card { --ha-card-box-shadow: none; --card-primary-font-weight: normal; } mushroom-card { height: 100%; }',
'mushroom-state-info': {
'$': '.primary { white-space: unset !Important; }'
}
}
},
'badge_color': 'var(--rgb-green)',
'badge_icon': '{{ iif(is_state(entity, "' ~ opt ~ '"), "mdi:check") }}',
'entity': 'select.lounge_activities',
'fill_container': true,
'icon': icon,
'icon_color': '{{ iif(is_state(entity, "' ~ opt ~ '"), "blue") }}',
'layout': 'vertical',
'primary': opt,
'tap_action': {
'action': 'call-service',
'service': 'select.select_option',
'data': {
'entity_id': 'select.lounge_activities',
'option': action_option
}
}
}] %}
{% endfor %} {{ ns.activities }}
- type: conditional
conditions:
- entity: select.lounge_activities
state_not: PowerOff
row:
type: section
label: Sleep timer
- type: custom:layout-card
layout_type: custom:grid-layout
layout:
grid-template-columns: 1fr 25%
margin: 0
padding: 0
card_margin: 0
cards:
- type: conditional
conditions:
- entity: select.lounge_activities
state_not: PowerOff
card:
type: custom:mushroom-chips-card
card_mod:
style:
.: >
ha-card { background-color:
var(--card-background-color) !important; }
mushroom-template-chip:
$:
mushroom-chip:
$: |
ha-card { } ha-card .content { width: 100%; }
chips:
- type: template
content: 'Off'
tap_action:
action: call-service
service: input_select.select_option
data:
entity_id: input_select.sleep_timer_duration_lounge
option: 'Off'
card_mod:
style: >
{% if
is_state('timer.sleep_timer_remaining_lounge',
'idle') %}
ha-card { background-color: rgba(var(--rgb-blue), 0.2) !important; }
{% else %}
ha-card { background-color: rgba(var(--rgb-grey), 0.2) !important; }
{% endif %}
- type: template
content: '30'
tap_action:
action: call-service
service: input_select.select_option
data:
entity_id: input_select.sleep_timer_duration_lounge
option: '30'
card_mod:
style: >
{% set entity =
'timer.sleep_timer_remaining_lounge' %} {% if not
is_state(entity, 'idle') %}
{% set ns = namespace(mins=0, duration=30) %}
{% set duration = state_attr(entity, 'duration') %}
{% set mins = 0 %}
{% for tp in duration.split(":") %}
{% if loop.index == 1 %}
{% set ns.mins = ns.mins + tp | int(0) * 60 %}
{% elif loop.index == 2 %}
{% set ns.mins = ns.mins + tp | int(0) %}
{% elif loop.index == 3 %}
{% set ns.mins = int(ns.mins + tp | int(0) / 60, 0) %}
{% endif %}
{% endfor %}
{% if ns.mins == ns.duration %}
ha-card { background-color: rgba(var(--rgb-blue), 0.2) !important; }
{% else %}
ha-card { background-color: rgba(var(--rgb-grey), 0.2) !important; }
{% endif %}
{% else %}
ha-card { background-color: rgba(var(--rgb-grey), 0.2) !important; }
{% endif %}
- type: template
content: '60'
tap_action:
action: call-service
service: input_select.select_option
data:
entity_id: input_select.sleep_timer_duration_lounge
option: '60'
card_mod:
style: >
{% set entity =
'timer.sleep_timer_remaining_lounge' %} {% if not
is_state(entity, 'idle') %}
{% set ns = namespace(mins=0, duration=60) %}
{% set duration = state_attr(entity, 'duration') %}
{% set mins = 0 %}
{% for tp in duration.split(":") %}
{% if loop.index == 1 %}
{% set ns.mins = ns.mins + tp | int(0) * 60 %}
{% elif loop.index == 2 %}
{% set ns.mins = ns.mins + tp | int(0) %}
{% elif loop.index == 3 %}
{% set ns.mins = int(ns.mins + tp | int(0) / 60, 0) %}
{% endif %}
{% endfor %}
{% if ns.mins == ns.duration %}
ha-card { background-color: rgba(var(--rgb-blue), 0.2) !important; }
{% else %}
ha-card { background-color: rgba(var(--rgb-grey), 0.2) !important; }
{% endif %}
{% else %}
ha-card { background-color: rgba(var(--rgb-grey), 0.2) !important; }
{% endif %}
- type: conditional
conditions:
- entity: timer.sleep_timer_remaining_lounge
state_not: idle
card:
type: entities
card_mod:
style:
.: |
ha-card { --ha-card-box-shadow: none; }
#states { padding: 0px; }
hui-timer-entity-row$:
hui-generic-entity-row$: |
state-badge { visibility: hidden; }
state-badge + div { visibility: hidden; }
entities:
- entity: timer.sleep_timer_remaining_lounge
Iām a contractor and from day to day I can be anywhere].
