Lovelace: Decluttering Card

mcfrojd · March 21, 2020, 11:50pm

I only get error “Uncaught ReferenceError: service_data is not defined”

      tap_action:
        action: call-service
        service: '[[service]]'
        service_data: '[[[service_data]]]'
#--------------------------------------------------------------
- type: horizontal-stack
        cards:
        - type: custom:decluttering-card
          template: button_icon_and_text
          variables:
            - name: 'MUTE'
            - icon: volume-mute
            - service: media_player.volume_mute
            - service_data:
                entity_id: media_player.sonos_living_room
                is_volume_muted: true

RomRider · March 22, 2020, 12:04am

There is a typo in my answer, it should be service_data: '[[service_data]]', note the 2 brackets instead of 3

RomRider · March 22, 2020, 1:36am

Version 0.4.3

Bug Fixes

Restore support for type: divider (Fixes #22)

RomRider · March 22, 2020, 2:55pm

Version 0.5.0

New features

Support for picture-elements:

decluttering_templates:
  <template_name>
    default:  # This is optional
      - <variable_name>: <variable_value>
      - <variable_name>: <variable_value>
      [...]
    element:  # This is where you put your element config
      type: icon
      [...]

kirpat · April 2, 2020, 3:56am

i wanted to use decluttering card,
but dont know how to start
i would like to use it for remote control and i want to add it with raw configure or ui editor.
someone please guide me
thanks

Soloam · April 3, 2020, 2:51pm

Hello, I have a decluttering to simplify my lights setup, this is my template:

light_rgb_template:
  card:
    type: custom:slider-entity-row
    entity: light.[[light_name]]
    style: |
      :host {
        color: red;
      }
    min: 1
    toggle: true
    max: 100
    step: 1

I can make the text red with the style, I want to change the color of the text based on a sensor state, but for test I only what to make it red. This does not apply the color.

Can I do this?

Thank You

RomRider · April 3, 2020, 8:10pm

Not with decluttering-card but card-mod supports templates:

github.com

thomasloven/lovelace-card-mod/blob/master/README.md#templating

card-mod
========

[![hacs_badge](https://img.shields.io/badge/HACS-Default-orange.svg)](https://github.com/custom-components/hacs)

## Requires Home Assistant version 0.98 or later

Allows you to add css styles to any lovelace card.

For installation instructions [see this guide](https://github.com/thomasloven/hass-config/wiki/Lovelace-Plugins).

Install `card-mod.js` as a `module`.

```yaml
resources:
  - url: /local/card-mod.js
    type: module
```

## Usage

This file has been truncated. show original

jmart518 · April 3, 2020, 10:24pm

Does anybody know how to use variables that will handle a different amount of entities?

For example I would like to use a single decluttering-card for multiple different entity cards (some have three entities, others have more)

From the documentation I got this:

entities:
    entity: '[[entity_1]]'
    entity: '[[entity_2]]'

Which does work when I have exactly the same amount as the array. But how do I approach it with varying amounts of entities. Is it possible?

Thanks for your help

RomRider · April 4, 2020, 6:48am

That’s not possible, sorry.

jmart518 · April 4, 2020, 2:37pm

No worries, thanks @RomRider

VMCosco · April 16, 2020, 6:13pm

I have a horizontal-stack of five conditional button cards, one of which is always hidden. Prior to implementing decluttering-card, the row showed only four buttons. After creating a template, it now shows four buttons and a blank space (for the fifth button). I completely understand why this is happening, the contents of the decluttering card are hidden, not the decluttering card itself. Is there a way I adjust my template to remedy this or am I better just not using the decluttering card for this?

Template:

  sonos_group:
    card:
      card:
        entity: '[[entity]]'
        name: '[[name]]'
        template: switch_button_thick_name
        type: 'custom:button-card'
      conditions:
        - entity: input_select.sonos_master
          state_not: '[[state_not]]'
      type: conditional

Card:

    cards:
      - type: custom:decluttering-card
        template: sonos_group
        variables:
          - name: Deck
          - state_not: media_player.sonos_deck
          - entity: switch.group_sonos_deck
      - type: custom:decluttering-card
        template: sonos_group
        variables:
          - name: Garage
          - state_not: media_player.sonos_garage
          - entity: switch.group_sonos_garage
      - type: custom:decluttering-card
        template: sonos_group
        variables:
          - name: Living Room
          - state_not: media_player.sonos_living_room
          - entity: switch.group_sonos_living_room
      - type: custom:decluttering-card
        template: sonos_group
        variables:
          - name: Lounge
          - state_not: media_player.sonos_lounge
          - entity: switch.group_sonos_lounge
      - type: custom:decluttering-card
        template: sonos_group
        variables:
          - name: Office
          - state_not: media_player.sonos_office
          - entity: switch.group_sonos_office
    type: horizontal-stack

RomRider · April 16, 2020, 8:40pm

conditional-card sets it’s own CSS display attribute to none, which in this case doesn’t take space in the horizontal-stack. But the decluttering-card is still taking the space. For the space to not be taken, decluttering-card would have to set it’s own display to none

I’ll release a new version that can handle this (hopefully)

RomRider · April 16, 2020, 9:37pm

Version 0.6.0

New Features

The card will be hidden if the child card is also hidden (useful for conditional card)

Bugfix

Child card would not be updated properly sometimes

RomRider · April 16, 2020, 9:37pm

This is now fixed with 0.6.0

VMCosco · April 16, 2020, 9:54pm

well that was fast, I just commented out my decluttering template

Mariusthvdb · April 17, 2020, 9:54am

could it be it shows as 0.5.0?

I updated from 0.4.3 so didn’t have 0.5 installed:

thought it didn’t warrant an issue on Github…

RomRider · April 17, 2020, 11:59am

Right… Forgot to bump the version number

Edit: Just released 0.6.1. No changes, just a version bump

klogg · April 20, 2020, 11:56am

What are the pros and cons of between using this decluttering card and using includes in lovelace_gen and passing it variables?

(e.g.

- !include
  - includes/some_file.yaml
  - entity: input_boolean.some_boolean
    name: My Bollean
    color: red

)

Is there for example a performance benefit of one over the other because of the way they work?
Apologies if this isn’t a sensible question.

RomRider · April 21, 2020, 9:12am

!include and lovelace gen will be faster during rendering than decluttering-card (as it doesn’t add a new card). You can see it as an alternative.

However, with decluttering-card not need to have separate file for each template since you can reference a template name.

I honestly use both in my config

klogg · April 21, 2020, 9:19am

I’m looking forward to seeing it