Lovelace: Bringing back entity-filter (monster-card)

Monster card

Update on 6th of July: now filtering supports attributes!
Update on 12th of July: changelog added https://github.com/ciotlosm/custom-lovelace/blob/master/monster-card/changelog.md

As some of you know, in 0.72 a magical type of card called entity-filter was available in Lovelace. This card allowed for very smart content grouping without the need to specify a static list of entity_ids.

This card however was recently changed to allow only filtering on state, leaving users that desired even more flexibility without a toy.

I decided to take some code out of the original card and with guidance from @eddi89 I was able to bring back the card with more options under the name monster-card.

kitchen
41775896-71d42556-762e-11e8-8b02-d75c7824300a

You can find the code here

Instructions

The instructions are also found on the above repo.

  1. Download monster-card.js
  2. Place the file in your config/www folder
  3. Include the card code in your ui-lovelace.yaml
resources:
  - url: /local/monster-card.js?v=1
    type: js

Note: You can change v=1 to a higher number whenever updating code to avoid having to clear cache in all browsers

  1. Write configuration for the card in your ui-lovelace.yaml
- type: "custom:monster-card"
  card:
    type: glance
    title: Monster
  filter:
    include: [{}]
    exclude:
      - entity_id: "*yweather*"
      - domain: group
      - domain: zone
- type: custom:monster-card
  card:
    type: glance
    title: Monster
  filter:
    include:
      - domain: device_tracker
        options:
          secondary_info: last-changed
        attributes:
          battery: 53
          source_type: gps

:mega: You can find more examples in the docs.

  1. Reload your Lovelace tab (no need to restart Home Assistant or other things) and you should see the card.

PROFIT!

FAQ: GitHub - ciotlosm/lovelace-thermostat-dark-card: 🌡 Thermostat card with a round and black feel to it

Buy Me A Coffee if you like the cards so much that wish to express your gratitude.

13 Likes

This looks great, Why did the entity filter card become a state filter? I hope the monster is integrated into the main release.

I don’t think monster will make it into lovelace. I don’t want to comment on the decision to move to state filter, as this was explained on chat and git and I don’t want to explain it wrong.

On the positive side, I am AMAZED on how easy it is to create custom cards and integrate them. This card is nice also because it reuses existing lovelace card, so any updates on those will get automatically in monster card.

Snippet:

    if (!this.card) {
      this.card = document.createElement(`hui-${this.config.card.type}-card`);
      this.appendChild(this.card);
    }

Ohh gosh, im just playing with lovelace on 0.72 right now and thought that entity_filter card was one of the greatest new features in HA in long time.

2 Likes

It’s been removed because it was too flexible, causing it to break with other features that we were adding across lovelace:

  • One could not override names, because to override names you already have to define the entities to expect. Why not mention them right away?
  • Same for custom UI
  • Same with ordering of entities

Yes, these things could be accomplished but you get a very complicated configuration that was difficult to reason about what was going to happen.

Removing it makes the Lovelace UI more explicit, meaning we could easily add a feature to show which entities are unused in the UI.

And at the end of the day, if you really really think you need it, copy this 86 lines custom card from the forums and you can have it back :+1:

7 Likes

Thanks for commenting and giving the background. I’m looking forward to seeing how Lovelace develops.

It is a shock with it going away, but in a few releases time I may not miss it, or as you point out I can easily have the monster.

I am not exactly sure what has been removed but would the following code still work on 0.73.0b6?

  - name: 'Docker'
    cards:
      - type: entity-filter
        filter:
          - entity_id: '*homeassistant*'
        card_config:
          title: "Home Assistant"

Config changed to allow it to be more dynamic.

You could use monster card with the following config:

      - type: custom:monster-card
        card:
          title: Home Assistant
        filter:
          include:
            - entity_id: '*homeassistant*'

Or have to switch to a manual entity_id list and probably entities card.

Thank you very much! I can use Lovelace ui again.

You now get attributes filter as well in monster-card

A small improvement to hide empty cards:

if (entities.length === 0) {
this.style.display = ‘none’;
return;
}

Thanks. You cand do a PR to help the rest

I will just leave this here for inspiration for a new feature added:

- type: custom:monster-card
  card:
    type: glance
  filter:
    include:
      - domain: climate
  when:
    entity: device_tracker.demo_paulus
    state: not_home

Update: This will probably be possible to replace soon for any card with below code when PR gets merged:

      - type: entity-filter
        show_empty: false
        entities:
          - device_tracker.demo_paulus
        state_filter:
          - not_home
        card: 
          type: custom:monster-card
          card:
            type: glance
          filter:
            include:
              - domain: climate

So entity-filter will support the monster-card features? Does that mean the show_header_toggle will work as well, as it currently doesn’t with monster-card.

@kylerw entity-filter will probably be able to be used as a wrapper to toggle any card on or off, not specifically monster-card.
show_header_toggle won’t work, but you can raise an issue for it to be added to monster card here: https://github.com/ciotlosm/custom-lovelace/issues

Thanks, just submitted.

Also, is it possible to filter on a calculation? state: < 20 for a battery alert card, for example?

Not at the moment. That is a bit more tricky to implement.

I’ll add a feature request with that understanding. Would be a great use of the filter, in my opinion.

Thanks for this! Is it possible to filter on if a state is not equal to something?

I am trying to have a cleaner way to display my chromecasts so I only want them to display if the state is not equal to ‘off’.

Use exclude part