Home Assistant Community

Lovelace: Button card

#247

I am trying to add a volume controller to my google home, i have added the below code. When pressing the button i receive the below error

https://xxxxxxxxxxxxxxxxxxxxlocal/custom-lovelace/button-card/button-card.js:229:28 Uncaught TypeError: Cannot read property 'entity_id' of undefined


  - type: "custom:button-card"
    color_type: blank-card
    color_type: card
    color: rgb(223, 255, 97)
    icon: mdi:volume-plus
    action: service
    service: media_player.volume_up
    domain: media_player
    action: volume_up
    data:
         entity_id: media_player.googlehome447
0 Likes

#248

Suddenly my lovelace custom cards stopped working with

Access to script at 'https://unpkg.com/@polymer/[email protected]%5E0.5.2/lit-element.js?module' from origin 'https://xxx.duckdns.org:344444' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. 

Anyone else having issues?

0 Likes

#249

ok well since I didn’t get assistance with his, I went another way, I created scripts for each command and set the buttons to toggle the scripts…
I feel it’s not the percfect way, a little indirect, but it works…

0 Likes

#250

I feel a bit stupid to ask but I just switched to Lovelace and trying the different cards. With below I would expect that -when I click the button- the light actually goes on/off and the icon changes from yellow to white and visa versa. However it just shows the state and tapping has no effect. I’ve tried several variations.

What am I missing?

type: entity-button
tap_action:
  - action: toggle
entity:
  - switch.fibaro_system_fgwpef_wall_plug_gen5_switch
0 Likes

#251

Maybe indentantion is wrong…
Try:

type: entity-button
  tap_action:
    - action: toggle
  entity: switch.fibaro_system_fgwpef_wall_plug_gen5_switch
0 Likes

#252

thanks but that’s not it. Your proposal actually creates indention errors. sorry

0 Likes

#253

This button card is different than the stock button card. They just happen to share the same name. Assuming you’ve already declared the use of this custom button card and downloaded the corresponding .js file, Your yaml code should be something like:

type: custom:button-card
tap_action:
  - action: toggle
entity: switch.fibaro_system_fgwpef_wall_plug_gen5_switch

Also, since you are only using one entity, you don’t really need to declare a list with the dash (i.e.
- switch.fibaro_system_fgwpef_wall_plug_gen5_switch)

0 Likes

#254

Trying to create a button for my alarm_control_panel which has different icons and color depending on the state, but I cant use any icons I want, this for example will only show the correct icon for state “armed_away”

But if I change the icon for state “armed_home” to mdi:clock it works fine.
I also tried to use shield-home and shield-off on another custom button, same issue there.
So I’m guessing some icons dont work, I thought it might been icons with “-” in it’s names, but water-percent works, and also window-closed.

Anyone else noticed this?

type: vertical-stack
cards:
  - type: horizontal-stack
    cards:
      - type: conditional
        conditions:
          - entity: alarm_control_panel.grave_alarm
            state: armed_away
        card:
          type: custom:button-card
          entity: alarm_control_panel.grave_alarm
          icon: mdi:security
          action: more_info
          state:
            - value: 'armed_away'
              color: rgb(0, 255, 0)
      - type: conditional 
        conditions:
          - entity: alarm_control_panel.grave_alarm
            state: armed_home
        card:
          type: custom:button-card
          entity: alarm_control_panel.grave_alarm
          icon: mdi:shield-home
          action: more_info
          state:
            - value: 'armed_home'
              color: rgb(251, 210, 41)
      - type: conditional 
        conditions:
          - entity: alarm_control_panel.grave_alarm
            state: disarmed
        card:
          type: custom:button-card
          entity: alarm_control_panel.grave_alarm
          icon: mdi:shield-off
          action: more_info
          state:
            - value: 'disarmed'
              color: rgb(255, 0, 0)
0 Likes

#255

To my knowledge, this card doesn’t properly support the changing of the icons based on the state of the entity. It has been requested a couple of times.

As a work around, you could use a conditional card, one for every state, where the main difference is the icon itself. I posted an example of this process earlier in this thread.

0 Likes

#257

I use a different setup that works for me but its a lots of more things into it…

The setup I use and it involves input_boolean, input_select and a sensor.
I dont know if its the smartest setup but it works for me… But I have the same problems like you… some of the icons wont work like mdi:shield-lock or mdi:shield-home, they just turn up blank.

I dont know why and I am still looking into it.

0 Likes

#258

Any idea what I’m doing wrong here…can’t get the custom button to size properly?

      - type: horizontal-stack
        cards:
          - type: light
            entity: light.bedroom_light
          - type: custom:button-card
            entity: switch.bedside_lamp
            action: toggle
0 Likes

#259

Hi, thank you for this awesome Button card. However, could you implement an icon template, please? And I can’t switch off and on group of switches/lights, only toggle. Thanks :slight_smile:

1 Like

#260

Hi there,

is it me or is something broken right now?
For some reason it says:

custom card doesn’t exist: button-card.

I did not touch anything and it worked for weeks…
Is anyone else having this problem?

EDIT: Now it works again, after about 1 hour…

0 Likes

#261

happened the other day. Came back after awhile, just an issue with the source location not been available.

0 Likes

#262

The Light Card is difficult to tweak. I suspect the issue is with the card itself. Many have tried to tweak this card and failed.

0 Likes

#263

Indeed, I also don’t get these icons working.

0 Likes

#264

Same, mine just break randomly. Long-pressing and then selecting the action works; but just the tap no longer does, most of the time.

0 Likes

#265

Hi All,

I would like to highly recommend an alternative to Button Card, one that is being actively developed, and whose developer is responsive!

It’s a follow-on from Custom UI: Tiles, and is a fully functional and separate LoveLace custom card that follows strongly in its original Tiles roots. It is very customisable and feature rich with what you can do!

Anyway, as a taster, this is what I’ve done with mine:
image

Discussion starts here: Custom UI: Tiles
Github here: https://github.com/rodrigofragadf/lovelace-cards/tree/master/tiles-card

5 Likes

#266

most likely becuase the ‘@polymer/lit-element’ package this custom card depends on has been deprecated (https://www.npmjs.com/package/@polymer/lit-element)

0 Likes

#267

Found a fix, you need to edit the the button-card.js file.

remove the ‘^’ from line 3 in the url (next to the version number 0.5.2)

} from 'https://unpkg.com/@polymer/[email protected]^0.5.2/lit-element.js?module';

becomes

} from 'https://unpkg.com/@polymer/[email protected]/lit-element.js?module';

if this does not fix it for you it is likely because HA has cached the js file. to force it to refresh add or increment the version number in your ui-lovelace.yaml
eg:

resources:
  - url: /local/button-card.js?v=1.0.5
2 Likes