Fair enough, I tought you were referring to list of cards only
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.
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.
thanks for the pointer!
and yes, I strongly hope we can use templating in the regular cards, hope this will be implemented, sooner than later.
All custom cards are very nice, but when something odd happens we are always warned by the Devs we shouldnāt use custom ui or cards, because no official HA codeā¦
that being said, I will most certainly check this card, and the possibilities it holds.
uhhh what devs are telling you to not use custom cardsā¦? youāve been told wrong, especially as the core team of devs on the front-end all produce a lot of custom cards
yes, I knowā¦and its a bit of a surprise indeed.
Before, in regular HA, when we used a custom components, we where warned not to complain or file issues for regular HA when using custom cards. As stung by wasps sometimesā¦
We did of course, even when using perfectly fine custom components like variable, or hue.
Now Lovelace is being pushed as the default, in its still immature state, all of a sudden all of these custom cards tumble over each other, fixing, or should I say filling in what the core cards donāt offer (yet).
Not sure what to make of that. I for one am very careful building a full Lovelace interface on custom cards mainly, as many of us here do. I very much like the looks of it, but since LL takes a lot of the system, and because of that one of my main components (Hue) is being tackled often, I hold back just yet.
Of course I have a LL setup, try to keep up as much as I can. But for me templating the interface is really important, and thatās where LL seriously lacks ( in the official cards that is).
This new Templatable card could be an improvement on that, though I much prefer to see LL embrace templating in its core.
Youāll likely not see 95% of what is in custom cards in core, ever. But that discussion isnāt really for this threadā¦
Donāt know if itās on your side or custom-card-modder. The issue is when applying custom-card-modder to your card it works without errors but after maybe 5 seconds it will lose the custom-card-modder modifications, no error is reported in the log and all works normally just the mod who disappear.
Here is the code
card:
type: 'custom:config-template-card'
config:
entity: sensor.co
name: CO
show_card: true
stroke_width: 20
fill: 'rgba(100,100,100,0.0)'
type: 'custom:circle-sensor-card'
stroke_color: >-
${this.hass.states['sensor.co'].state === 'Clear' ? '#55f26e' :
this.hass.states['sensor.co'].state === 'Warning' ? '#e8e400' : '#d30000'}
style:
border-radius: 100px
font-size: 1.1em
font-weight: bold
line-height: 1.5
type: 'custom:card-modder'
Thanks for looking into it.
looks like weāre in business with lists!
going to do some actual testing this time and hopefully have a release later tonight I got excited last night and released it after ~2 minutes of testing
Iāll put the config of the above in the Readme as well as it uses all demo platforms and is an easy one to test with
Update: I managed a full 15 minutes of testing before I got distracted
- Now properly support lists within configurations
- New template variables introduced to cleanup templates
states
anduser
I wouldnāt put the card-modder on my card, put it at the top level of config
instead. Iām not really rendering anything. Havenāt played with it much, in general actually, to say for sure though.
I still canāt get this to workā¦
- type: 'custom:config-template-card'
config:
type: custom:hui-entities-card
title: TESTING
entities:
- entity: switch.hall_light
icon: '${states[''switch.hall_light''].state === ''on'' ? ''mdi:music'' : ''mdi:sleep''}'
sure, appreciate that.
my fear is the lovelace-ui.yaml is going to be littered with all these customizations in the cards, where we could use the customize section, and of course the custom-ui in regular Ha to keep things tidy.
imagine needing something like this customize_glob in Lovelace:
sensor.*_motion_sensor_temperature:
templates:
icon_color: >
if (state < -5) return 'rgb(30, 255, 255)';
if (state < 0) return 'rgb(30, 144, 255)';
if (state < 10) return 'rgb(255, 255, 0)';
if (state < 15) return 'rgb(255, 211, 30)';
if (state < 20) return 'rgb(0, 128, 0)';
if (state < 25) return 'rgb(255, 165, 0)';
if (state < 30) return 'rgb(255, 0, 0)';
if (state < 35) return 'rgb(85, 0, 0)';
return 'rgb(47, 0, 0)';
just a few lines now, neatly separated from the config itselfā¦
or maybe an even better example used on 153 states in my instanceā¦:
automation.*:
templates:
icon_color: >
if (state === 'on') return 'rgb(251, 210, 41)';
return 'rgb(54, 95, 140)';
I have tested latst version and there mut be something odd going on with the mini-graph-card and second-entity-row because there is nothing wrong in my opinion with the code.
Without the template card it works, with it it doesnāt, and to test, I used the example code from git repo
- type: vertical-stack
cards:
- type: horizontal-stack
cards:
- type: custom:config-template-card
config:
- type: custom:mini-graph-card
name: "${states['sensor.dark_sky_temperature'].state > 10 ? 'Cozy' : 'Too Hot/Cold'}"
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
1 Step forward!
I donāt have to use ā- type: custom:mini-graph-cardā
I do have to use ātype: custom:mini-graph-cardā
Now the odd thing is that is āblinkingā
And the icon is not loading at all
Put double quotes on the outside and single quotes in the inside
icon: "${states['switch.hall_light'].state === 'on' ? 'mdi:music' : 'mdi:sleep'}"
Thatās exactly why balloob didnāt want templates in Lovelace
Iāll play around with it tonight, but my guess is that the show
is being botched.
As for the blinking, I was afraid of this happening, especially with things with animations. Pretty much what is happening, is that anytime there is ANY state change, the full card is being redrawn. Perhaps @rhodges idea to have an entity to use could be beneficial in that we would only watch for a state change on that entity. Or perhaps a list of entities to watch for state changes fromā¦? Will have to ponder on that.
As @iantrich suggested, the card-modder has to be used inside the template card. The following works:
- type: 'custom:config-template-card'
config:
type: 'custom:card-modder'
style:
--paper-item-icon-color: "${ parseFloat(states['sensor.dow_futures_change_pct'].state) > 0 ? 'green' : 'red' }"
card:
type: 'custom:hui-entities-card'
title: Stocks
show_header_toggle: false
entities:
- entity: sensor.dow_futures
icon: "${parseFloat(states['sensor.dow_futures_change_pct'].state) > 0 ? 'mdi:arrow-up-bold-circle' : 'mdi:arrow-down-bold-circle' }"
Thank you for testing i will try it later when my time becomes mine again.