Lovelace: Button card

This should be tap_action:. :wink:

I almost thought there was a new feature and hurried to the Github page (really)!

1 Like

when i set it to tap action the button does nothing i.e stays off. remove the tap action and works normal albeit without the script

Is there a way to have the scripts have names that are more meaningful? I have the same as above and days later I don’t remember what the script was.

i had a play around with the tap actions and if i set it to double tap the script works but the device group devices (group.kitchen_cinema) do not turn on. you can with the same button do a single tap and they all turn on but the script does not work.

its like the tap action is only being used for the group.kitchen_cinema entity and not the script.

It makes sense then that when i set it to tap action nothing happens (i.e the group does not turn on and the script does not work.

If I understand you correctly, are you expecting the button to display a state change (e.g. that something is now on)? Do you know whether the script executed?

I stand corrected, but I don’t think a script has a state. You can explicitly define another entity to use for the state or you could use custom templating (there are some examples in the docs). It’s hard to say without knowing more of your setup.

thanks Peiter. no not expecting a state to change with the script. but expecting both the device in group.kitchen_cinema and the script to run when I tap the button.

When i remove the tap_action command the above works great. I.e all devices turn on and the color goes green. tap it again and the devices turn off and the button goes red. though the script does not work

if i add the tap_action (not double tap) it makes the button inactive.

If i understand correctly with-out adding the tap action to this button it defaults to tap action

Could you share your script with us?

Defining the tap action will override the group toggle, so unless you toggle that group in your script I don’t think it will do what you’d like it to.

1592552313813':
  alias: kitchen roku hdmi 1
  sequence:
  - delay: 00:00:05
  - data:
      source: hdmi1
    entity_id: media_player.kitchen_main
    service: media_player.select_source
  - data:
      source: 12
    entity_id: media_player.roku_yl004u220937
    service: media_player.select_source

i just added toggle to the script and it appears to work. will play around with it . thanks so much … learning every day

1 Like

(You beat me to it, but will post this anyway and you can confirm whether this is what you’ve done.)

1592552313813':
  alias: kitchen roku hdmi 1
  sequence:
    - service: homeassistant.toggle
      entity_id: group.kitchen_cinema
    - delay: 00:00:05
    - data:
        source: hdmi1
      entity_id: media_player.kitchen_main
      service: media_player.select_source
    - data:
        source: 12
      entity_id: media_player.roku_yl004u220937
      service: media_player.select_source

I suspect you’d need extra logic (conditions) for the HDMI and player source selectors, as you probably only want that to execute when turning on.

1 Like

spot on ill need to add some conditions i.e only run script when going from off to on state . i presume you can add it to the script

Indeed, you can.

Apologies that this is slightly off topic. This question fits in and could have been asked in one of several other threads but I chose this one. (Contributors here should see that as a compliment. Flattery will get you anywhere :wink: )

I use lovelace_gen to enable me to create button templates and this has thrown up a Javascript question:

Is it possible to convert a last_updated time which is in the (UTC) format 2020-06-21 15:49:37.906135+00:00, to a local time using one line of Javascript?

The reason is that I want to do this:

- !include
  - templates/button_title.yaml
  - title: >
      [[[ return 'TRAINS TIMES (AT ' + states['sensor.next_train'].last_updated.substring(11, 19) + ')' ]]]

Which works but returns UTC (obviously). I know ways to use Javascript to do this but only using more than one line.

An alterrnative would be to know how (if it is possible) to pass the title as a multiline string but I think that really is outside the scope of this thread (unless anyone knows :wink: ).

What’s the problem behind using multiple lines of javascript?

I want to pass it to an !include but when I tried passing more than one line it didn’t seem to like it.
Should it work?

If so, I’ll try again.

I don’t know what lovelace_gen introduces but your title is already a multi-line yaml (even if it’s only one line)

Yes but if I make this simple chnage:

- !include
  - templates/button_title.yaml
  - title: >
      [[[
        return 'TRAINS TIMES (AT ' + states['sensor.next_train'].last_updated.substring(11, 19) + ')'
      ]]]

Lovelace doesn’t like it.
But I’ll take it to the lovelace_gen thread.

Interesting, that’s probably a lovelace_gen issue. Did you try with | instead of >?

Yes I did, FWIW the Lovelace error is:

while parsing a block mapping in "/config/lovelace/templates/button_title.yaml", line 18, column 1 expected <block end>, but found ']' in "/config/lovelace/templates/button_title.yaml", line 23, column 1

sorry for my memory leaving me for a second here, but have we already talked about a template in the variable declaration as follows:

I need to set the variable for an on/off-icon and would like to be able to do something like:

button_card_templates:
  button_force_switch_on:
    variables:
      on_icon: >
        [[[
        var id = entity.entity_id.split('_on')[0].split('.')[1];
        return states['sensor.' + id + '_state'].state == 'on';
        ]]]
      off_icon: >
        [[[
        var id = entity.entity_id.split('_on')[0].split('.')[1];
        return states['sensor.' + id + '_state'].state == 'off';
        ]]]

so I can call the button-card:

      - type: custom:button-card
        template: button_force_switch_on
        entity: script.audio_gym_on
        triggers_update: sensor.audio_gym_state
        variables:
          on_icon: mdi:music
          off_icon: mdi:music-off

instead of having to repeat the template in each button-card using the id: parameter:

      - type: custom:button-card
        template: button_force_switch_on
        entity: script.audio_gym_on
        triggers_update: sensor.audio_gym_state
        state:
          - operator: template
            value: >
              [[[
              return states['sensor.audio_gym_state'].state == 'on';
              ]]]
            id: on-icon
            icon: mdi:music
          - operator: default
            id: off-icon
            icon: mdi:music-off

I have already set in the template:

button_force_switch_on:
  template: button_force_body
  show_label: true
  tap_action:
    action: call-service
    service: script.turn_on
    service_data:
      entity_id: entity
    haptic: light
#  variables:
#    on_icon: >
#      [[[
#      var id = entity.entity_id.split('_on')[0].split('.')[1];
#      return states['sensor.' + id + '_state'].state == 'on';
#      ]]]
#    off_icon: >
#      [[[
#      var id = entity.entity_id.split('_on')[0].split('.')[1];
#      return states['sensor.' + id + '_state'].state == 'off';
#      ]]]
  label: >
    [[[
      var id = entity.entity_id.split('_on')[0].split('.')[1];
      return states['sensor.' + id + '_state'].state;
    ]]]
  state:
    - operator: template
      value: >
        [[[
        var id = entity.entity_id.split('_on')[0].split('.')[1];
        return states['sensor.' + id + '_state'].state == 'on';
        ]]]
      styles:
        card:
          - background: '#F0C209'
          - color: '#555B65'
        icon:
          - color: '#555B65'
      id: on-icon
    - operator: default
      styles:
        card:
          - background: '#555B65'
          - color: '#F0C209'
        icon:
          - color: '#F0C209'
      id: off-icon

I have obviously tried it (see the commented bit in the template) but this didnt work.

thanks for having a look…