Lovelace: Check Button Card

It sounds like you don’t have MQTT discovery enabled if the topic is being created but you don’t see any entities in HA.

you don’t have MQTT discovery enabled

That was it! Thanks!

Thank you @Gluwc for this great work!
Is it possible to send a notification using a notify service when a button change severity (color)?

Unfortunately it’s not possible to send any notifications from the Lovelace frontend, as anything from the front end requires it to be open in a browser.
You can however use the timestamp from the sensor created by this card to set up an automation that sends a notification.

1 Like

Hi @Gluwc, thank you for your answer!
Ok, I am doing so now. I would like to notify me when button goes from green to red. In my case, it happens after 4 days but instead of using this, I would prefer to create a variable I can change in the frontend so it will impact the button severity trigger and in the same time the automation for notification.
For this, I thought of creating an input_number. I am able to create it and I can check the value and change it as needed. However, I am not able to use it in the button severity. Do you know why? This is what I wrote:

I have no error message but the button rains red, no matter what is the time since I clicked.

Try 📝 100% Templatable Lovelace Configurations

This should let you use a templated value in your severity, I haven’t tried it myself though.

3 Likes

It works indeed, thank you!

Thank you for developing this card. I think I’m going to put it to good use. One small error in the HACS documentation under the link section at the end. I couldn’t get it to work until I changed null to module.

   - url: /community_plugin/check-button-card/check-button-card.js
     type: null
1 Like

Big new release :tada:1.0.0 :tada: with a bunch of breaking changes :sob:. Most things should be fairly easy to fix, but if you need any help let me know.

2 Likes

Great release, using this a lot now! Couple questions:

  1. Can display_limit be multiple options as well? As a real-life example, I only want to see weeks when the timeout is more than 1 week out, until it’s less than a week left, then I want it to count down in days, and the last day I want it to count down in hours. Is that possible currently?

  2. Will you also add the ability to put in specific dates in the YAML, rather than the amount of time as timeout? That would be really helpful for certain things. See here: https://github.com/custom-cards/check-button-card/issues/12

Hey reckless, these are great suggestions. But neither are currently possible.
I did already have some ideas to add a display_mode so you could have the time displayed as ‘1 week and 3 days ago’ or ‘1.5 weeks ago’.
I’ll see if I have some time soon to add some of these features.

Thank you! Especially the dates feature would be so incredibly handy to have in real-life. This card can be used for real-life reminders in a great way and that would make it even better.

I have tried updatng the status using mqtt.publish however I can see the due date not updating in the card though I can see the status being updates in the ‘States’ under Developer Options

topic: homeassistant/sensor/test_due_date2/state
payload_template: '{ "timestamp":{{ states("sensor.test_due_date") }},"timeout":"{{ ((strptime(states.calendar.electricity_bill.attributes.start_time, "%Y-%m-%d %H:%M:%S").strftime("%j") | int - (now().strftime("%j") | int) }} days","timeout_timestamp":1586328448,"unit_of_measurement":"timestamp", "visible":true }'
retain: true

After publishing this, I can see the status updates in States

timestamp: 1583652365
timeout: 27 days
timeout_timestamp: 1586328448
unit_of_measurement: timestamp
visible: true
friendly_name: test_due_date2

But the lovelace UI still show
chrome_P59hAHdQJQ

lovelace code

- type: custom:check-button-card
    title: Test due date 2
    entity: sensor.test_due_date2
    width: 50%
    due: true
    timeout: 3 days
    color: Green

The intention is after I have clicked on the check button, the “chore” is marked completed and then the “timeout” needs to be adjusted to the next due date, which is calculated above (in this case 27 days)

How can I make a template sensor with the timestamp to show days? Im just looking for a sensor that will show how many days since x.

Trying to get this to work.
I do have a broker running and working
However, as i read the card will start in configuration mode…
Where do i see that?
It only says “not loaded”

Anyone? Really want to use this card

Screenshot of error?
Have you loaded it on your resources?

I need to add it to resources too? Cause the github page didnt mention this

Yes you will need to add it to your resources

/hacsfiles/check-button-card/check-button-card.js
Type: Module

Silly of me, indeed
Now its working, i do know now what is meant with config mode.
I entered some check buttons, and it asked if i wanted it to create…
Good working.
However still some questions…

1)How do i use the dutch translations of months/days… etc etc
i entered & value in dutch but its showing in english
Should i add “text” in the code?
2) can someone explain how to use severity… i see value, hue, color… i understand value, but how do i see how it counts?

  1. should i use mqtt discovery prefix? cause i use mqtt for other stuff too

  2. having some desing issue too
    When using vertical-stack, i dont have the white background, which i dont like

When using custom:stack-in-card, i do have the white background, but i lose space between the check buttons.
How do i get both in one?