This card shows an hours input card while charger is off and a countdown when charger is running for the hours selected.
There's another version that adds a simple scheduling feature in top of this here.
Cards needed:
- Mushroom cards (mushroom-number-card)
- Timer Bar Card
Other things needed:
- Input number:
input_number.ev_charge_timer_input
- Timer helper:
timer.ev_charge_timer
IMPORTANT: when creating the helpers, check the restore
option or you'll be in trouble when restarting HA while this is working!
You need to create some automations to make this card work as expected. As my integrations have entity_ids and can't be used as is in other HAs, let's just explain them a little bit:
When the input number is changed, the timer can be started using a template like this:
service: timer.start
data_template:
duration: "{{ states.input_number.ev_charge_timer_input.state | int }}:00:00"
entity_id: timer.ev_charge_timer
A simple automation that turns on/off the swtich when timer events are fired, like this:
- When
timer.started
--> switch on - When
timer.finished
--> switch off
Or you can just toggle the switch on any of those events.
The cards allows to turn off the switch when you tap on it while running, but it doesn't finishes the timer o resets the input number. To make this work, add another automation that is fired when the switch if turned off and makes two things:
- Sets the input number helper to zero
- Finishes the timer helper
- type: conditional
conditions:
- entity: timer.ev_charge_timer
state: idle
card:
type: custom:mushroom-number-card
entity: input_number.ev_charge_timer_input
name: Horas Carga
fill_container: true
display_mode: buttons
layout: horizontal
secondary_info: none
icon_color: grey
- type: conditional
conditions:
- entity: timer.ev_charge_timer
state_not: idle
card:
type: custom:timer-bar-card
entity: timer.ev_charge_timer
name: Coche Cargando...
icon: mdi:ev-station
mushroom:
color: green
tap_action:
action: call-service
service: timer.finish
data:
entity_id: timer.ev_charge_timer
card_mod:
style: |
ha-card {
background-color:#bce1b9
}
@media (prefers-color-scheme: dark) {
ha-card {
background-color:#344635
}
}