Button that toggles entity state between two values

Configuration Frontend
1

Hi, I’m trying to add a button to toggle between 80 and 100 for a target state of charge entity.

I have the following YAML but I don’t seem to be able to conditionally set the value. I’d really appreciate some help on where to go from here as I’m getting stuck.

type: custom:bubble-card
card_type: button
entity: number.lsjwh4099nn138458_target_soc
name: Long Journey Mode
icon: mdi:car-clock
show_state: false
show_attribute: false
force_icon: false
button_action:
  tap_action:
    action: call-service
    service: number.set_value
    service_data:
      entity_id: number.lsjwh4099nn138458_target_soc
      value: >
      {% if states.number.lsjwh4099nn138458_target_soc.state == 100 %}
          80
        {% else %}
          100
        {% endif %}
    target: {}
card_layout: large
styles: |-
  .bubble-button-background {

  background-color: ${state == '100' ? 'red' : 'blue'} !important;

    }

If I change value to 100 the action works.

A secondary issue is changing this value triggers a really slow API call so the background colour is not updated immediately, it would be great if I could initiate some kind of loading state until the entity updates.

Thanks!

2

Templates are not supported in the actions of almost all card types. You can put your templated actions in a script and call the script from the card’s action.

1 Like