Lovelace: Button card

2 Likes

@kuuji It will be great if you can include the blank card (no-card) option.

@jackar Will be great if you can submit a PR to the original card, so that everything remains in one place.

@kuuji I canā€™t seem to implement the card on my fire tablet using fully kiosk. I get the red custom element does not exist error message. Works perfectly fine on safari and iOS. Any idea what can be causing the issue on the fire tablet? Can it have something to do with the module type?

It looks like it has to do with support of custom elements.
I do use create a custom-element with this card (thus why itā€™s a module). Some browser donā€™t have support for it and itā€™s definitely possible that the browser on the fire tablet doesnā€™t do you have the ability to install chrome?

My fault , on https://github.com/ are 2 projects kuuji/button-card and giacomocarrozzo/button-card.
The no-card.js file is belong giacomocarrozzo/button-card repository and not in kuuji/button-card
I apologize and Thank you.

1 Like

I will try to elaborate for pass a value to script as @Igor_Jurisic is MIA. In Custom UI: Tiles there was an option to send value to scripts. So you can use value from button and pass that to single script. That way i donā€™t have to use multiple scripts. Like in this example:

Button:

  - entity: script.ac_script
    icon: mdi:hotel
    label: Bedroom
    style_template: "return 'background-image: url(\"/local/climate/' + entities['climate.bedroom'].state + '.png\");'"
    column: 1
    row: 6
    data:
      value: bedroom

Script:

  ac_script:
    alias: AC script
    sequence:
      - service: climate.set_temperature
        data_template:
          entity_id: climate.{{value}}
          temperature: >
            {% if is_state(('input_text.' + value), 'Cool') %}
              25
            {% else %}
              23
            {% endif %}
          operation_mode: >
            {% if is_state(('climate.' + value), 'Off') %}
              {{states(('input_text.')+ value)}}
            {% else %}
              Off
            {% endif %}
      - service: input_boolean.turn_on
        data_template:
          entity_id: input_boolean.{{value}}
2 Likes

Any ideas what I need to do to make this work on fully kiosk browser?

How do I force the buttons to be square?

I just downloaded Fully Kiosk on my Android 8.0 phone and the buttons appear to work properly. Newer versions of Android use Chrome for the Webview and it gets updated frequently. If youā€™re on an older version of Android or on a Fire device the older webview may be the problem.

You could download APKs for the updated webview on apkmirror.com but I havenā€™t tried yet on a fire device so proceed at your own risk.

My last release have support for blank-card as well as custom services.

4 Likes

Itā€™s in the last release!

Just re-downloaded this, and then restarted him assistant, but canā€™t see it in the custom updater cardā€¦?

You need to configure custom_updater to pull the version file from my repo. Itā€™s all in the instructions here

@kuuji, hereā€™s my latest attempt with a slightly modified button card to add in unit_of_measure and put my labels at the bottom in a smaller font.

1 Like

I did this, please note that the other lovelace components do not need to add anything in the customer_updater: in configuration.yaml . For me is the same no problem in adding the line, just wanted to notice this

That is exactly how updater works. You can manually update the card, if you donā€™t want to use the updater.

This looks really cool! Would you mind opening a PR for the unit_of_measure?

Letā€™s share the love! :wink:

I did this, please note that the other lovelace components do not need to add anything in the customer_updater: in configuration.yaml . For me is the same no problem in adding the line, just wanted to notice this

custom_updater uses a default list of cards and components. These are managed by the owner of custom_updater I believe => GitHub - custom-components/custom_updater: [DEPRECATED]šŸ“¦ A component which allows you to track and update custom cards/components and python_scripts
https://raw.githubusercontent.com/custom-cards/information/master/repos.json

I added a similar json with my card in my repo so that users can configure custom_updater to work with my card.
If I wanted my card to show up in custom_updater without having users do any config, I would need to get access to this repo and update it every time I do a release. Iā€™ll talk to the owner and do that eventually but for now it was quicker form me to just add the json to my repo and provide some minimal support.

Maybe I am too new to Lovelace, but I cannot get this card to work. All I get is ā€œCustom element does not existā€.

I suspect it is due to the ui-lovelace-card.yaml file which was not on my system and which I created manually in the /config folder (including the mentioned code). Any thoughts?

Everyone has to create that file manually, did you read this pageā€¦

ā€¦youā€™re probably just missing something fundemental.

1 Like