Custom Button Card: Templates vs. Lovelace-Gen

Slash · September 21, 2020, 3:33pm

thank you, I will try it

devastator · October 25, 2020, 6:36am

Hi @petro, could you share your code for counting the number of lights? Right now I have a separate automation just for counting the lights on per group …

petro · October 25, 2020, 11:55am

In jinja or JS?

devastator · October 25, 2020, 12:37pm

Preferably JS, but I’m fine with both as long as it updates whenever the count changes.

petro · October 25, 2020, 1:10pm

I’m not sure if my code will help. I built my cards based on the assumption that you provide the button with a list of entities to count from.

      items.forEach(item => {
        var count = 0;
        item.entities.forEach(entity_id => {
          var stateobj = states[entity_id];
          if (stateobj !== undefined)
            if (item.state.includes(stateobj.state))
              count = count + 1
        });
        if (count > 0){
          var units = (count == 1) ? item.units.plural(true) : item.units;
          ret.push(getEntityIcon(count, units, item.icon, item.color));
        }
      });

located in this file

github.com

Petro31/home-assistant-config/blob/578610f9c0fce49471c09165d8db57bea5aec1dd/lovelace/templates/summary/overview.yaml

# lovelace_gen

{%- macro fixstate(state) %}
{%- if state in [True, False] %}{{- 'on' if state else 'off' -}}
{%- else %}{{- state -}}
{%- endif %}
{%- endmacro %}

{%- set aspect_ratio = aspect_ratio|default('1/1') %}

{%- if triggers_update is not defined and entities is defined and display is defined %}
{%- set triggers_update = entities %}
{%- else %}
{%- set triggers_update = triggers_update | default([]) %}
{%- endif %}
{%- set display = display | default([]) %}
{%- set max_display = max_display | default(4) %}

{%- if triggers_update and triggers_update is iterable %}
  {%- set ns = namespace(filtered=[]) %}

This file has been truncated. show original

dvbit · October 26, 2020, 10:29pm

@petro I think you are there Man
I am trying since some days now to have a button with some other sensors embedded in.
The idea is bulb (big) plus triggering / related elements smaller at the corners (motion sensor ,illuminance, switch) dynamic (ie with corresponding state live)
Tried that with custom fields in button card
No luck
Just new one example then I walk alone

dvbit · October 26, 2020, 10:34pm

By the way. Wonderful ordered config. I will remodel mine on yours

petro · November 30, 2021, 12:32pm

A post was merged into an existing topic: Lovelace: Button card

petro · November 30, 2021, 12:31pm

Please create a new thread or ask this in the custom button card thread. This thread is about the differences between the button card and lovelace gen.

maverik80 · November 30, 2021, 12:46pm

sorry thanks

lmamakos · February 9, 2022, 5:44am

@petro, I was just looking at your configuration and it’s given me more than a few ideas!

I’ve also been using lovelace_gen and jinja2 macros to generate some portions of my lovelace UI (though still mostly just getting started.) One thing that you might consider when using jinja2 macros to generate the YAML configuration is that JSON-style syntax works just fine inside of YAML files. So you can mostly just ignore the whitespace indentation issue completely, and have the macro emit JSON in the place that it’s invoked.

I made a post about this about a year ago that lays this out. This approach might simplify things a bit.

petro · February 9, 2022, 12:26pm

I knew about that before hand, the problem is if you make mistakes it’s much harder to see the unformatted json. I made the yaml things, so I can quickly copy and paste the entire templates into the template editor to see the results printed in a nice fashion.