@ASNNetworks
Could you help me here pls?
You need to use Javascript templates. You’re trying to use Jinja2 templates with button card. That doesn’t work. Most likely you used Markdown card before.
name: |
[[[
return "Er zijn " + states['sensor.current_lights_on'].state + " lampen aan";
]]]
I’m not a Javascript expert myself though. So for further help you should ask in the Button-Card thread.
1 Like
Superb thx
I’m gonna try that and seek further help if needed.
True i used markdown before
1 Like
I tried and i get this error
I asked in the custom button topic, and they say your code is correct and its probably a decluttering thing… lol
Since the code works within button-card, you should open a ticket and report this at the github repo of decluttering-card. The code itself is fine as others have confirmed. So not much else there is to do about it. Seems like decluttering-card doesn’t render Javascript somehow.
So you need to think outside the box and reverse it, which is how I use it myself. Use the variable in the template itself and only the entity in the card on lovelace. I like to keep my decluttering-card as tidy as possible and only pass through single codes (and set everything else like text strings and Javascript in the template).
Use this in your decluttering template:
name: |
[[[
return "Er zijn " + states['[[lights]]'].state + " lampen aan";
]]]
And then in the decluttering-card code:
type: custom:decluttering-card
template: notification_template
variables:
- lights: sensor.current_lights_on
This way you can use this decluttering template only for cards that need to show the current lights on.
If you have a different room, just change the entity variable to a different sensor tracking those lights and it’s set. If you want something else to show instead of current lights on, copy the template and change the variables.
1 Like
it has never done that, and it will not,. Has been asked before, when decluttering came to existence.
Decluttering card simply replaces strings (like anchors) and does not use templating itself. Its as I explained in button-card this morning: Lovelace: Button card - #6376 by Mariusthvdb
you can however, replace a string in the template, as you did above.
1 Like
Working, thx a lot !
1 Like
I cannot get this to work for some reason. I installed it via HACS and HACS placed the folder in: /www/community/decluttering-card
So, in ui-lovelace.yaml I have:
resources:
url: /local/www/community/decluttering-card/decluttering-card.js
type: module
decluttering_templates:
test_template:
card:
type: button
tap_action:
action: toggle
entity: '[[test_variable]]'
I then have a manual card added to my dashboard:
type: custom:decluttering-card
template: test_template
variables:
- test_variable: light.basement_office_light_switch
I receive the error : "Cannot read properties of undefined (reading ‘test_template’)
This doesn’t go in lovelace.yaml, but in configuration.yaml if you use YAML mode.
lovelace:
mode: yaml
resources:
Also, the path has been change a few months ago to hacsfiles instead of local/www/community. hacsfile path points to the same folder, so the location of the files is correct.
- url: /hacsfiles/decluttering-card/decluttering-card.js
type: module
After adding that you need to restart Home Assistant and then it should be loaded (or click the three dots menu (top-right) and click on Reload resources for Lovelace to pick up changes without restarting Home Assistant. You can also call lovelace.reload_resources service directly.) Sometimes it helps to clear your browser caches if a card isn’t loaded.
can anyone spot the issue in my decluttering config… I must be overlooking the obvious, but can see it…
decluttering:
card:
type: conditional
conditions:
- entity: media_player.googlehome_[[id]]
state_not: unavailable
row:
entity: input_boolean.googlehome_[[id]]
state_color: true
and card config, with the verbose conditional row, and the one using the decluttering:
- type: custom:decluttering-card
template: conditional_row_boolean
variables:
- id: library
- type: conditional
conditions:
- entity: media_player.googlehome_library
state_not: unavailable
row:
entity: input_boolean.googlehome_library
state_color: true
somehow I keep getting:
even though I strictly followed (copied) the verbose row, and as yo can see the variables get replaced correctly…
can we not do this for a row?
edit
not without a trick, but with custom:hui-element, yes we can !
card:
type: custom:hui-element
row_type: conditional
conditions:
- entity: media_player.googlehome_[[id]]
state_not: unavailable
row:
entity: input_boolean.googlehome_[[id]]
state_color: true
thanks Thomas for the nudge!
i installed decluttering-card.js in www directory
in configuration.yaml
lovelace:
mode: yaml
resources:
- url: /local/decluttering-card.js
type: module
in ui-lovelace.yaml
decluttering_templates: !include decluttering_templates.yaml
in decluttering_templates.yaml
cover_button:
type: custom:vertical-stack-in-card
cards:
- type: horizontal-stack
cards:
- type: custom:button-card
size: '[[size]]'
entity: '[[entity]]'
- type: custom:button-card
size: '[[size]]'
entity: '[[entity]]'
template: cover_stop
- type: custom:button-card
size: '[[size]]'
entity: '[[entity]]'
- type: custom:button-card
name: '[[name]]'
my card
- type: custom:decluttering-card
template: cover_button
variables:
- entity_id: sensor.processor_use
- vm_name: processor
my mistake
Cannot read properties of undefined (reading 'cover_button')
I ask for help
1 Like
Variables in call
and variables in a template
must have same names.
I wonder…is it possible above type of configuration if dashboad is not in yaml mode? I mean, to have one single file with all “declulttering templates” inside and then just call it from dashboard? I guess not, because i get an error when trying to save if i make that file and then try to call it with
decluttering_templates: !include decluttering_templates.yaml
at the beginning of selected dashboard (by edit dashboard → raw configuration editor, inserted before “view”)
It would be nice to work, though… i have same templates in three dashboards…
Imho most of experienced people are using yaml-mod.
Storage mode is basically for testing something.
And yes, for dashboards in storage mode I need to paste a particular decluttering template into a “raw” file - just for testing.
1 Like
Weah, welll, i like to have UI available. Many things can be done way quicker than write whole code for each and every little thing… apart that, i’m not exactly “experienced” guy, i’m still learning…
Nonetheless, HA owners tend to “force” all addon writers to comply their code with UI interface, so i guess running in UI is something which is prefferred.
Thanks!
I had to indent my decluttering card file. An entry looks like this:
# card with main entity and lock entity
locking-thing:
card:
type: 'custom:button-card'
entity: '[[thing_entity]]'
name: '[[thing_name]]'
template: standard-button
triggers_update: all
aspect_ratio: '[[aspect_ratio]]'
styles:
... and so on
Also note that the first line after the defining name is “card:”
There’s actually a simple answer but you won’t like it. !include only works in yaml mode.
Yes, you’re correct. The reason i don’t like yaml mode (yet) is lack of my programming skills. Maybe some day…never say never, right?
you probably didn’t understand
you probably didn’t explain your issue