Show remaining time of a timer in minutes and seconds as a badge in the frontend
FWIW, I show the remaining time by embedding a custom:button-card inside another custom:button-card like this:
- type: 'custom:button-card'
entity: switch.office_bath_light
name: 'Bath Light'
variables:
timer_var: "timer.office_bath_light"
template:
- base_card
- timer_template
button_card_templates:
base_card:
state_color: true
show_label: true
tap_action:
action: toggle
styles:
card:
- border-radius: 6px
- height: 70px
- margin: 3px
- padding: 8px
grid:
- grid-template-areas: '"i timer" "n n"'
- grid-template-rows: 40px 1fr
- grid-template-columns: 40px 1fr
img_cell:
- align-self: start
- text-align: start
- justify-self: start
- place-self: start
- margin-right: 20px
icon:
- align-self: start
- justify-self: start
- height: 30px
- width: 30px
name:
- justify-self: center
- font-size: 13px
- margin: 0
label:
- align-self: end
- justify-self: end
- font-size: 12px
custom_fields:
timer:
- justify-self: end
- align-self: start
- font-size: 13px
timer_template:
variables:
timer_var: "placeholder"
triggers_update: all
custom_fields:
timer:
card:
type: custom:button-card
entity: '[[[ return variables.timer_var ]]]'
show_name: false
show_icon: false
show_state: true
styles:
card:
- font-size: 12px
- box-shadow: none
- background-color: "transparent"
- border: none
state:
- color: 'red'
- opacity: >
[[[
return states[variables.timer_var].state === 'idle' ? '0' : '1';
]]]
Hi @vonagio @123 @petro
I`ve made this sensor to show the remaining time based of the choosen program. If the dishwasher is powered on the sensor will display the time remaining of the program if the dishwasher is powered off the sensor will display " : -:-- "
Here is the sensor:
- platform: template
sensors:
remaining_time:
friendly_name: "Remaining Time"
value_template: >
{% if states('sensor.402110526515021364_bsh_common_option_remainingprogramtime') == 'unavailable' %} -:--
{% elif (as_timestamp(states('sensor.402110526515021364_bsh_common_option_remainingprogramtime'))) >0 %}
{% set sec = as_timestamp(states('sensor.402110526515021364_bsh_common_option_remainingprogramtime'))-as_timestamp(now()) %}
{%set hr = (sec / 3600) | int %}
{%set min = sec / 60 - hr * 60%}
{% if hr > 0 and is_state('switch.402110526515021364_bsh_common_setting_powerstate', 'on' ) %}
{{"%d:%02d" % (hr, min + 1)}}
{% elif sec | round(1, default=0) <0 %}
-:--
{%elif is_state('switch.402110526515021364_bsh_common_setting_powerstate', 'on' )%}
{{"%d:%02d" % (hr, min + 1)}}
{%else%}
-:--
{% endif %}
{% endif %}
Hope this will work also for you
Also see this
Thanks, but that still won’t update once a second. Not only that, but the code can be optimized as well.
template:
- trigger:
- platform: time_pattern
seconds: "/1"
sensor:
- name: Remaining Time
state: >
{% set entity_id = 'sensor.402110526515021364_bsh_common_option_remainingprogramtime' %}
{% if entity_id | has_value and is_state('switch.402110526515021364_bsh_common_setting_powerstate', 'on') %}
{% set td = states(entity_id) | as_datetime | as_local - now() %}
{{ "%d:%02d" % (td.seconds // 3600, td.seconds // 60 % 60) }}
{% else %}
-:--
{% endif %}
If you don’t care about the second updates…
template:
- sensor:
- name: Remaining Time
state: >
{% set entity_id = 'sensor.402110526515021364_bsh_common_option_remainingprogramtime' %}
{% if entity_id | has_value and is_state('switch.402110526515021364_bsh_common_setting_powerstate', 'on') %}
{% set td = states(entity_id) | as_datetime | as_local - now() %}
{{ "%d:%02d" % (td.seconds // 3600, td.seconds // 60 % 60) }}
{% else %}
-:--
{% endif %}
Hi Richard
I like the idea, but I can’t figure out where to define the timer_template and button_card_templates in order to use them.
Can you please elaborate on that.
BR Poul Anker
really appreciate your answer.
Thank You for posting your code. It helped me to implement my countdown sensor.
There is a typo in this line. Should be
{{ "%d:%02d" % (td.seconds // 3600, td.seconds // 60 % 60) }}
1 Like
Thanks, missed that.
I tried using your code, but i doesn’t work.
The sensor just never updates for me.
If i go and have a look in the logs i see an error that the update for my sensor failed
This is the code for my sensor:
- trigger:
- trigger: time
at: '00:00'
- trigger: homeassistant
event: start
sensor:
- name: "Washer Countdown"
state: >-
{% set f = state_attr('timer.test_timer', 'finishes_at') %}
{{ 'Idle' if f == None else (as_datetime(f) - now()).total_seconds() | timestamp_custom('%H:%M:%S', false) }}
This is the code for my automation:
alias: "Washer - Update Countdown timer "
description: Update sensor.washer_countdown when timer is active
triggers:
- trigger: time_pattern
seconds: "*"
conditions:
- condition: state
entity_id: timer.test_timer
state: active
actions:
- action: homeassistant.update_entity
data:
entity_id:
- sensor.washer_countdown
mode: single
if i copy the code for the sensor in the Template area of the developer tools it does work.
Any idea what i’m doing wrong?
Main goal is to get this to work in a button in paper-buttons-row
change
seconds: /1
The trigger works as expected with that code.
When i look at the trace of the automation it looks like it worked, but the update entity action seems to fail somehow
even when i just run the Action in the developer tools it doesn’t update the entity
I don’t understand what you are trying to do, I can see the countdown of a sensor in a card markdown like this:
{% set default = "2024-04-12T00:00:00.000000Z" %}
{% set defaultresult = (( default | as_datetime - now()).total_seconds() // 60 ) %}
<font size="2">started from {{ ((((state_attr('sensor.my_sensor', 'date_start_tz') |replace ('n.d.',default) | as_datetime - now()).total_seconds() // 60 )|replace(defaultresult,'')|replace('-','')| float(0) / 1)-1 ) |replace('.0','') }} min.</font>
<font size="2">start in {{ ((((state_attr('sensor.my_sensor', 'nextdate_start_tz') |replace ('n.d.',default) | as_datetime - now()).total_seconds() // 60 )|replace(defaultresult,'')| float(0) / 1)+1 ) |replace('.0','')}} min.</font>
or
{% set f = state_attr('timer.test_timer', 'finishes_at') %}
{% if f == None %}
Idle
{% else %}
{% set time_left = (as_datetime(f) - now()).total_seconds() %}
{% set hours = (time_left // 3600) %}
{% set minutes = ((time_left % 3600) // 60) %}
{% set seconds = (time_left % 60) %}
{{ '%02d:%02d:%02d' | format(hours, minutes, seconds) }}
{% endif %}
Main goal is to show the time left of a timer entity in a button on a paper-button-rows card
in those buttons if you show the state of the timer entity it just says Idle or Active, you don’t get the countdown.
So i found the code i used in this thread. It’s just not working for me. The action just doesn’t update the sensor as you would expect
try
{{ 'Idle' if f == None else ((as_datetime(f) - now()).total_seconds() | round(0)) | timestamp_custom('%H:%M:%S', false) }}
I just did the following test and then the sensor did update:
start timer
restart home assistant
after that the sensor showed the time, which makes sense since one of the triggers for the sensor is to refresh on a restart of home assistant.
So the problem really just is this part of the automation
actions:
- action: homeassistant.update_entity
data:
entity_id:
- sensor.washer_countdown
it does not update the sensor as you would expect, it doesn’t do anything
I’m sorry I don’t understand what you are doing, you are trying to reload the data of a sensor called “washer_countdown” which I have no idea what it is.
When i change the trigger for the sensor to a time pattern that updates every second it just works.
Is this solution any worse than having an automation trigger every second that stops at the first condition.
the washer_countdown sensor either is Idle when the timer isn’t running, otherwise it’s supposed to show the time remaining of the active timer.
This is a supposed workaround in case you try to show the time of an active timer in a card type that doesn’t show the remaining time when you use the state of the timer.
My goal is to show the remaining time of a timer entity in a paper-buttons-row card.
The problem is that when you show the state of a timer entity in that card it only shows Idle or Active, not the remaining time
sorry, I didn’t read about “paper-buttons-row card”
I don’t know about it, maybe you could add a piece of markdown in the vertical stack card?