Button-card with if statement

[Dirk2.0 (Dirk)]

I have combined a button with a sensor to mute my AVR (Denon) and I will make the button smart.

Why doesn’t this work with the icon and the perform_action? If this works I’ll do the same for the AVR power button.
(I think only the action can be done with a script, and call a service. But does not seem like the shortest way.)

icon: >-
	{% if sensor.avr_zone2_mute == 'on' %}
		mdi:volume-off
	{% else %} 
		mdi:volume-on
	{% endif %}

tap_action:
  action: perform-action
  perform_action: >-
  	{% if sensor.avr_zone2_mute == 'on' %}
		rest_command.mute_off_z2
	{% else %} 
		rest_command.mute_on_z2
	{% endif %}

Button Card configuration

show_name: true
show_icon: true
type: button
entity: sensor.avr_zone2_mute
name: Mute
icon: mdi:volume-off
tap_action:
  action: perform-action
  perform_action: rest_command.mute_on_z2
  target: {}
show_state: true
icon_height: 80px

Yaml configuration

sensor

rest:
  - scan_interval: 10
    resource: http://<IP-ADDRESS>:8080/goform/formZone2_Zone2XmlStatusLite.xml
    sensor:
      - name: "AVR_zone2_volume"
        value_template: "{{ value_json.item.MasterVolume.value }}"
      - name: "AVR_zone2_power"
        value_template: "{{ value_json.item.Power.value }}"
      - name: "AVR_zone2_mute"
        value_template: "{{ value_json.item.Mute.value }}"

perform_action

rest_command:      
  mute_on_z2:
    url: "http://<IP-ADDRESS>:8080/goform/formiPhoneAppDirect.xml?Z2MUON"
    method: get
  mute_off_z2:
    url: "http://<IP-ADDRESS>:8080/goform/formiPhoneAppDirect.xml?Z2MUOFF"
    method: get

[Ildar_Gabdullin]

You cannot use jinja templates for a stock Button card.
Try using a custom:button-card (there is a dedicated main thread for this card where all discussions should take place), it accepts templates on JS.

[Dirk2.0 (Dirk)]

I have read that topic (Fun with custom:button-card not all).

Do I understand it wrong or do you have to hack everything together to get it ( home-assistant ) working?

[Ildar_Gabdullin]

This is the main button-card thread.
As I said, the stock Button card cannot be used with jinja templates:

type: button
...
icon: >-
  {{ ... some jinja code ... }}

But the custom:button-card accepts JS templates:

type: custom:button-card
...
icon: >-
  [[[ ... some JS code ... ]]]

[Dirk2.0 (Dirk)]

I feel a bit stupid

If I write code, an interprer is needed for that.
The stock Button Card can’t handle Jinja and JS Code, I understand.

Which button can handle jinja code?

How can I indicate the button who should interpet my code?

[Ildar_Gabdullin]

@Dirk2.0

Which button can handle jinja code?

None)
No stock cards accepts jinja (except Markdown).

@Dirk2.0

How can I indicate the button who should interpet my code?

What do you mean?

[Dirk2.0 (Dirk)]

I will ask the question differently.

How do I configure a button where the color is green if the devices is off and the action is to turn it on. And the color is red when the devices is on and the action is turn off.

[Ildar_Gabdullin]

If you choose a custom button-card - suggest to check corr. Docs & ask in the main button-card thread (link was provided above).
If you choose a stock button card - to change an icon’s color you can use card-mod (suggest to ask in the main card-mod thread).

[Dirk2.0 (Dirk)]

I have tried to understand that (a lot off pages). I can coded in bash, ptyhon, php, html, javascript, C++, but this is not clear to me
It’s not towards you, I’m glad you put time into it…

I don’t have ui-lovelace-card.yaml, ui-lovelace.yaml, or a www folder, and HACS is not installed.

Do I understand it wrong or do you have to hack everything together to get it ( home-assistant ) working?

[Ildar_Gabdullin]

@Dirk2.0

HACS is not installed.

I recommend installing HACS.
Then you will not need to register resources manually.
HACS does at least 2 things:

• downloads a custom plugin & then stores it in “www/community/PLUGIN_NAME” folder;
• adds a corresponding line to “resources”.

The “www” folder may be created manually inside the main “/config” directory (same directory where a “configuration.yaml” file is stored).
The folder is usually used to keep custom plugins (like custom cards), images etc.

The “ui-lovelace.yaml” is only needed if you use a yaml-mode dashboard.
Since you are a beginner - suggest you to start using a default “storage-mode” dashboard (where you can use UI to edit cards).

[Dirk2.0 (Dirk)]

Ok thanks.

I’ll try…

[Dirk2.0 (Dirk)]

O I need also make an account on github, is that normal?

[Ildar_Gabdullin]

@Dirk2.0

O I need also make an account on github, is that normal?

I think yes…

[Dirk2.0 (Dirk)]

Next…

How can I manually install an integration? Frigate - HACS/GitHub Issue

Setup Home Assistant OS (everything up-to-date) Frigate in a Docker container on a separate machine Attempting to install the Frigate (NVR) integration Issue The Frigate integration is installed via HACS HACS requires a GitHub account I created a GitHub account. The first thing I did was attempt to set up HACS. GitHub immediately flagged my account - message: “You are marked as spam, and therefore cannot authorize a third party application.” I have not received any explanation as to why. I ha…

Do I understand it wrong or do you have to hack everything together to get it ( home-assistant ) working?

But it’s add to the github account… maybe remove and add again

<edit>
After revoke it was not possible to add HACS.
Still "You are marked as spam, and therefore cannot authorize a third party application.”
</edit>

[Ildar_Gabdullin]

This thread goes beyond the initial question. Suggest to search in HACS-related threads. (people may not even react since the thread’s title is not related to HACS)

[Dirk2.0 (Dirk)]

What a hassle this is. Created a new account on Git, same error.

And all this just because I want a button to track the status.

Grrrr

[Ildar_Gabdullin]

Just a guess:
HACS needs info from github like “when a plugin XYZ was updated” to inform a user (btw, this is one of reasons why users use HACS).
To get this info from guthub, an application (here - HACS) needs some kind of “authorization”. And you authorize your particular application to get this info. For this you need your own github account.

[Dirk2.0 (Dirk)]

New emailaddress, new Git account, new IP-address.
It’s done!

(still) next error: Custom element not found: button-card

I have add button-card.js also in Resources, but I don’t know the exact path.
button-card.js is stored in the same folder where configuration.yaml is stored and in the subfolder www (a copy)

/.homeassistant/button-card.js
/.homeassistant/www/button-card.js
/.homeassistant/www/community/button-card.js

You also need to add the card to Settings → Dashboards → ⋮ → Resources

As per the installation instructions for each card.

[Dirk2.0 (Dirk)]

Add to ui-lovelace.yaml

resources:

• url: /local/button-card.js
  type: module

After everything is working, I’ll clean up same files and post the correct config.

[Dirk2.0 (Dirk)]

How can I use this statements ?

The value off show state is On of Off of this entity: sensor.avr_zone2_mute

                  type: 'custom:button-card'
                  state:
                    - value: 'On'
                      styles:
                        card:
                          - background-color: gold
                    - value: 'Off'
                      styles:
                        card:
                          - background-color: slategrey