[FR] Two icon states

[xbmcnut]

Hi,

I'd love to be able to track my garage door using one of your buttons and use one icon mdi:garage (green) when closed and another icon mdi:garage-open (red), when open. Very high WAF.

Is that doable?

[kuuji]

@xbmcnut I have a working version of a new feature that will allow you to do different color for different state but nothing for different icons yet.

For now you can probably have two buttons and control the display with a conditional card. Not ideal but that'd work.

[xbmcnut]

That is great, thank you. The two color icon option would be great for now. I'll keep and eye out.

[kuuji]

Hey @xbmcnut! Here's what I have

              - type: "custom:button-card"
                entity: input_select.cube_mode
                icon: mdi:cube
                action: service
                show_state: true
                state:
                  - value: 'sleeping'
                    color: var(--disabled-text-color)
                  - value: 'media'
                    color: rgb(5, 147, 255)
                  - value: 'light'
                    color: rgb(189, 255, 5)

That's a button for a select input. It calls a service to select the next option when you click on it. That was already possible before, now the new thing is the state parameter. Here I defined 3 states with 3 values and 3 different colors.

What do you think?

[xbmcnut]

That's above and beyond. Awesome! That will allow for many variables and is a welcomed addition. Thank you. I look forward to trying it out.

[kuuji]

@xbmcnut It's released!

[kuuji]

I renamed your issue. I'm gonna keep it around for the icon part of it. It'll require a bit more work.

[xbmcnut]

I add the following to test.

            - type: "custom:button-card"
              entity: input_select.pool_pump
              icon: mdi:cube
              action: service
              show_state: true
              state:
                - value: 'Auto'
                  color: var(--disabled-text-color)
                - value: 'On'
                  color: rgb(5, 147, 255)
                - value: 'Off'
                  color: rgb(189, 255, 5)

Am I using it correctly as I get the following error.

http://ipofhass:8123/local/lovelace/button-card.js?v=0.0.2:165:46 Uncaught TypeError: Cannot read property 'domain' of undefined
11:55 AM components/system_log/__init__.py (ERROR)

[kuuji]

You specified an action service but you didn't define which service and what data to send.

edit: @xbmcnut

[xbmcnut]

Ah. Just copied your example above and edited entity and items. Will dig deeper.

[oyvindhn]

A possibility for a change of garage-icons as described above would be much appreciated

[kuuji]

There is a way to do that currently actually @oyvindhn. The button card can use the icon attribute of an entity, so if you have an automation that changes that attribute to whatever you want when on state change, it might work.

I haven't tested that though.

[warwickbuilds]

There is a way to do that currently actually @oyvindhn. The button card can use the icon attribute of an entity, so if you have an automation that changes that attribute to whatever you want when on state change, it might work.

I haven't tested that though.

I've tried the attribute icon settings, but it isn't working for me, maybe because the garage uses an icon template to set it.

Able to the above senario or using the state - value settings would be awesome

[kuuji]

I'll look into that then ;)