100% Templatable Lovelace Configurations

templates
lovelace
Tags: #<Tag:0x00007fd0786cddb0> #<Tag:0x00007fd0786cdba8>

#43

@arsaboo Haven’t you missed off a config?

In any case this doesn’t work either.

  - type: custom:config-template-card
    config:
      type: custom:hui-entities-card
      title: TESTING
      entities: 
        - entity: switch.hall_light
          icon: "${this.hass.states['switch.hall_light'].state === 'on' ? 'mdi:music' : 'mdi:sleep'}"

#44

Add some logs, might be a bug in the traversing of the nested objects

Edit: Yeah there probably is, I think i ONLY did objects and not lists :man_facepalming: maybe someone can check it out.


#45

@Mariusthvdb, didn’t you want this


#46

Thanks,

Added the two lines:

        console.log(this._config.config);
        console.log(cardConfig);

But didn’t increase any “logging level” in the console


#47

As I said above, likely a bug on lists


#48

It can be, I am working with multiple objects inside “config”

Also the temperature one was “- type”

Checking


#49

Doesn’t @everyone ?! :star_struck:


#50

Yes sorry, writing during tests so I didn’t scroll all the way down before hitting “Reply” :smiley:


#51

haha probably! I don’t see a use for it yet but I’ve only glanced at the git page. If I can leverage this to simplify conditional cards, then that will be a great benefit. I’m gonna look into that when I get home.


#52

I’ll check it out tonight, but pretty much need another conditional checking if it is an array, and if so handle the array as a whole before applying back to the key value


#53

So I think you’re right, that might be the issue, because now I changed the temperature one to this code:

                  - type: custom:config-template-card
                    config:
                      type: custom:mini-graph-card
                      name: Outside
                      icon: "${this.hass.states['sensor.dark_sky_temperature'].state >= 10 ? 'mdi:thermometer-chevron-up' : 'mdi:thermometer-chevron-down'}"
#                      icon: mdi:thermometer
                      more_info: false
                      group: false
                      entities:
                        - sensor.dark_sky_temperature
                      hour24: true
                      show:
                        graph: false
                        icon: true
                        extrema: true
                        fill: false
                      align_state: center

And in the console I see something new (it doesn’t work still, but still it’s something different)

config-template-card.js?track=true:1838 Uncaught (in promise) RangeError: Maximum call stack size exceeded
    at Array.forEach (<anonymous>)
    at HTMLElement._evaluateConfig (config-template-card.js?track=true:2311)
    at Object.entries.forEach.entry (config-template-card.js?track=true:2315)
    at Array.forEach (<anonymous>)
    at HTMLElement._evaluateConfig (config-template-card.js?track=true:2311)
    at Object.entries.forEach.entry (config-template-card.js?track=true:2315)
    at Array.forEach (<anonymous>)
    at HTMLElement._evaluateConfig (config-template-card.js?track=true:2311)
    at Object.entries.forEach.entry (config-template-card.js?track=true:2315)
    at Array.forEach (<anonymous>)

#54

Infinite loop…:kissing: perfection…


#55

@iantrich Would you be willing to post a run down of what is needed to compile this? I’m thinking of contributing, but I’ve not yet compiled any typescript stuff for HA.

Thanks


#56

npm install or yarn install
npm run rollup


#57

That was disturbingly easy. I should have figured that out myself. Thanks!


#58

hehe

Side note, this is still not working even if I don’t use a list

              - type: custom:config-template-cardx
                config:
                  type: entities
                  title: House Members
                  show_header_toggle: false
                  entities:
                    - entity: person.andrea
                      type: "custom:secondaryinfo-entity-row"
                      secondary_info: "${this.hass.states['binary_sensor.andrea_oneplus5_charging'].state === 'true' ? 'Charging' : 'Not Charging'}"

I am wondering if there is also something that doesn’t work with the way that the “custom:secondaryinfo-entity-row” works


#59

entities is a list


#60

Fair enough, I tought you were referring to list of cards only :slight_smile:


#61

Would something like the following work assuming the lists thing is fixed?

- type: custom:config-template-card
  config:
    type: vertical-stack
    cards: "${js_loop_thing_to_build_list_of_child_cards_with_more_templating()}"

I don’t need examples or anything (yet). Just a simple yes/no/maybe with some hackery would suffice. Wondering if it’s worth the time installing and figuring out the necessary JS to even attempt it.


#62

:man_shrugging:it’s pretty open-ended. Only thing to consider is that you’ll need to return a list in your case, not a single object. I haven’t played around with returning a list at all. The bug is in iterating over a list.